Log In
Or create an account ->
Imperial Library
Home
About
News
Upload
Forum
Help
Login/SignUp
Index
Sencha Touch 2 Mobile JavaScript Framework
Table of Contents
Sencha Touch 2 Mobile JavaScript Framework
Credits
About the Authors
About the Reviewers
www.PacktPub.com
Support files, eBooks, discount offers and more
Why Subscribe?
Free Access for Packt account holders
Preface
What this book covers
What you need for this book
Who this book is for
Conventions
Reader feedback
Customer support
Downloading the example code
Errata
Piracy
Questions
1. Let's Begin with Sencha Touch
Frameworks
Building from a foundation
Building with a plan
Building with a community
Mobile application frameworks
Native application versus web application
Web-based mobile frameworks
Web frameworks and touch technology
Designing applications for mobile devices and touch technology
Why touch?
Getting started with Sencha Touch
The API
Examples
The Kitchen Sink application
Learn
Forums
Setting up your development environment
Setting up web sharing on Mac OS X
Installing a web server on Microsoft Windows
Download and install the Sencha Touch framework
Additional tools for developing with Sencha Touch
Safari and Chrome Developer Tools
JavaScript Console
The Network tab
The web inspector
The Resources tab
Other Sencha products
Sencha Cmd
Sencha Architect
Sencha Animator
Third-party developer tools
Notepad++
WebStorm
Xcode 5
Android Emulator
YUI test
Jasmine
JSLint
Summary
2. Creating a Simple Application
Setting up the application
Getting started with Sencha Cmd
Creating the app.js file
Creating the Main.js file
Exploring the tab panel
Adding a panel
Controlling the look with layouts
Using a fit layout
Using a vbox layout
Using an hbox layout
Testing and debugging the application
Parse errors
Case sensitivity
Missing files
The web inspector console
Updating the application for production
Putting the application into production
Summary
3. Styling the User Interface
Styling components versus themes
UI styling for toolbars and buttons
Adding the toolbar
Styling buttons
The tab bar
Sencha Touch themes
Introducing Sass and Compass
Variables in Sass
Mixins in Sass
Nesting in Sass
Selector inheritance in Sass
Compass
Sass + Compass = themes
Setting up Sass and Compass
Installing Ruby on Windo
Creating a custom theme
Base color
Mixins and the UI configuration
Adding new icons
Variables
More Sass resources
Default themes and theme switching
Images on multiple devices with Sencha.io Src
Specifying sizes with Sencha.io Src
Sizing by formula
Sizing by percentage
Changing file types
Summary
4. Components and Configurations
The base component class
Taking another look at layouts
Creating a card layout
Creating an hbox layout
Creating a vbox layout
Creating a fit layout
Adding complexity
The TabPanel and Carousel components
Creating a TabPanel component
Creating a Carousel component
Creating a FormPanel component
Adding a DatePicker component
Adding sliders, spinners, and toggles
The MessageBox and Sheet components
Creating a MessageBox component
Creating a Sheet component
Creating an ActionSheet component
Creating a Map component
Creating lists
Adding grouped lists
Adding nested lists
Finding more information with the Sencha Docs
Finding a component
Understanding the component page
Summary
5. Events and Controllers
Exploring events
Asynchronous versus synchronous actions
Adding listeners and handlers
Controllers
Refs and control
Referencing multiple items with ComponentQuery
Getting more out of events
Custom events
Exploring listener options
Taking a closer look at scope
Removing listeners
Using handlers and buttons
Exploring common events
Additional information
Summary
6. Getting the Data In
Models
The basic model
Model validations
Model methods
Proxies and readers
Introducing data formats
Arrays
XML
JSON
JSONP
Introducing stores
A simple store
Forms and stores
Specialty text fields
Mapping fields to the model
Clearing the store data
Editing with forms
Switching handlers
Deleting from the data store
Summary
7. Getting the Data Out
Using data stores for display
Directly binding a store
Sorters and filters
Paging a data store
Loading changes in a store
Data stores and panels
XTemplates
Manipulating data
Looping through data
Numbering within the loop
Parent data in the loop
Conditional display
Arithmetic functionality
Inline JavaScript
XTemplate member functions
The isEmpty function
Changing a panel's content with XTemplate.overwrite
Sencha Touch Charts
Installing Sencha Touch Charts
A simple pie chart
A bar chart
Summary
8. Creating the Flickr Finder Application
Generating the basic application
Introducing the Model View Controller
Splitting up the pieces
Building the foundation with Sencha Cmd
Installing Sencha Cmd
Using the Flickr API
Adding to the basic application
Generating controllers with Sencha Cmd
A brief word about including files
Creating the Photo data model
Making the SearchPhotos components
Creating the SearchPhotos store
Creating the SearchPhotos list
Creating the Navigation view
Creating the SearchPhotoDetails view
Creating the SearchPhotos controller
Setting up the launch function
Using Ext.util.Geolocation
Listening to the list
Building the SavedPhotos components
Creating the SavedPhotos store
Creating the SavedPhoto views
Finishing up the Add button in SearchPhotos
Updating the SavedPhotos controller
Polishing your application
Adding application icons and startup screens
Improving the application
Summary
9. Advanced Topics
Talking to your own server
Using your own API
REST
Designing your API
Creating the model and store
Making a request
Ajax requests in an API
Going offline
Syncing local and remote data
Manifests
Setting up your web server
Updating your cached application
Interface considerations
Alerting your users
Updating your UI
Alternate methods of detecting the offline mode
Getting into the marketplace
Compiling your application
Sencha Cmd
PhoneGap
Other options
Registering for developer accounts
Becoming an Apple developer
Becoming an Android developer
Summary
Index
← Prev
Back
Next →
← Prev
Back
Next →