Book Image

Sencha Touch Cookbook

By : Ajit Kumar
Book Image

Sencha Touch Cookbook

By: Ajit Kumar

Overview of this book

Sencha touch is a versatile HTML5-based framework for developing mobile web apps that look and feel native on touch screen devices, and with it you can write your code once and deploy it to both iOS and Android saving you both time and money. The Sencha touch cookbook has a comprehensive selection of recipes covering everything from installation right through to HTML5 geo location. The Sencha Touch Cookbook really is your one stop resource for cross platform HTML5 application development. It covers the basics such as setting up an iOS and Android development environment right through to much more complex development issues such as touch gestures, animation, rich media and geo location. Every recipe is practically focused. Maximum action. Minimum theory.
Table of Contents (17 chapters)
Sencha Touch Cookbook
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

Preface

Sencha Touch is a HTML5-compliant framework for development of touch-based applications. An application written using this framework can be run—without any change—on iOS, Android, and Blackberry-based touch devices. The framework comes along with numerous built-in UI components similar to the ones that we see on different mobile platforms, nicely designed with efficient data package to work with varied client-side or server-side data sources. In addition to this, the framework also offers APIs to work with DOM and it brings in the extensibility to every aspect of it, which is a bingo combination that every enterprise looks for and expects from a framework.

What this book covers

Chapter 1, Gear up for the Journey. This chapter is all about setting up the right development environment for iOS, Android, and Blackberry. It covers the detailed step to set up the environment using which we can build and test our application, either on a browser or on an emulator or a real device. The latter half of the chapter covers the Sencha Touch APIs that can be used to detect what device our application is running, what platform the application is running, what features are offered by a platform, how to handle orientation change, and build profiles for different platforms or devices and let our application configure itself using those profiles.

Chapter 2, Catering to your Form Related Needs. This chapter covers every aspect of a form, including the different form fields offered by Sencha Touch, configuring each one of them for the user in a form, and configuring ways by which a typical form validation can be done. Fields such as Search, E-mail, DatePicker, Select, Slider, Checkbox, TextArea, FieldSet, and so on are covered in this chapter along with their detailed usage.

Chapter 3, Containers and Layouts. Containers contain one or more child items, and layouts help us position our content properly on the screen, and this chapter is all about them. It covers what are the different types of containers and layouts available with the framework and their behavior, which is a key point in developing an application where we would have nested containers, each one of them having their own layout to position their children on the screen.

Chapter 4, Building Custom Views. If the components offered by Sencha Touch is not sufficient to achieve the layout and look-n-feel that we are looking for, then custom views is the way to go. In this chapter, we cover Template, XTemplate, and DataView classes of Sencha Touch to see how to build custom views and how to handle events on it to build interactive custom views.

Chapter 5, Dealing with Data and Data Sources. This chapter is all about working with different data sources, storing data on the client side and using it in the most effective way. It shows how to work with the local data source, as well as remote data source. The chapter also covers how to associate data with different components, including form, and validating, filtering, grouping, and sorting data.

Chapter 6, Adding the Components. This chapter covers various other components of Sencha Touch such as Button, ActionSheet, List, IndexBar, NestedList, Picker, Toolbar, and so on. It demonstrates how to configure each of these components.

Chapter 7, Adding Audio/Visual Appeal. This chapter covers how to work with media—audio and video—and different graphs and charts to present our data, graphically. As charts don't come with Sencha Touch, this chapter explains the steps to configure the charts framework with Sencha Touch and then use it to build interactive charts.

Chapter 8, Taking your Application Offline. In this chapter, we will see how to detect the offline mode on a device or a platform and how to model our application to make it work even in the offline mode.

Chapter 9, Engaging Users by Responding to Events. In browsers, we have mouse events whereas a touch device raises events specific to touch actions such as tab, Double tap, drag, swipe, and so on. In this chapter, we will look at the list of touch events the framework offers and the ways to handle them to respond to those events.

Chapter 10, Increased Relevance Using Geolocation. This chapter shows how to fetch the GeoLocation information on a device/platform and work with it. We will cover various aspects such as how to find out the direction and speed at which the device is moving, and how to integrate the Geolocation information with Google map to show interesting and relevant information to the user.

What you need for this book

In order to follow this book, you would need the Sencha Touch framework and good knowledge of JavaScript and some knowledge of HTML and CSS. The following list shows the software needed:

  • Sun JDK Version 1.5 or above

  • Eclipse 3.3 or above

  • PhoneGap 1.0.0

  • Sencha Touch 1.1.0 library

  • Sencha Touch Charts 1.0 library

  • Android SDK

  • ADT Plugin

  • XCode 4

  • Blackberry SDK

If you want to try out the recipes on your touch device, you may have to have one.

Who this book is for

This book is for someone who wants to learn about a framework which can be used to develop HTML5-compliant mobile applications, and can work on various different platforms—Android, iOS, and BlackBerry. This cookbook provides numerous recipes for the developers to understand Sencha Touch functionalities, in general, and use them to address practical needs in particular.

Conventions

In this book, you will find a number of styles of text that distinguish between different kinds of information. Here are some examples of these styles, and an explanation of their meaning.

Code words in text are shown as follows: "Copy phonegap.1.0.0.js from your PhoneGap downloaded earlier to assets/www."

A block of code is set as follows:

Ext.setup({
  onReady: function() {
    if (Ext.is.Android)
      Ext.Msg.alert("INFO", "Welcome Android user!");
      
    if (Ext.is.Blackberry)
      Ext.Msg.alert("INFO", "Welcome Blackberry user!");
      
    if (Ext.is.iPad)
      Ext.Msg.alert("INFO", "Welcome iPad user!");
  }
});

When we wish to draw your attention to a particular part of a code block, the relevant lines or items are set in bold:

layout: {
          type: 'hbox',
          direction: 'reverse'
}

New terms and important words are shown in bold. Words that you see on the screen, in menus or dialog boxes for example, appear in the text like this: " Launch Eclipse, click on the File menu, and select New | Android Project".

Note

Warnings or important notes appear in a box like this.

Tip

Tips and tricks appear like this.

Reader feedback

Feedback from our readers is always welcome. Let us know what you think about this book—what you liked or may have disliked. Reader feedback is important for us to develop titles that you really get the most out of.

To send us general feedback, simply send an e-mail to , and mention the book title via the subject of your message.

If there is a book that you need and would like to see us publish, please send us a note in the SUGGEST A TITLE form on www.packtpub.com or e-mail .

If there is a topic that you have expertise in and you are interested in either writing or contributing to a book, see our author guide on www.packtpub.com/authors.

Customer support

Now that you are the proud owner of a Packt book, we have a number of things to help you to get the most from your purchase.

Downloading the example code for this book

You can download the example code files for all Packt books you have purchased from your account at http://www.PacktPub.com. If you purchased this book elsewhere, you can visit http://www.PacktPub.com/support and register to have the files e-mailed directly to you.

Errata

Although we have taken every care to ensure the accuracy of our content, mistakes do happen. If you find a mistake in one of our books—maybe a mistake in the text or the code—we would be grateful if you would report this to us. By doing so, you can save other readers from frustration and help us improve subsequent versions of this book. If you find any errata, please report them by visiting http://www.packtpub.com/support, selecting your book, clicking on the errata submission form link, and entering the details of your errata. Once your errata are verified, your submission will be accepted and the errata will be uploaded on our website, or added to any list of existing errata, under the Errata section of that title. Any existing errata can be viewed by selecting your title from http://www.packtpub.com/support.

Piracy

Piracy of copyright material on the Internet is an ongoing problem across all media. At Packt, we take the protection of our copyright and licenses very seriously. If you come across any illegal copies of our works, in any form, on the Internet, please provide us with the location address or website name immediately so that we can pursue a remedy.

Please contact us at with a link to the suspected pirated material.

We appreciate your help in protecting our authors, and our ability to bring you valuable content.

Questions

You can contact us at if you are having a problem with any aspect of the book, and we will do our best to address it.