2. Rich Mobile Apps with Sencha Touch
Part I – Intro to Sencha
What is Sencha Touch?
One of the best JavaScript
frameworks for building
rich mobile apps with web
standards.
DETAILS MATTER
3. Rich Mobile Apps with Sencha Touch
Part I – Intro to Sencha
FLEXIBLE DEPLOYMENT
FAST DEVELOPMENT
CROSS PLATFORM
EASY TO STYLE
MORE DEVELOPERS
CHEAPER
-------OPTIMIZED DATA
WEB
The Sweet Spot
NATIVE
RICH CONTROLS
--------RESPONSIVE UI
4. Rich Mobile Apps with Sencha Touch
Part I – Intro to Sencha
DEVICES
5. Rich Mobile Apps with Sencha Touch
Part I – Intro to Sencha
iPhone
iPad
6. Rich Mobile Apps with Sencha Touch
Part I – Intro to Sencha
All kind of
android phones …
… and tablets
7. Rich Mobile Apps with Sencha Touch
Part I – Intro to Sencha
BLACKBERRY 6
8. Rich Mobile Apps with Sencha Touch
Part I – Intro to Sencha
What’s included in Sencha?
-
Touch Events
Scrolling
Theming
Components
Data Package
Full Application Architecture
9. Rich Mobile Apps with Sencha Touch
Part I – Intro to Sencha
Built on native events
Abstracted for performance
By default we have 4 touch events
- Touch start
- Touch end
- Touch move
- Touch cancel
Additional events
- Tap
- Double tap
- Tap and hold
- Swipe
- Pinch
- Drag & drop
Touch Events
10. Rich Mobile Apps with Sencha Touch
Part I – Intro to Sencha
Scrolling
Momentum/bounce physics
Hardware accelerated
Critical for tablets
Throughout components
- Lists
- Carousel
- Pickers
11. Rich Mobile Apps with Sencha Touch
Part I – Intro to Sencha
Lists
- Nested, Grouped, Sortable
Carousel
Picker
Overlay
Slider
Forms & Fields
Toolbars & buttons
HTML5
- Audio
- Video
- GeoLocation
Components
12. Rich Mobile Apps with Sencha Touch
Part I – Intro to Sencha
Theming
CSS3
SASS & Compass
(http://compass-style.org/)
- Flexible themes
- Highly optimized
300+ Pre-included icons
Robust Animations
Resolution Independent
13. Rich Mobile Apps with Sencha Touch
Part I – Intro to Sencha
Data Package
Models, Stores, and Proxies
- Associations
- Validation
Easily consume web services
- JSON/P
- XML
- YQL
Offline data
- localStorage
14. Rich Mobile Apps with Sencha Touch
Part I – Intro to Sencha
Full Application Architecture
MVC
History Support
Device detection
Orientation events
Layouts
Animations
15. Rich Mobile Apps with Sencha Touch
Part I – Intro to Sencha
Take it off(line) with …
AND ONE
MORE THING…
16. Rich Mobile Apps with Sencha Touch
Part I – Intro to Sencha
Sencha Architect
17. Rich Mobile Apps with Sencha Touch
Part I – Intro to Sencha
QUESTIONS ?
18. Rich Mobile Apps with Sencha Touch
Part I – Intro to Sencha
THANKS !!!
DEMOS
j.mp/touchsink