apps android e hibridas

Apps Android e Hibridas16 horas de explanação, diálogo e prática

Julho 2016

por Luiz Henrique Rauber [email protected] - fb.com/luizrauber

Exceto onde tiver outra referência, este material é Creative Commons com Atribuição-CompartilhaIgual (CC BY-SA). Pode copiar, alterar e redistribuir à vontade, mesmo para fins comerciais, mas desde que me cite e

licenciem as novas criações sob termos idênticos. Like Free Software :)

CC BY-SA [email protected] || fb.com/luizrauber 2/105

Mas primeiro….

Conselhos Richard Feynman (1918-1988), Nobel de Física em 19652 tipos de sabedoria: “Saber o nome de algo” e o “Saber algo”

1) Escolha um conceito; tema ou objetivo do que quer saber

2) Escreva-o como se estivesse ensinando uma criança; nada subentendido

3) Volte no tema e pesquise sobre ele; especifique o 1-2 da forma 2)

4) Revise e simplifique ainda mais; sem jargões e sabendo usar analogias

http://www.bbc.com/portuguese/geral-36750825


Manifesto para o desenvolvimento ágil de software

Estamos descobrindo maneiras melhores de desenvolver software fazendo-o nós mesmos e ajudando outros a fazê-lo. Através deste trabalho, passamos a valorizar:

Indivíduos e interação entre eles mais que processos e ferramentasSoftware em funcionamento mais que documentação abrangenteColaboração com o cliente mais que negociação de contratosResponder a mudanças mais que seguir um plano

Ou seja, mesmo havendo valor nos itens à direita, valorizamos mais os itens à esquerda.

http://www.manifestoagil.com.br/


Coding Dojo - Turma 2015-2016 – Tec Informática Senac


O quê?

Onde?

Como?


Touchscreem Resistivo/ CapacitivoSensores internos e acopláveis

SO parcialmente opensource

Versões por Google e por fabricantes

Intergração serviços Google

“Apps” via Google Play/ Lojas Terceiros/ .apk numa sandbox

SDK padrão e com o QEMU


Go https://www.android.com/intl/pt-BR_br/

https://www.android.com/intl/pt-BR_br/


Aprofundando

SILBERCHATZ, 2013

Android/Linux

Java - JVM

Multithread

Sai swap entra application state

...

CC BY-SA [email protected] || fb.com/luizrauber 11/105http://source.android.com/source/index.html


Mais (ou menos) em https://www.android.com/intl/pt-BR_br/history/

https://www.android.com/intl/pt-BR_br/history/


https://developer.android.com


javac -version http://www.oracle.com/technetwork/java/javase/downloads/jdk8-

downloads-2133151.html

android-studio/bin/studio.shdependências lib32z1 lib32ncurses5 lib32bz2-1.0 lib32stdc++6

Bora instalar? (Enquanto isso, mais teoria)


2005 – comprou startup Android, Inc. (SO para câmeras)

2006 – Protótipo “Sooner” mirando em BlackBerry

2007 – Mirarão no IPhone*

2007 – Fundação Open Handset Alliance (Google, HTC, Dell, Intel, Motorola, Qualcomm, Texas Instruments, Samsung, LG,

T-Mobile, Nvidia… https://pt.wikipedia.org/wiki/Open_Handset_Alliance)

2007 – Primeira SDK para desenvolver Android

2007 – Google registrou várias patentes sobre smartphone


2008 – HTC Dream/ T-Mobile G/ G1 com Android

2010 – Linha Nexus (HTC, Samsung, LG, Asus, Motorola)


http://www.androidpit.com.br/evolucao-dos-smartphones-a-linha-nexus


http://www.gadgetdetail.com/android-version-market-share-distribution/


http://www.forbes.com/sites/eladnatanson/2016/06/06/breaking-the-android-ios-duopoly-will-android-and-ios-ever-get-a-serious-third-competitor/#e62c5104cad0

CC BY-SA [email protected] || fb.com/luizrauber 26/105https://github.com/googlesamples/


fonte: developer.android.com


Resumo de https://developer.android.com/guide/components/fundamentals.html


Os “aplicativos” são feitos na linguagem Java. Para desenvolver é necessário o SDK Android que compila e gera um Android Package

(.apk).


Os “apps” são adaptáveis em “tempo de execução” a vários tamanhos de telas, se tiver vários XML de layout de tela, e

configurações de hardware (como presença/ ausência giroscópio, câmera, gps…).


Cada “apps” rodando tem um ID de processo diferente sobre o Linux e um JVM própria, por isso isolando os componentes e evitando

conflito de apps (princípio do privilégio mínimo).


Os “apps” são baseados e desenvolvidos orientados à “componentes”, definidos como subclasses, que podem trabalhar

individualmente ou em conjunto, e a conexão de componentes é por “intenção”.


O sistema operacional e os padrões de desenvolvimento, idealizam o reaproveitamento de componentes, evitando redundância.


Quando um aplicativo requer o uso de um recurso, e já existe um componente que pode entregar este recurso, o aplicativo, via

componente, envia uma intenção de uso ao Android solicitando o recurso de um outro componente, se havendo a possilibidade, o

recurso é entregue.


As intenções por padrão são implícitas, sem definir qual mas sim quais tipos de componentes lhe são úteis. Assim se uma aplicação pede um recurso, e se existente mais de um componente que pode

entregar tal recurso, o usuário seleciona qual “aplicação” que irá usar pra entregar o recurso a aplicação inicial.


As “comunicações” entre componentes são em “tempo de execução”, via processos individuais, e direcionadas a um

componente em específico ou só ao tipo dele via intenções.

+https://developer.android.com/guide/components/intents-filters.html


4 tipos de componentes, sendo os 3 primeiros ativados por object intent, o outro pode ser 1 por aplicativo*


4.1 Activity: foca na interação com o usuário, logo a interface de cada de ação. Um único app pode ter vários componentes de atividades, que

podem ser compartilhadas (entre sí ou outros apps).


4.2Service: realiza a entrega para o usuário, sem a necessidade de

uma interface diretamente. Roda em background (segundo plano) podendo manter-se ou não vinculada a uma atividade e/ou se ligar a

outras que sejam iniciadas posteriormente.

+https://developer.android.com/guide/components/services.html


4.3BroadcastReceiver: Fazem as notificações internamente no Android, enviando ou recebendo dados para uma mesma, ou outra aplicação, de acordo com alguma condição. Podem ou não, gerar notificação

para o usuário. Sempre vinculado a outros componentes.


4.4ContentProvider: Compartilham e gerenciam o conteúdo do

aplicativo, lendo e gravando dados no local de persistência indicado (dado, SQLite, cartão, nuvem…)

+https://developer.android.com/guide/topics/providers/content-providers.html


Todo aplicativo Android tem o AndroidManifest.xml, onde estão informados as compatibilidades de dispositivos, recursos externos necessários pra execução, definições e requisitos dos aplicativos

que também devem ser mencionados ao “publicar” algo em uma loja de aplicativos...


… e lista todos os componentes necessários pra aplicação funcionar, indexando tipos, intenções e portanto é lido a cada chamada ao

aplicativo ou a um componente para verificar se o mesmo é necessário.


Também lista e identifica: os usuários e permissões, as API e seus níveis (versões Android) com suas respectivas bibliotecas, os

recursos de hardware e software necessários, outras informações pertinentes como versão, desenvolver, licença…


… e por fim

Escalonamento padrão é pilha, setado através das indentações nas Activities, sendo uma destas a “principal” que substitui a ideia de um

procedimento “main”.


E ai do mundo

Atenção a API Level, tamanho de tela e recursos (hw, sw, língua)

Mesma aplicação pode dar suporte a estes tipos, reconhecendo em run-time as especificações do app, mas tem que estar res/

Ciclo de vida da atividade é importantehttps://developer.android.com/training/basics/activity-

lifecycle/index.html (tá pt_br)


Ciclo de vida da atividade é importantehttps://developer.android.com/training/basics/activity-lifecycle/index.html (tá pt_br)


Tutorial Introdução

https://developer.android.com/training/basics/firstapp/index.html


Tutorial Fragmentos

https://developer.android.com/training/basics/fragments/index.html


http://www.cyanogenmod.org/

+400 modeloshttps://wiki.cyanogenmod.org/w/About

https://wiki.cyanogenmod.org/w/Main_Page

https://wiki.cyanogenmod.org/w/About

https://wiki.cyanogenmod.org/w/Main_Page


http://www.replicant.us/

Nexus S (I902x) Galaxy S (I9000) Galaxy S 2 (I9100) Galaxy Note (N7000) Galaxy Nexus (I9250) Galaxy S 3 (I9300) Galaxy Note

(N7000) Galaxy Note 2 (N7100) Galaxy Tab 2 10.1 (P51xx) Galaxy Tab 2 7.0 (P31xx) Galaxy Tab 2 10.1 (P51xx) Galaxy Tab 2 10.1

(P51xx) Uncompleted devices GTA04 Unmaintained devices Dream/Magic Nexus One

http://www.replicant.us/


https://www.tizen.org/

Mobile + Wearable + TV + IVI

https://source.tizen.org/https://www.tizen.org/about/about-linux-foundation

Android + HTLM5 +Jquery + Bada + Cordova + River Trail

https://www.tizen.org/

https://source.tizen.org/

https://www.tizen.org/about/about-linux-foundation


https://cordova.apache.org/Fonte: Loiane Groner


Fonte: Loiane Groner


https://cordova.apache.org/


jQuery é uma biblioteca JavaScript cross-browser desenvolvida para simplificar os scripts client side que interagem com o HTML.[1] … Usada por cerca de 77% dos 10 mil sites mais visitados do

mundo, jQuery é a mais popular das bibliotecas JavaScript.[2] [3] ... A sintaxe do jQuery foi desenvolvida para tornar mais simples a navegação do documento HTML, a seleção de elementos DOM, criar animações, manipular eventos e

desenvolver aplicações AJAX. A biblioteca também oferece a possibilidade de criação de plugins sobre ela. Fazendo uso de tais

facilidades, os desenvolvedores podem criar camadas de abstração para interações de mais baixo nível, simplificando o

desenvolvimento de aplicações web dinâmicas de grande complexidade.

https://pt.wikipedia.org/wiki/AJAX_(programa%C3%A7%C3%A3o)


Ajax (acrônimo em língua inglesa de Asynchronous Javascript and XML[1] , em português "Javascript e XML Assíncrono") é o uso

metodológico de tecnologias como Javascript e XML, providas por navegadores, para tornar páginas Web mais interativas com o

usuário, utilizando-se de solicitações assíncronas de informações. Foi inicialmente desenvolvida pelo estudioso Jessé James Garret

e mais tarde por diversas associações. Apesar do nome, a utilização de XML não é obrigatória (JSON é frequentemente

utilizado) e as solicitações também não necessitam ser assíncronas[2] .

https://pt.wikipedia.org/wiki/AJAX_(programa%C3%A7%C3%A3o)


JSON (com a pronúncia ['d ejz n], J-son em inglês, (Jay-son)), um ʒ əacrônimo para "JavaScript Object Notation", é um formato leve para intercâmbio de dados computacionais. JSON é um subconjunto da

notação de objeto de JavaScript, mas seu uso não requer JavaScript exclusivamente.[1] [2] O formato JSON foi originalmente criado por

Douglas Crockford e é descrito no RFC 4627. O media-type oficial do JSON é application/json e a extensão é .json.

A simplicidade de JSON tem resultado em seu uso difundido, especialmente como uma alternativa para XML em AJAX. Uma das

vantagens reivindicadas de JSON sobre XML como um formato para intercâmbio de dados neste contexto, é o fato de ser muito mais fácil

escrever um analisador JSON. Em JavaScript mesmo, JSON pode ser analisado trivialmente usando a função eval(). Isto foi importante para a

aceitação de JSON dentro da comunidade AJAX devido a presença deste recurso de JavaScript em todos os navegadores web atuais.https://pt.wikipedia.org/wiki/AJAX_(programa%C3%A7%C3%A3o)


PhoneGap é uma plataforma para desenvolvimento de aplicativos móveis em código aberto. Ela se utiliza da tecnologia Apache Cordova

para acessar a funções dos aparelhos móveis como acelerômetro, câmera e geolocalização, e permite por meio de alguns que os

desenvolvedores criem aplicações utilizando HTML5, CSS3 e JavaScript sem a necessidade de depender de APIs específicas. Os aplicativos

criados são compatíveis com iOS, Windows Phone e Android.

https://pt.wikipedia.org/wiki/PhoneGap


PhoneGap is Adobe’s productized version and ecosystem on top of Cordova. Like PhoneGap, many other tools and frameworks are also

built on top of Cordova, including Ionic,[8] Monaca, TACO, the Intel XDK,[9] and the Telerik Platform.[10] These tools use Cordova, and not

PhoneGap for their core tools.

Contributors to the Apache Cordova project include Adobe, BlackBerry, Google, IBM, Intel, Microsoft, Mozilla, and others.[11]

https://en.wikipedia.org/wiki/Apache_Cordova


https://pt.wikipedia.org/wiki/PhoneGap


Dá até pra transformar site html5 -> app html5 -> app nativo :D


https://cordova.apache.org/docs/en/latest/config_ref/index.htmlapp/www/config.xml


www/index.html


apt-get install npn :)https://nodejs.org/en/download/



Fonte: Rodrigo Branas


npm install -g cordovacordova create hello com.example.hello HelloWorld

cordova platform add ios --savecordova platform add android --save

cordova platform lscordova requirements

cordova buildcordova build ios

cordova build androidcordova emulate android

cordova run android


https://cordova.apache.org/plugins/ (1382 result(s) found)cordova plugin search camera

cordova plugin add cordova-plugin-camera


https://cordova.apache.org/docs/en/latest/plugin_ref/plugman.htmlnpm install -g plugman

plugman install --platform <ios|android|blackberry10|wp8> --project <directory> --plugin <name|url|path> [--plugins_dir <directory>] [--www

<directory>] [--variable <name>=<value> [--variable <name>=<value> ...]]


https://netbeans.org/kb/docs/webclient/html5-gettingstarted_pt_BR.html

https://netbeans.org/kb/docs/webclient/cordova-gettingstarted_pt_BR.html


npm install -g ionic

ionic start appnome blank

http://tableless.com.br/tutorial-ionic-meu-primeiro-app/


http://www.cssreflex.com/2015/11/xamarin-vs-cordova-main-counterpoints.html/


Publicando Google Play

Criar e validar uma conta de desenvolvedor

https://play.google.com/apps/publish/signup/Login com tua conta Google

Concordar e estar disposto a associar o meu registo de conta ao Contrato de Distribuição para Programadores do Google Play.

Pagar 25 dolares

Enviarhttps://play.google.com/apps/publish/ "Produção", "Beta" ou "Alfa"

https://play.google.com/apps/publish/signup/

https://play.google.com/apps/publish/


Configurar testes Alfa/Beta na Google Play Developer ConsoleEnviar APK como Teste e vai pra testadores (até 20 listas de 2 mil)

As versões Beta abertas e fechadas do seu app não terão avaliações públicas.

Google recomenda um Alfa fechado e um Beta aberto.Fechado vai link via Google (CSV ou manual), Aberto na Google Play

“O relatório de pré-lançamento no seu Google Play Developer Console identifica falhas, problemas de exibição e vulnerabilidades de

segurança.”

Versões novas em teste não derrubam a de produção.

Ainda tem lançamento gradual, via porcentagem aleatória


Fonte: Loiane groner


Facilitando

http://fabricadeaplicativos.com.br/

http://www.appmachine.com/pt-pt/

http://www.apps-builder.com/pt/home

http://pt.goodbarber.com/

http://www.shoutem.com/

https://www.easyeasyapps.net/

http://webrobotapps.com/

http://fabricadeaplicativos.com.br/

http://www.appmachine.com/pt-pt/

http://www.apps-builder.com/pt/home

http://pt.goodbarber.com/

http://www.shoutem.com/

https://www.easyeasyapps.net/

http://webrobotapps.com/


Mais links

http://appinventor.mit.edu/explore/

http://zeptojs.com/

http://handlebarsjs.com/

https://software.intel.com/pt-br/intel-xdk

http://appinventor.mit.edu/explore/

http://zeptojs.com/

http://handlebarsjs.com/

https://software.intel.com/pt-br/intel-xdk


Detalhes de divulgação da Google Play X Apple AppStore

Avaliações de todas as versões X Avaliações do app, atualizou zerouTítulo com 30 caracteres X Título com 255 | keywords ambos

8 screenshots atualizáveis aloca X 5 screenshots só em nova versãoMais texto e vídeo de minutos X Menores e 100 palavras chave

Pagou entrou X Pagou, revisam e ai entram~Maioria grátis X ~Maioria pago (90% entre US$ 0,99 e 1,99)

Maioria usuários BRICS X Maioria USMais downloads X Mais rentabilidade


http://corporate.canaltech.com.br/noticia/desenvolvedores/quanto-os-desenvolvedores-ganham-por-cada-aplicativo-criado-9931/


http://www.w3schools.com/html/html5_intro.asp

HTML5 API's (Application Programming Interfaces) HTML Geolocation HTML Drag and Drop HTML Local Storage HTML Application Cache HTML Web Workers HTML SSE

HTML5 Elementssemantic elements like <header>, <footer>, <article>, and <section>.form control attributes like number, date, time, calendar, and range.graphic elements: <svg> and <canvas>.multimedia elements: <audio> and <video>.

http://www.w3schools.com/html/html5_intro.asp


<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Title of the document</title></head>

<body>Content of the document......</body>

</html>

fonte: loiane groner


<!DOCTYPE html><html><head> <script>document.createElement("myHero")</script> <style> myHero { display: block; background-color: #dddddd; padding: 50px; font-size: 30px; } </style></head><body><h1>A Heading</h1><p>A paragraph.</p><myHero>My Hero Element</myHero></body></html>



Accelerationfunction onSuccess(acceleration) { alert('Acceleration X: ' + acceleration.x + '\n' + 'Acceleration Y: ' + acceleration.y + '\n' + 'Acceleration Z: ' + acceleration.z + '\n' + 'Timestamp: ' + acceleration.timestamp + '\n');};!function onError() { alert('onError!');};!navigator.accelerometer.getCurrentAcceleration(onSuccess,onError);



Capturar Fotofunction capturePhoto() {navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50,destinationType: destinationType.DATA_URL });}

Capturar Foto com Ediçãofunction capturePhotoEdit() {navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 20,allowEdit: true,destinationType: destinationType.DATA_URL });}

Busca Foto do Dispositivofunction getPhoto(source) {navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50,destinationType: destinationType.FILE_URI,sourceType: source });}<button onclick="getPhoto(pictureSource.PHOTOLIBRARY);">Biblioteca</button><br><button onclick="getPhoto(pictureSource.SAVEDPHOTOALBUM);">Album de Fotos</button>



Compass/Bússulafunction onSuccess(heading) {alert('Heading: ' + heading.magneticHeading);};!function onError(error) {alert('CompassError: ' + error.code);};!navigator.compass.getCurrentHeading(onSuccess, onError);



Conexãofunction checkConnection() {var networkState = navigator.connection.type;!var states = {};states[Connection.UNKNOWN] = 'Unknown connection';states[Connection.ETHERNET] = 'Ethernet connection';states[Connection.WIFI] = 'WiFi connection';states[Connection.CELL_2G] = 'Cell 2G connection';states[Connection.CELL_3G] = 'Cell 3G connection';states[Connection.CELL_4G] = 'Cell 4G connection';states[Connection.NONE] = 'No network connection';!alert('Connection type: ' + states[networkState]);}!checkConnection();



Propriedades do Dispositivofunction onDeviceReady() {var element = document.getElementById('deviceProperties');!element.innerHTML = 'Device Name: ' + device.name + '<br />' +'Device Cordova: ' + device.cordova + '<br />' +'Device Platform: ' + device.platform + '<br />' +'Device UUID: ' + device.uuid + '<br />' +'Device Model: ' + device.model + '<br />' +'Device Version: ' + device.version + '<br />';}



In App Browservar ref = window.open('http://loiane.com', '_blank', 'location=yes');ref.addEventListener('loadstart', function() { alert('start: ' + event.url); });ref.addEventListener('loadstop', function() { alert('stop: ' + event.url); });ref.addEventListener('exit', function() { alert(event.type); });



Notification - Alertnavigator.notification.alert('Alerta!', // messagealertDismissed,// callback'Titulo',// title'Botão'// buttonName);



Notification - Confirmfunction showConfirm() {navigator.notification.confirm('Confirmar?', // messageonConfirm,// callback to invoke with index of button pressed'Titulo',// title'OK,Cancel'// buttonLabels);}



Notification - Beep// Beepa 3 vezesfunction playBeep() {navigator.notification.beep(3);}Não funciona no iOS



Notification - Vibrar// Vibra por 2 segundosfunction vibrate() {navigator.notification.vibrate(2000);}


apps android e hibridas

Technology