Nativescript Template

https://leevikopakkala.github.io/nativescript-template/

Nativescript-angar

Este é o modelo definitivo com uma estrutura aprimorada para ajudá-lo a iniciar seu primeiro aplicativo ou projeto de cliente sem tempo.

Visão geral

Todos sabemos o processo lento de configurar o projeto e criar a base de funcionamento antes de poder adicionar recursos. Com este modelo, você obtém um aplicativo totalmente funcionando com a caixa com o SederdRawer e o TabView.

Perfeito para iniciantes e profissionais.

Usando as práticas recomendadas, desenvolva seu primeiro aplicativo móvel real em nenhum tempo.

Modelo Nativescript composto dos componentes Nativescript SidedRawer e TabView:

Referências a plugins individuais usados ​​neste modelo:

• 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

Instalação:

Rápido:

1. Instale o node.js https://nodejs.org/

2. Instale o Nativescript CLI npm install -g nativescript

3. Verifique se a CLI da Nativescript está funcionando tns

4. Instale o Android Studio (ou equivalente a iOS) https://developer.android.com/studio/

• 4.1 Open Android Studio -> AVD Manager -> Criar emulador

5. (Opcional, mas útil) Instale https://www.nativescript.org/nativescript-sidekick

Correr:

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 {Nome do dispositivo}

Se estiver usando Sidekick

4. Sidekick aberto

• 4.1 Adicionar projeto

• 4.2 Selecione emulador

• 4.3 Executar

Arquitetura

O componente RadSidedRawer é configurado como um ponto de partida do aplicativo em:

• /app-component.ts - configura o conteúdo da gaveta lateral e define uma tomada de roteador de página para as páginas.

RadSidedRawer tem a seguinte estrutura de componentes:

• RadSideDrawer - o componente para exibir uma gaveta na página.
• Diretiva tkDrawerContent - marca o componente que manterá o conteúdo da gaveta.
• Diretiva tkMainContent - marca o componente que manterá o conteúdo principal do aplicativo.

Existem cinco componentes em branco localizados nessas pastas:

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

Estilo

Este modelo está configurado para usar o SASS para estilo. Todas as classes usadas são baseadas no tema {n} central - consulte a documentação para entender como personalizá -lo. Confira para ver quais classes você pode usar em qual componente.

Possui 4 arquivos de estilo global localizados na raiz da pasta do aplicativo:

• _app-variables.scss - mantém as variáveis ​​SASS globais que são importadas nos estilos de cada componente.
• _app-common.scss - A folha de estilo comum global. Essas regras de estilo são aplicadas ao Android e ao iOS.
• app.android.scss - A folha de estilo Android global. Essas regras de estilo são aplicadas apenas ao Android.
• app.ios.scss - A folha de estilo iOS global. Essas regras de estilo são aplicadas apenas ao iOS.