Nativescript Template

https://leevikopakkala.github.io/NatifScript-Template/

Natifscript-angulaire avec Sidedrawer et TabView

Il s'agit du modèle ultime avec une structure améliorée pour vous aider à lancer votre premier projet d'application ou de client en un rien de temps.

Aperçu

Nous connaissons tous le processus lent de configurer le projet et de créer une base de fonctionnement avant de pouvoir ajouter des fonctionnalités. Avec ce modèle, vous obtenez une application entièrement fonctionnelle hors de la boîte avec Sidedrawer et TabView.

Parfait pour les débutants et les professionnels.

En utilisant les meilleures pratiques, développez votre première vraie application mobile en aucun cas.

Modèle nativescript composé de composants nativescript sidedrawer et tabview:

Références aux plugins individuels utilisés dans ce modèle:

• https://market.nativescript.org/plugins/tns-template-drawer-navigation-ng
• https://market.nativescript.org/plugins/tns-template-blank-ng
• https://market.nativescript.org/plugins/tns-template-tab-navigation-ng

Installation:

Rapide:

1. Installer node.js https://nodejs.org/

2. Installer nativescript cli npm install -g nativescript

3. Vérifiez que Nativescript CLI fonctionne tns

4. Installez Android Studio (ou iOS équivalent) https://developer.android.com/studio/

• 4.1 Open Android Studio -> AVD Manager -> Créer un émulateur

5. (Facultatif mais utile) Installez https://www.nativescript.org/natifscript-sidekick

Courir:

1. git clone https://github.com/LeeviKopakkala/Nativescript-Template

2. cd Nativescript-Template

3. tns device android --available-devices ou tns device ios --available-devices

4. tns run android / tns run android --device {device name} ou tns run ios / `TNS Run iOS --Device {Nom de l'appareil}

Si vous utilisez Sidekick

4. Acolyte ouvert

• 4.1 Ajouter un projet

• 4.2 Sélectionner l'émulateur

• 4.3 Run

Architecture

Le composant RadsidedRawer est configuré en tant que point de départ de l'application dans:

• /app-component.ts - Configure le contenu du tiroir latéral et définit une sortie de routeur de page pour les pages.

RadsideDrawer a la structure des composants suivante:

• RadSideDrawer - Le composant pour afficher un tiroir sur la page.
• tkDrawerContent Directive - marque le composant qui contiendra le contenu du tiroir.
• Directive tkMainContent - marque le composant qui conservera le contenu principal de l'application.

Il y a cinq composants vierges situés dans ces dossiers:

• /browse
• /featured
• /home
• /search
• /settings

Coiffage

Ce modèle est configuré pour utiliser SASS pour le style. Toutes les classes utilisées sont basées sur le thème de base {N} - consultez la documentation pour comprendre comment la personnaliser. Vérifiez-le pour voir les classes que vous pouvez utiliser sur quel composant.

Il dispose de 4 fichiers de style global qui sont situés à la racine du dossier de l'application:

• _app-variables.scss - Contient les variables SASS globales qui sont importées sur les styles de chaque composant.
• _app-common.scss - La feuille de style commun global. Ces règles de style sont appliquées à la fois sur Android et iOS.
• app.android.scss - la feuille de style Android global. Ces règles de style sont appliquées uniquement à Android.
• app.ios.scss - la feuille de style iOS mondial. Ces règles de style sont appliquées uniquement à iOS.