Chapter 1. Introducing Sencha Touch
Figure 1.1. Checkout is a full-screen Sencha Touch application that allows you to keep tabs on your GitHub account and followers. You can learn more about it at http://checkout.github.com.
Figure 1.2. The Sencha Touch App Gallery
Figure 1.3. Looking at the Sencha Touch kitchen sink example via Mobile Safari directly (left), or a shortcut on your home screen (right)
Figure 1.4. A demonstration of some of the panel content areas
Figure 1.5. The Tab panel allows you to configure UIs that can be changed by a tap of a button and includes optional transition animations (from left to right).
Figure 1.6. Form panels are used to display input fields and contain necessary controls to manage the submission of data to your server.
Figure 1.7. The Date picker slider in action
Figure 1.8. The Select field will display a different input widget based on the type of device that’s running your UI.
Figure 1.9. A generic sheet in action displayed in portrait mode
Figure 1.10. A generic Sheet widget displayed in landscape mode
Figure 1.11. The Sheet inheritance model
Figure 1.12. An ActionSheet displayed in an application
Figure 1.13. The common MessageBox implementations: alert (top left), confirm (bottom left), and prompt (right)
Figure 1.14. A stylized Data View widget with an “itemtap” event handler, displaying an action sheet based on selection
Figure 1.15. A simple List View with an action sheet
Figure 1.16. A grouped List view, sporting an index bar