Desenvolvendo aplicativos nativos em HTML5 para 7 plataformas utilizando o mesmo código. Apresentação para o DevFest BR 2012.

3. Pré-Requisitos
Android SDK
ADT Plugin
Eclipse
Cordova

4. HelloWorld!
./create <diretorio> <pacote> <projeto>

5. APIs Cordova
Accelerometer File
Camera Geolocation
Capture Globalization
Compass Media
Connection Notification
Contacts Splashscreen
Device Storage
Events

6. Globalization
navigator.globalization.getPreferredLanguage(
successCallback,
errorCallback
);

7. Globalization
navigator.globalization.getPreferredLanguage(
function (language) {
alert(’idioma: ' + language.value + 'n');
},
function () {alert(’Erro ao identificar idioma n');}
);

8. Notification
notification.alert
notification.confirm
notification.beep
notification.vibrate

9. Contacts
contacts.create
contacts.find

11. Estrutura
<div data-role="page">
<div data-role="header">
<h1>Cabeçalho</h1>
</div><!-- /header -->
<div data-role="content">
<p>Hello world</p>
</div><!-- /content -->
<div data-role=”footer">
<p>Rodapé</p>
</div><!-- /footer-->
</div><!-- /page -->

12. Listview
<ul data-role="listview" data-inset="true" data-filter="true">
<li><a href="#">Item 1</a></li>
<li><a href="#">Item 2</a></li>
<li><a href="#">Item 3</a></li>
<li><a href="#">Item 4</a></li>
<li><a href="#">Item 5</a></li>
</ul>

13. Botões
<a href="#" data-role="button”>Botão</a>
<a href="#" data-role="button" data-icon="star">Estrela</a>
<a href=”#" data-role="button" data-icon="delete"
data-iconpos="notext">Delete</a>

14. Transições
<a href=”#" data-transition=”pop">transição</a>

15. Estrutura
<div data-role="page">
<div data-role="header">
<h1>Cabeçalho</h1>
</div><!-- /header -->
<div data-role="content">
<p>Hello world</p>
</div><!-- /content -->
<div data-role=”footer">
<p>Rodapé</p>
</div><!-- /footer-->
</div><!-- /page -->

16. Links
http://incubator.apache.org/cordova/
http://jquerymobile.com/
http://developer.android.com/

17. Contato
{
“nome”: “Claudio Ortiz Meinberg”,
“email”: “claudio.meinberg@googlemail.com”,
“arquivos”: [
“apresentação”: {
“slideshare”: “ClaudioMeinberg”,
“prezi”: “ClaudioMeinberg”
},
“github”: “ClaudioMeinberg”
],
“twitter”: “@ClaudioMeinberg”
}