Curso
                      Sencha
                     Touch 2:
                    Introdução
Loiane Groner
http://loiane.com
O que é
Sencha Touch?
Primeiro framework Javascript para
desenvolvimento de apps mobile ricas
        usando padrões web
http://www.sencha.com/
Ext JS
Touch
Touch Charts
Ext GWT == GXT
Animator
Designer
Sencha.io
Por que usar
Sencha Touch?
Apps Mobile
Linguagens
       Mobile
Objective C
Java
C++
C#
Java ME
etc
Vai Aprender
   Todas?
Claro que NÃO!
Retorno para
     WEB
Cross Platform
Já tem Skills e conhece as ferramentas
Descentralizada
Fácil Update
Indexada
Tecnologias Conhecidas
Arquitura Mobile Hoje

   Fontes   Video   Audio   Gráficos
Arquitura Mobile Hoje

   Fontes   Video     Audio   Gráficos


             CSS e Layouts


               Javascript


            Semântica HTML
Arquitura Mobile Hoje

   Fontes           Video     Audio     Gráficos


                     CSS e Layouts


                       Javascript


                    Semântica HTML

   Sist. Arquivos
                      Processamento
         DB                           Mensagens
                         Paralelo
       Cache
Arquitura Mobile Hoje

                                                  Servidor e
   Fontes           Video     Audio     Gráficos    Serviços

                                                   HTTP
                     CSS e Layouts
                                                    AJAX
                       Javascript
                                                  Eventos

                    Semântica HTML                 Sockets

                                                    SSL
   Sist. Arquivos
                      Processamento
         DB                           Mensagens
                         Paralelo                 E mais...
       Cache
Arquitura Mobile Hoje

  Acesso                                                        Servidor e
Dispositivo      Fontes           Video     Audio     Gráficos    Serviços

  Câmera                                                         HTTP
                                   CSS e Layouts
GeoLocalização                                                    AJAX
                                     Javascript
 Contatos                                                       Eventos

    SMS                           Semântica HTML                 Sockets

Orientação                                                        SSL
                 Sist. Arquivos
                                    Processamento
                       DB                           Mensagens
    Gyro                               Paralelo                 E mais...
                     Cache
Aplicações
WORA:
 Write Once
Run Anywhere
WEB
WEB
Mobile
Sencha Touch!
O que tem no Sencha Touch?

Componentes e Layouts
Themas e Ícones
Orientação e Animação
Eventos Touch e Scroller
Pacote de Dados
MVC
Componentes
Lists
- Nested, Grouped, Sortable
Carousel
Picker
Overlay
Slider
             Components
Forms & fields Toolbars & buttons HTML5
- Audio      Lists
- Video      - Nested, Grouped, Sortable
- GeoLocationCarousel
             Picker
            Overlay
            Slider
            Forms & fields
            Toolbars & buttons
            HTML5
            - Audio
            - Video
Forms
Scrolling

Scrolling
Momentum/bounce physics

 ardware accelerated

 hroughout all components:
  Lists
  Carousel
  Pickers
Eventos Touch
Baseado em Eventos Nativos

Abstraído para Performance

Eventos Adicionais:
- Tap
- Double tap
- Tap & hold - Swipe
- Rotate
- Drag & drop
Data Package
Models, Stores, e Proxies
- Associations
- Validation
- Local & server storage

Consumir web services
- JSON/P
- XML
- YQL
Temas
     Theming
     Use CSS3 & SASS
     Use CSS3 & SASS
     - Flexible themes
      - Flexible themes
   CSS3 com
     - Highly optimized
      - Highly optimized

Sass e Compass
     e.g.
     e.g.

     $base-color: #ff6699
     $base-color:
Gráficos



Touch Charts
Sencha Touch
     ==
  WORA?
Quase!!!
Reuso
  de
Código
.

              .
Views                 Views
              .

        Controllers

          Models

          Stores
             json


         Proxies
            json




         Servidor
Ext JS             Touch


     Sencha Platform
E como faço para acessar o
       dispositivo?
PhoneGap!
                 PhoneGap
  Plataforma que permite que você empacote a
aplicação web e tenha acesso a API do dispositivo




                  http://phonegap.com

     http://phonegap.com
PhoneGap oferece:
Recursos Nativos
Perfeito né? :)
Calma que tem mais!
Documentação
Comunidade Show!

http://www.sencha.com/forum/

     http://extjs.com.br/
Licença



    ree !!!
F
Livros




v1/v2     v1     v1
Todas as Aulas do Curso

http://www.loiane.com/2012/03/
curso-de-sencha-touch-2-gratuito
Contato
contato = {
 email: ‘curso@extjs4.com’,
 blog: ‘loiane.com’,
 facebook: ‘facebook.com/loianegroner’,
 twitter: ‘@loiane’,
 github: ‘loiane’,
 vimeo: ‘loiane’,
 youtube: ‘loianeg’
 }
O brig a da!

Curso Sencha Touch 2 - Aula01 - Introdução ao Sencha Touch 2