CRIANDO APLICATIVOS PARA WINDOWS 8 USANDO APENAS HTML5 E JAVASCRIPT             André Paulovich | Ivan Paulovich
André Paulovich@andrepaulovichpaulovich@100loop.comwww.100loop.com www.raptors.com.br
Ivan Paulovich                            100loop.com                             www.raptors.com.br@ivanpaulovich   ivan@...
Caminhos possíveis                 HTML / CSS                 JavaScript
Estrutura de uma APP                       Biblioteca                         WinJS   Estilos                             ...
Tipos de arquivos
UI SURFACES, LAYOUT ENAVEGAÇÃO
Novos Controles de UI suportados
Novos Controles de UI suportados
Novos Controles de UI suportados
Novos Controles de UI suportados
Novos Controles de UI suportados
Como definir layouts diferentes?    Full screen                    Fill                      Snap
Como definir layouts diferentes?            Media Queries   Ahhh!
Questão de orientação
CONTROLES
Os controles são HTML mesmo?Sim! As aplicações usam controles convencionaisde HTML.
Mas temos muito mais!A biblioteca WinJS adiciona controles que não existemnativamente no HTML5.Você pode instanciar estes ...
EventosKey events in HTML/Javascript Metro apps:• DOMContentLoaded• activated• windows.load• checkpoint• resuming
Capturando eventos de controles WinJS1.   Encontre o objeto DOM usando:     getElementById() ou querySelector()2.   Acesse...
DEMO VAPT-VUPT
TRABALHANDO COM DADOS
Usando DataBinding em objetos HTMLDados podem ser atribuídos aos controles usando o atributo:data-win-bind.
Associando ItemTemplate para um ListViewVocê pode associar um template de repetição num ListViewusando o atributo itemTemp...
DEMO VAPT-VUPT
ANIMAÇÕES
Transições e Animações
DEMO VAPT-VUPT
Conhecendo o ASP.NET Web API
Conhecendo o ASP.NET Web API
Conhecendo o ASP.NET Web API
DEMO VAPT-VUPT
PERGUNTAS?
Criando aplicativos para Windows 8 com HTML5 e JavaScript - InfoTech 2012
Próximos SlideShares
Carregando em…5
×

Criando aplicativos para Windows 8 com HTML5 e JavaScript - InfoTech 2012

3.751 visualizações

Publicada em

Desde que foi apresentado pela primeira vez, o Windows 8 introduziu um novo tipo de aplicações - as Metro style apps - que oferecem uma experiência bastante diferente das aplicações tradicionais Desktop, não apenas do ponto de vista de utilização, mas também do ponto de vista de desenvolvimentoç. Nesta apresentação, vamos explorar a possibilidade de desenvolver aplicativos inteiros usando apenas HTML5 e Javascript (Windows Runtime (WinRT).

Publicada em: Tecnologia
0 comentários
1 gostou
Estatísticas
Notas
  • Seja o primeiro a comentar

Sem downloads
Visualizações
Visualizações totais
3.751
No SlideShare
0
A partir de incorporações
0
Número de incorporações
2
Ações
Compartilhamentos
0
Downloads
40
Comentários
0
Gostaram
1
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide
  • Esta é outra opção para um slide de Visão Geral.
  • Esta é outra opção para um slide de Visão Geral.
  • Criando aplicativos para Windows 8 com HTML5 e JavaScript - InfoTech 2012

    1. 1. CRIANDO APLICATIVOS PARA WINDOWS 8 USANDO APENAS HTML5 E JAVASCRIPT André Paulovich | Ivan Paulovich
    2. 2. André Paulovich@andrepaulovichpaulovich@100loop.comwww.100loop.com www.raptors.com.br
    3. 3. Ivan Paulovich 100loop.com www.raptors.com.br@ivanpaulovich ivan@100looop.com
    4. 4. Caminhos possíveis HTML / CSS JavaScript
    5. 5. Estrutura de uma APP Biblioteca WinJS Estilos Páginas Scripts Configurações
    6. 6. Tipos de arquivos
    7. 7. UI SURFACES, LAYOUT ENAVEGAÇÃO
    8. 8. Novos Controles de UI suportados
    9. 9. Novos Controles de UI suportados
    10. 10. Novos Controles de UI suportados
    11. 11. Novos Controles de UI suportados
    12. 12. Novos Controles de UI suportados
    13. 13. Como definir layouts diferentes? Full screen Fill Snap
    14. 14. Como definir layouts diferentes? Media Queries Ahhh!
    15. 15. Questão de orientação
    16. 16. CONTROLES
    17. 17. Os controles são HTML mesmo?Sim! As aplicações usam controles convencionaisde HTML.
    18. 18. Mas temos muito mais!A biblioteca WinJS adiciona controles que não existemnativamente no HTML5.Você pode instanciar estes controles usando uma simples DIV eadicionando um atributo:data-win-control.Também é possível alterar as configurações destes controles usandodata-win-options.
    19. 19. EventosKey events in HTML/Javascript Metro apps:• DOMContentLoaded• activated• windows.load• checkpoint• resuming
    20. 20. Capturando eventos de controles WinJS1. Encontre o objeto DOM usando: getElementById() ou querySelector()2. Acesse o controle WinJS através da propriedade winControl do objeto DOM. var clt = document.querySelector(‘#targetSelector’).winControl;3. Adicione o “listener” do evento ao controle: clt.addEventListener(‘eventName’, callbackFunction);
    21. 21. DEMO VAPT-VUPT
    22. 22. TRABALHANDO COM DADOS
    23. 23. Usando DataBinding em objetos HTMLDados podem ser atribuídos aos controles usando o atributo:data-win-bind.
    24. 24. Associando ItemTemplate para um ListViewVocê pode associar um template de repetição num ListViewusando o atributo itemTemplate.
    25. 25. DEMO VAPT-VUPT
    26. 26. ANIMAÇÕES
    27. 27. Transições e Animações
    28. 28. DEMO VAPT-VUPT
    29. 29. Conhecendo o ASP.NET Web API
    30. 30. Conhecendo o ASP.NET Web API
    31. 31. Conhecendo o ASP.NET Web API
    32. 32. DEMO VAPT-VUPT
    33. 33. PERGUNTAS?

    ×