Sencha Touch Cookbook, Second Edition

This cookbook-style tutorial will make it easy to create multi-platform applications for touch-based mobile devices. By learning Sencha Touch you’ll be skilling-up in one of the most popular HTML5 and JavaScript frameworks around.

Sencha Touch Cookbook, Second Edition

Cookbook
Ajit Kumar

This cookbook-style tutorial will make it easy to create multi-platform applications for touch-based mobile devices. By learning Sencha Touch you’ll be skilling-up in one of the most popular HTML5 and JavaScript frameworks around.
$10.00
$49.99
RRP $29.99
RRP $49.99
eBook
Print + eBook
$12.99 p/month

Get Access

Get Unlimited Access to every Packt eBook and Video course

Enjoy full and instant access to over 3000 books and videos – you’ll find everything you need to stay ahead of the curve and make sure you can always get the job done.

+ Collection
Free Sample

Book Details

ISBN 139781782169185
Paperback418 pages

About This Book

  • Learn every aspect of creating, building, packaging, and running a Sencha Touch application
  • Integrate your applications with different data sources and present them differently using list, data view, charts, and so on
  • Package your application with or without Cordova/PhoneGap and run them on a desktop, emulator, and a real mobile device

Who This Book Is For

Sencha Touch Cookbook, Second Edition is great for developers who are new to Sencha Touch and who are looking to get a good hold on what the Sencha Touch framework offers and how to use it to build a great touch-based mobile application running on different platforms. It is assumed that you will have some experience in HTML, CSS, DOM, and JavaScript. To truly appreciate the framework capability and take full advantage of the book, readers are expected to have one or more mobile devices.

Table of Contents

Chapter 1: Gear Up for the Journey
Introduction
Setting up the Android-based development environment
Setting up the iOS-based development environment
Setting up the BlackBerry-based development environment
Setting up a browser-based development environment
Detecting the device
Finding features that are supported in the current environment
Letting your application configure itself using profiles
Responding to orientation changes
Chapter 2: Catering to Your Form-related Needs
Introduction
Getting your form ready with form panels
Working with the search field
Applying custom validation in the e-mail field
Working with dates using the date picker
Making a field hidden
Working with the select field
Changing a value using slider
Spinning the number wheel using spinner
Toggling between your two choices
Checkbox and checkbox groups
Text and text area
Grouping fields with fieldset
Validating your form
Chapter 3: Containers and Layouts
Introduction
Keeping your container lightweight
Working with Panel
Adding items to a container at runtime
Building wizards using CardLayout
Docking items
Fitting into the container using FitLayout
Arranging your items horizontally using HBoxLayout
Arranging your items vertically using VBoxLayout
Mixing layouts
Easing view navigation with the NavigationView class
Chapter 4: Building Custom Views
Introduction
Basic HTML templating using Template
Using XTemplate for advanced templating
Conditional view rendering using XTemplate
Designing custom views using DataView
Showing the filtered data
Responding to user actions
Chapter 5: Dealing with Data and Data Sources
Introduction
Creating a model
Loading the form using a data model
Working with a store
Converting incoming JSON data into a model using JsonReader
Converting incoming XML data into the model using XmlReader
Validations in models
Defining your custom validation
Relating models using association
Persisting session-specific data using the SessionStorage proxy
Persisting data using the LocalStorage proxy
Accessing in-memory data using the Memory proxy
Loading data through AJAX using the Ajax proxy
Sorting data
Data grouping
Filtering data
Using a cross-domain URL in your application
Working with Web SQL databases
Chapter 6: Adding Components
Introduction
Working with the button component
Creating a sheet of buttons with ActionSheet
Carousel
Managing a list of data using List
Grouping items in a list
Navigating through a list of data using IndexBar
Working with a list of nested data using NestedList
Picking up your choice using Picker
Switching between multiple views using SegmentedButton
Working with Tab panels
Getting quicker access to application features using Toolbar
Creating a new component
Extending an existing component's capability
Overriding a component's behavior
Adding behavior to an existing component using plugins
Chapter 7: Adding Audio/Visual Appeal
Introduction
Animating an element
Ding-dong! You have got a message
Working with videos
Creating your drawing
Working with an area chart
Working with a bar chart
Working with a column chart
Showing a group of bars and columns
Highlighting and displaying an item detail
Working with a gauge chart
Working with a line chart
Working with a pie chart
Rotating the pies
Highlighting a pie
Working with a 3D pie chart
Working with a radar chart
Working with a scatter chart
Working with a candlestick/OHLC chart
Chapter 8: Taking Your Application Offline
Introduction
Detecting offline mode
Storing your data offline in localstorage
Storing your data offline using Sencha.io
Storing your images offline
Application caching
Chapter 9: Increased Relevance Using Geolocation
Introduction
Finding out your location
Finding out the location using native device APIs
Auto update of your location
Tracking direction and speed
Hooking up Google Maps with your application
Working with the Google Maps options
Mapping Geolocation on Google Maps
Chapter 10: Device Integration
Introduction
Capturing and managing photos using a camera
Pulling out those contacts
Working with orientation
Managing notifications
Reading a file
Handling the home button on Android, iOS, and BlackBerry
Handling the back button on Android and BlackBerry
Handling the menu button on Android and Blackberry
Handling the search button on Android
Navigating using the BlackBerry trackpad

What You Will Learn

  • Set up your project for development, then build, package, and run it in a desktop browser, emulator, or a mobile device
  • Understand form panels and various form fields and their behaviour
  • Learn about different layouts to create well structured UI
  • Create complete custom views with user interaction
  • Work with different types of data and data sources, model them, and use them on components
  • Define new components and extend the framework components to suite your need
  • Get your application work in offline mode with automatic sync

In Detail

Sencha Touch is one of the most popular HTML5 and JavaScript frameworks for building touch-based mobile devices. Using Sencha Touch, you can create applications for touch mobile devices with ease, and once created, the same application works on multiple platforms – iOS, Android, Blackberry – without having to change anything.

Sencha Touch Cookbook, Second Edition is a practical, hands-on guide with easy to follow recipes that provide you with clear, step-by-step instructions, which will help you take complete advantage of the power of Sencha Touch 2 and will help you to build amazing applications for the mobile world.

Sencha Touch Cookbook, Second Edition starts by showing you how to set up your project for development, then walks through building, packaging, and running it in a browser, emulator, or a real device. With the groundwork set, the subsequent recipes of the book take you through the different UI components offered by the framework and explains how to use them, when to use them, and, if needed, how to extend them for your own application need.

You will also learn how to model your client side data, load data from different data sources, and use them on the data-centric UI components. The later parts of the book cover the practical day-to-day problems like how to create a custom view, how to take your application offline and support automatic sync, how to utilize the Geolocation to learn more about the user, how to utilize device features such as camera, contact, orientation, and how to link your application behaviour with the device buttons such as Back, Search, and so on. At the end, the book shows you how to create native packages without using PhoneGap/Cordova using Sencha Cmd.

Using this book, you will learn everything about using Sencha Touch classes and components to build mobile applications that can run across multiple platforms.

Authors

Table of Contents

Chapter 1: Gear Up for the Journey
Introduction
Setting up the Android-based development environment
Setting up the iOS-based development environment
Setting up the BlackBerry-based development environment
Setting up a browser-based development environment
Detecting the device
Finding features that are supported in the current environment
Letting your application configure itself using profiles
Responding to orientation changes
Chapter 2: Catering to Your Form-related Needs
Introduction
Getting your form ready with form panels
Working with the search field
Applying custom validation in the e-mail field
Working with dates using the date picker
Making a field hidden
Working with the select field
Changing a value using slider
Spinning the number wheel using spinner
Toggling between your two choices
Checkbox and checkbox groups
Text and text area
Grouping fields with fieldset
Validating your form
Chapter 3: Containers and Layouts
Introduction
Keeping your container lightweight
Working with Panel
Adding items to a container at runtime
Building wizards using CardLayout
Docking items
Fitting into the container using FitLayout
Arranging your items horizontally using HBoxLayout
Arranging your items vertically using VBoxLayout
Mixing layouts
Easing view navigation with the NavigationView class
Chapter 4: Building Custom Views
Introduction
Basic HTML templating using Template
Using XTemplate for advanced templating
Conditional view rendering using XTemplate
Designing custom views using DataView
Showing the filtered data
Responding to user actions
Chapter 5: Dealing with Data and Data Sources
Introduction
Creating a model
Loading the form using a data model
Working with a store
Converting incoming JSON data into a model using JsonReader
Converting incoming XML data into the model using XmlReader
Validations in models
Defining your custom validation
Relating models using association
Persisting session-specific data using the SessionStorage proxy
Persisting data using the LocalStorage proxy
Accessing in-memory data using the Memory proxy
Loading data through AJAX using the Ajax proxy
Sorting data
Data grouping
Filtering data
Using a cross-domain URL in your application
Working with Web SQL databases
Chapter 6: Adding Components
Introduction
Working with the button component
Creating a sheet of buttons with ActionSheet
Carousel
Managing a list of data using List
Grouping items in a list
Navigating through a list of data using IndexBar
Working with a list of nested data using NestedList
Picking up your choice using Picker
Switching between multiple views using SegmentedButton
Working with Tab panels
Getting quicker access to application features using Toolbar
Creating a new component
Extending an existing component's capability
Overriding a component's behavior
Adding behavior to an existing component using plugins
Chapter 7: Adding Audio/Visual Appeal
Introduction
Animating an element
Ding-dong! You have got a message
Working with videos
Creating your drawing
Working with an area chart
Working with a bar chart
Working with a column chart
Showing a group of bars and columns
Highlighting and displaying an item detail
Working with a gauge chart
Working with a line chart
Working with a pie chart
Rotating the pies
Highlighting a pie
Working with a 3D pie chart
Working with a radar chart
Working with a scatter chart
Working with a candlestick/OHLC chart
Chapter 8: Taking Your Application Offline
Introduction
Detecting offline mode
Storing your data offline in localstorage
Storing your data offline using Sencha.io
Storing your images offline
Application caching
Chapter 9: Increased Relevance Using Geolocation
Introduction
Finding out your location
Finding out the location using native device APIs
Auto update of your location
Tracking direction and speed
Hooking up Google Maps with your application
Working with the Google Maps options
Mapping Geolocation on Google Maps
Chapter 10: Device Integration
Introduction
Capturing and managing photos using a camera
Pulling out those contacts
Working with orientation
Managing notifications
Reading a file
Handling the home button on Android, iOS, and BlackBerry
Handling the back button on Android and BlackBerry
Handling the menu button on Android and Blackberry
Handling the search button on Android
Navigating using the BlackBerry trackpad

Book Details

ISBN 139781782169185
Paperback418 pages
Read More