Sencha Touch: Javascript para Mobile WebApps
1 gostou1,428 visualizações
O documento discute a crescente importância de aplicações móveis, apresentando a necessidade de adaptação de sistemas de informação para esse novo ambiente. Explora o framework Sencha Touch, que permite a criação de aplicativos móveis otimizados para diferentes plataformas, destacando suas características e vantagens. Por fim, enfatiza as opções de desenvolvimento, incluindo aplicações web, nativas e híbridas, e os requisitos para empacotamento nativo.
![Criando a primeira aplicação
Sencha Command v2.0.0 Beta 3
Copyright (c) 2012 Sencha Inc.
usage: sencha COMMAND [ARGS]
The available commands are:
build build a JSB project
create bootstrapdata generate boostrap data
create jsb generate a minimal JSB project for an app
create locale generate a template locale file from source
create manifest generate classes manifest
package package your Touch web app into a native bundle
slice theme slice a custom theme's images for IE
See 'sencha help COMMAND' for more information on a specific command.](https://image.slidesharecdn.com/apresentacaosenchatouch-130701135601-phpapp02/85/Sencha-Touch-Javascript-para-Mobile-WebApps-53-320.jpg)
Sencha Touch: Javascript para Mobile WebApps
- 1. Sencha Touch: Javascript para Mobile WebApps Flávio Gomes da Silva Lisboa
- 2. Cenário http://www.cetic.br/usuarios/tic/2012/apresentacao-tic-domicilios-2012.pdf
- 3. Cenário
- 4. Cenário
- 5. Cenário
- 6. Cenário
- 7. Cenário
- 8. Cenário
- 9. Cenário
- 10. Cenário A ascensão do uso das tecnologias móveis pela população em geral indica que os dispositivos móveis tornam-se um meio preferencial de comunicação. Diante desse fato torna-se clara a necessidade de disponibilizar serviços que sejam acessíveis por dispositivos móveis.
- 11. Cenário Devemos observar que não estamos tratando do governo disponibilizar novos serviços, mas sim de oferecê-los por meio de um novo canal de comunicação. Canal de Corinto
- 12. Cenário No entanto, a oferta de serviços por meio de dispositivos móveis coloca a questão da adaptação de sistemas de informação para operarem nesse novo paradigma (quando forem acessíveis por navegadores dos dispositivos) ou criação de novas aplicações (quando for utilizado um cliente próprio para o dispositivo). A única certeza inicial é a de que qualquer opção terá um custo. A dúvida é como ter o custo mínimo.
- 13. Cenário Diante do exposto, vemos que a adaptação de aplicações para dispositivos móveis, além de ser um avanço tecnológico, é uma demanda de mercado e uma necessidade de negócio.
- 14. Opções Existem três categorias de aplicações para dispositivos móveis: ●WebApp ●Nativa ●Híbrida
- 15. WebApp Aplicação projetada para serem executadas em browsers de dispositivos móveis. ●Vantagens: atualização/manutenção da aplicação é feita no servidor; independente de plataforma. ●Problema: persistência de dados no próprio dispositivo.
- 16. Nativa Aplicação desenvolvida diretamente para uma plataforma, em uma linguagem específica. Exemplos: Android (Java) e iOS(ObjectiveC). ●Vantagens: total acesso aos recursos dos dispositivos e hardwares; armazenamento local de dados; maior desempenho; componentes projetados para a plataforma, entre outras. ●Problema: portabilidade.
- 17. Híbrida WebApp exportada como aplicação nativa para várias plataformas. ●Vantagens: desenvolvimento de uma única versão da aplicação com portabilidade para várias plataformas. ●Problema: como fazer isso?
- 18. História Jack Slocum criou uma extensão da biblioteca Javascript do Yahoo!, a Yahoo! User Interface Library (YUI), chamada YUI-Ext. Essa extensão ganhou vida própria em 2007 e se tornou o framework Javascript Ext JS. A partir do Ext JS foi criado um framework específico para construção de aplicativos para dispositivos móveis, o Sencha Touch. Jack Slocum
- 19. O que é Sencha Touch? Sencha Touch é um framework de alto desempenho de aplicativos móveis HTML5. Construído para permitir experiências de usuário de classe mundial, Sencha Touch é uma estrutura que permite aos desenvolvedores criar aplicativos poderosos que funcionam em iOS, Android, BlackBerry, Windows Phone, e muito mais.
- 20. Características Rolagem suave e animações Sencha Touch fornece ao usuário uma experiência inigualável em HTML5. Animações fluidas e rolagem suave fazem aplicações Sencha Touch apps parecerem vivas, rivalizando com tecnologia nativa. Listas, carrosséis e outros componentes de rolagem e naturalmente, com uma alta taxa de quadros em uma ampla gama de dispositivos. A estrutura usa automaticamente o melhor mecanismo de rolagem para cada dispositivo, resultando em uma grande experiência em todos os lugares.
- 35. Características Layouts adaptativos O mecanismo de layout do Sencha Touch utiliza HTML5 de forma poderosa para que os desenvolvedores construam aplicações complexas que respondem, carregam e apresentam em um piscar de olhos. A mudança de paisagem para retrato acontece quase que instantaneamente, e o carregamento de aplicativos em frações de segundo. O mecanismo de layout avançado de Sencha Touch garante perfeição em pixels.
- 36. Layouts HBox
- 37. Layouts VBox
- 38. Layouts VBox
- 39. Características Empacotamento Nativo Aplicações web funcionam em todos os lugares. Mas ainda existem algumas características exclusivamente disponíveis para aplicativos nativos - como o acesso à câmera e distribuição em lojas de aplicativos - que são essenciais para desenvolvedores. O Sencha SDK Tool provê o melhor dos dois mundos, oferecendo uma forma empacotar seu aplicativo web como uma aplicação nativa. Com apenas um comando você pode distribuir sua aplicação para a Apple App Store ou Google Play!.
- 40. Requisitos para empacotamento nativo JRE Sencha Cmd é escrito em Java e requer o Java Runtime Environment versão 1.6 ou 1.7 (melhor) Sencha Cmd Ruby 1.9.3 (ou anterior): Sencha Cmd não trabalha com Ruby 2.0. Ruby difere para cada sistema operacional. Empacotamento para iOS: Apple Xcode Empacotamento para Android: Android SDK Tools e Eclipse (opcional).
- 41. Características E muito mais! ● Suporte completo a AJAX, incluindo CORS e JSON-P. ● Suporte completo à manipulação DOM ● Detecta automaticamente a presença de recursos como o suporte de geolocalização, telas e orientação. ● Fornece um wrapper de geolocalização para dispositivos que a suportam. ● Inclui 300 ícones. ● Possui 8 aplicativos completos como exemplo. ● Fornece uma gama completa de eventos de toque e gestos como tap, swipe e pinch. CORS: Cross-origin resource sharing JSON-P: JSON with padding Comunicação do servidor com um domínio diferente
- 42. Exemplos de interface com Sencha Touch
- 43. Exemplos de interface com Sencha Touch
- 44. Exemplos de interface com Sencha Touch
- 45. Restrições
- 46. WebKit
- 50. Criando a primeira aplicação ● Sencha Touch SDK ● http://www.sencha.com/products/touch/download/ ● Sencha Cmd ● http://www.sencha.com/products/sencha-cmd/download
- 51. Criando a primeira aplicação ● Sencha Touch SDK ● http://www.sencha.com/products/touch/download/ ● Sencha Cmd ● http://www.sencha.com/products/sencha-cmd/download
- 52. Criando a primeira aplicação ● Sencha Touch SDK
- 53. Criando a primeira aplicação Sencha Command v2.0.0 Beta 3 Copyright (c) 2012 Sencha Inc. usage: sencha COMMAND [ARGS] The available commands are: build build a JSB project create bootstrapdata generate boostrap data create jsb generate a minimal JSB project for an app create locale generate a template locale file from source create manifest generate classes manifest package package your Touch web app into a native bundle slice theme slice a custom theme's images for IE See 'sencha help COMMAND' for more information on a specific command.
- 54. Criando a primeira aplicação http://docs.sencha.com/touch/2.2.1/#!/guide
- 56. Contato Flávio Gomes da Silva Lisboa flavio.lisboa@serpro.gov.br Coordenação Estratégica de Tecnologia (CETEC)