Sencha Touch in Action

1,206 views
1,110 views

Published on

What is Sencha Touch? Jay Garcia and Mitch Simoens, authors of Sencha Touch in Action, give a presentation on everything Sencha Touch. This presentation is for developers of all skill levels.

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,206
On SlideShare
0
From Embeds
0
Number of Embeds
29
Actions
Shares
0
Downloads
25
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Sencha Touch in Action

  1. 1. @ModusCreateSencha Touch in ActionThursday, May 16, 13
  2. 2. @ModusCreateAbout usThursday, May 16, 13
  3. 3. @ModusCreateWhat is SenchaTouch• The first and best mobile-centric HTML 5 framework• Provides the foundation todevelop kick ass cross platformmobile Web apps• Built on the best WebStandardsThursday, May 16, 13
  4. 4. @ModusCreateA peek under the hood• Robust class inheritance model• Full Component lifecycle• Observable event model• Elaborate Container model• Configureable layout managers• Robust packaging systemInitializationRender DestructionThursday, May 16, 13
  5. 5. @ModusCreateAboutThe Book• Took over 2 years to develop• Originally started early 2010• Touch 1.1• Started from scratch Fall of 2010• Touch 2.0 targeted• Touch 2.2 covered todayThursday, May 16, 13
  6. 6. @ModusCreateWho’s this book for?• Anyone looking to developmobile HTML5 apps withTouch• Must have skills:• JavaScript• HTML5• CSSThursday, May 16, 13
  7. 7. @ModusCreateWho’s this book for?• Anyone looking to developmobile HTML5 apps withTouch• Must have skills:• HTML5• CSS• JavaScriptThursday, May 16, 13
  8. 8. @ModusCreateWhat does this book cover?• Part 1:• Intro toTouch 2• Downloading theframework• Looking at the packagecontents• Building a basic applicationThursday, May 16, 13
  9. 9. @ModusCreateWhat does this book cover?• Part 2:• Event system• DOM, Class• Layouts• All of them!• Components• Basic to complex• Data package• Models• StoresThursday, May 16, 13
  10. 10. @ModusCreateWhat does this book cover?• Part 3:• OOJS• Class system• Extensions & Plugins• Building an app• Deploying an HTML5 app• Sencha CmdThursday, May 16, 13
  11. 11. @ModusCreateCH10 Building a customextensionThursday, May 16, 13
  12. 12. @ModusCreateInheritance challengeExt.dataview.DataViewExt.dataview.ListItemExt.ContainerExt.dataview.ListThursday, May 16, 13
  13. 13. @ModusCreateInheritance challengeTwo extensions needed to be created!Ext.dataview.DataViewExt.dataview.ListItemExt.ContainerExt.dataview.ListExt.ux.ActionList Ext.ux.ActionListItemThursday, May 16, 13
  14. 14. @ModusCreateImplementation Challenges• Detect swipe gesture• Show / Hide actions• DOM injections• Register tap event• Prevent item selection• Manage scrollThursday, May 16, 13
  15. 15. @ModusCreateActionListItem does most work• Detect swipe gesture• Show / Hide actions• DOM injections• Register tap event• Prevent item selection• Manage scrollThursday, May 16, 13
  16. 16. @ModusCreateDetect swipe gesture• Detect swipe gesture• Show / Hide actions• DOM injections• Register tap event• Prevent item selection• Manage scrollThursday, May 16, 13
  17. 17. @ModusCreateDetect swipe gesture1) Register drag and dragendhandlersThursday, May 16, 13
  18. 18. @ModusCreateDetect swipe gesture2) Manage drag eventThursday, May 16, 13
  19. 19. @ModusCreateDetect swipe gesture3) Inject DOM & animateThursday, May 16, 13
  20. 20. @ModusCreateDetect swipe gesture4) Perform cleanupThursday, May 16, 13
  21. 21. @ModusCreateComing soon: SenchaTouch video trainingmoduscreate.com/training/videoThursday, May 16, 13
  22. 22. @ModusCreateQuestions?• Book URL: manning.com/garcia2• Contact info:• twitters:• @moduscreate• @ModusJesus• jay@moduscreate.comThank you!Thursday, May 16, 13

×