{"id":590,"date":"2016-05-23T01:52:30","date_gmt":"2016-05-23T01:52:30","guid":{"rendered":"http:\/\/www.andrefelizardo.com.br\/blog\/?p=590"},"modified":"2018-09-11T15:04:30","modified_gmt":"2018-09-11T15:04:30","slug":"ionic-creator-exportando-e-gerando-apk","status":"publish","type":"post","link":"http:\/\/www.andrefelizardo.com.br\/blog\/ionic-creator-exportando-e-gerando-apk\/","title":{"rendered":"Ionic Creator – exportando e gerando apk"},"content":{"rendered":"

Continuando nossa jornada sobre o Ionic Creator<\/a>, vamos agora exportar o app que fizemos na ferramenta, para podermos editar o c\u00f3digo e gerar o instalador para o Android (.apk).<\/p>\n

Se voc\u00ea n\u00e3o tem i-d-e-i-a do que \u00e9 Ionic, muito menos Ionic Creator, comece por aqui<\/a>!<\/p><\/blockquote>\n

No Ionic Creator, no canto direito superior, n\u00f3s temos 3 (tr\u00eas) bot\u00f5es interessantes:<\/p>\n

o bot\u00e3o de Temas e SCSS, o bot\u00e3o de exporta\u00e7\u00e3o e o bot\u00e3o de compartilhamento.<\/p>\n

\"Bot\u00f5es<\/a>

Clique na imagem para ampliar<\/p><\/div>\n

Temas e SCSS<\/h2>\n

Nesta op\u00e7\u00e3o temos duas abas. Na aba de temas, podemos modificar as cores e fontes utilizadas no projeto, tanto para o cabe\u00e7alho, menu ou para as op\u00e7\u00f5es de cores padr\u00e3o que a ferramenta exibe para bot\u00f5es, por exemplo.<\/p>\n

Na aba de SCSS podemos escrever c\u00f3digo SCSS (que \u00e9 uma forma mais produtiva de escrever CSS, similar ao SASS) para sobrescrever\/reescrever os estilos j\u00e1 definidos pelo Ionic.<\/p>\n

\"Temas<\/a>

Clique na imagem para ampliar<\/p><\/div>\n

Compartilhar<\/h2>\n

Assim como eu fiz no post Ionic Creator – Crie atrav\u00e9s de interface<\/a>, voc\u00ea pode precisar compartilhar o app que est\u00e1 prototipando com mais algu\u00e9m. Nesta op\u00e7\u00e3o podemos compartilhar atrav\u00e9s de link, e-mail e at\u00e9 SMS.<\/p>\n

\"Compartilhar<\/a>

Clique na imagem para ampliar<\/p><\/div>\n

Exportar<\/h2>\n

Na vers\u00e3o gratuita temos duas formas de exportar um projeto do Ionic Creator. Uma bem simples \u00e9 baixar o ZIP do app, e colocar na pasta WWW de onde estamos desenvolvendo o app.<\/p>\n

Mas a forma que vamos utilizar \u00e9 outra, onde o pr\u00f3prio Ionic se d\u00e1 o trabalho de colocar os arquivos na pasta correta que \u00e9 atrav\u00e9s da CLI.<\/p>\n

\"Exportando<\/a>

Clique na imagem para ampliar<\/p><\/div>\n

Abra ent\u00e3o o prompt de comando e navegue at\u00e9 a pasta onde vamos criar o app.<\/p>\n

Depois digite o comando:<\/p>\n

ionic start\u00a0imc-felizardo\u00a0<\/em>creator:[sua-id]<\/pre>\n
Essa ID muda de acordo com projeto e conta, ent\u00e3o, verifique o seu pra inserir corretamente no comando.<\/p>\n
\"Importando<\/a>
Clique na imagem para ampliar<\/p><\/div>\n
Ap\u00f3s digitar o comando, o Ionic vai baixar os arquivos necess\u00e1rios pra que seu app funcione, ent\u00e3o, vai depender da sua velocidade de internet.<\/p>\n
Vamos ver se funcionou…voc\u00ea lembra como faz pra rodar um app no Ionic?<\/p>\n
Primeiro entre na pasta do projeto, que no caso \u00e9 imc-felizardo, e depois digite o comando:<\/p>\n
ionic serve<\/pre>\n
Gerando APK com Ionic<\/h2>\n
APK \u00e9 Android Package, que \u00e9 um arquivo compilado, usado de forma paralela a Google Play para instalar programas no Android (agora sim hein!).<\/p>\n
 <\/p>\n
Prefere aprender em v\u00eddeo?<\/p>\n