Sencha Touch About the Tutorial Sencha Touch is a mobile application framework to develop user interface for mobile apps using HTML5, CSS3, and JavaScript. It assists the developers in creating mobile apps with ease that supports Android, iOS, Windows, Tizen, Microsoft Surface Pro and RT, and BlackBerry devices. Audience This tutorial has been prepared for beginners to help them understand the concepts of Sencha Touch to build a mobile application. Prerequisites For this tutorial, the reader should have prior knowledge of HTML, CSS, and JavaScript coding. It would be helpful if the reader is aware of the concepts of object-oriented programming and also has a general idea on creating web applications. Copyright & Disclaimer Copyright 2017 by Tutorials Point (I) Pvt. Ltd. All the content and graphics published in this e-book are the property of Tutorials Point (I) Pvt. Ltd. The user of this e-book is prohibited to reuse, retain, copy, distribute or republish any contents or a part of contents of this e-book in any manner without written consent of the publisher. We strive to update the contents of our website and tutorials as timely and as precisely as possible, however, the contents may contain inaccuracies or errors. Tutorials Point (I) Pvt. Ltd. provides no guarantee regarding the accuracy, timeliness or completeness of our website or its contents including this tutorial. If you discover any errors on our website or in this tutorial, please notify us at [email protected] i Sencha Touch Table of Contents About the Tutorial .................................................................................................................................... i Audience .................................................................................................................................................. i Prerequisites ............................................................................................................................................ i Copyright & Disclaimer ............................................................................................................................. i Table of Contents .................................................................................................................................... ii 1. SENCHA TOUCH ─ OVERVIEW .............................................................................................. 1 History of Sencha Touch .......................................................................................................................... 1 Features of Sencha Touch ....................................................................................................................... 1 Sencha Touch ─ Benefits.......................................................................................................................... 1 Sencha Touch ─ Limitations ..................................................................................................................... 2 Sencha Touch ─ Tools .............................................................................................................................. 2 2. SENCHA TOUCH ─ ENVIRONMENT ....................................................................................... 4 Local Environment Setup......................................................................................................................... 5 3. SENCHA TOUCH ─ NAMING CONVENTION .......................................................................... 7 4. SENCHA TOUCH - ARCHITECTURE ........................................................................................ 8 5. SENCHA TOUCH ─ MVC ..................................................................................................... 10 6. SENCHA TOUCH ─ FIRST PROGRAM ................................................................................... 11 7. SENCHA TOUCH ─ BUILDS .................................................................................................. 13 8. SENCHA TOUCH ─ MIGRATION .......................................................................................... 15 9. SENCHA TOUCH ─ CORE CONCEPT .................................................................................... 19 Class System .......................................................................................................................................... 19 Components .......................................................................................................................................... 20 ii Sencha Touch Controller .............................................................................................................................................. 23 BlackBerry Support ............................................................................................................................... 26 Ajax ....................................................................................................................................................... 28 10. SENCHA TOUCH ─ DATA PACKAGE .................................................................................... 31 Model ................................................................................................................................................... 31 Store ..................................................................................................................................................... 33 Proxy ..................................................................................................................................................... 34 11. SENCHA TOUCH ─ THEME ................................................................................................. 36 Desktop Theme ..................................................................................................................................... 36 Windows Theme ................................................................................................................................... 37 IOS Theme ............................................................................................................................................. 38 IOS Classic Theme ................................................................................................................................. 39 Android Theme ..................................................................................................................................... 41 BlackBerry Theme ................................................................................................................................. 42 12. SENCHA TOUCH ─ DEVICE PROFILE .................................................................................... 44 13. SENCHA TOUCH ─ DEPENDENCIES ..................................................................................... 47 Application Level Dependencies ............................................................................................................ 47 Profile-specific Dependencies ............................................................................................................... 47 Nested Dependencies............................................................................................................................ 48 External Dependencies .......................................................................................................................... 48 14. SENCHA TOUCH ─ ENVIRONMENT DETECTION.................................................................. 50 Operating System .................................................................................................................................. 50 Device Detection ................................................................................................................................... 51 Version of Operating System ................................................................................................................. 51 iii Sencha Touch Browser Detection ................................................................................................................................ 51 Features ................................................................................................................................................ 52 15. SENCHA TOUCH ─ EVENTS ................................................................................................. 54 Methods of Writing Events .................................................................................................................... 54 16. SENCHA TOUCH ─ LAYOUT ................................................................................................ 60 Layout hBox .......................................................................................................................................... 60 Layout vBox........................................................................................................................................... 62 Layout Fit .............................................................................................................................................. 64 Layout Card ........................................................................................................................................... 65 17. SENCHA TOUCH ─ HISTORY SUPPORT ................................................................................ 67 Nested List ...........................................................................................................................................