StackTips

Getting Started with Sencha Touch

stacktips avtar

Written by

Editorial,  13 min read,  2.7K views, updated on Sept. 17, 2023
This section of the tutorial will help you Getting Started with Sencha Touch features.  It will help you get an understanding on props and cons of sencha touch framework for cross platform application development.

Introduction

Sencha Touch is a cross-platform framework aimed at next generation, touch enabled devices. It is probably one of the most powerful mobile web app frameworks out there and the best suited to handle complex web applications that need to replicate a native app. It’s currently compatible with Apple iOS 3+, Android 2.1+, and BlackBerry 6+ devices.

Language Used: HTML5, CSS3, and JavaScript

Built with Web Standards

  • Sencha Touch is the world’s first app framework built specifically to leverage HTML5, CSS3, and Javascript for the highest level of power, flexibility, and optimization.
  • Using the HTML5 to deliver components like audio and video, as well as a local Storage proxy for saving data offline.
  • We have made extensive use of CSS3 in our stylesheets to provide the most robust styling layer possible.
  • The entire library is under 120kb (gzipped and minified), and it’s trivial to make that number even smaller by disabling unused components or styles.

Sencha Touch features

Sencha touch is built specifically to leverage HTML5, CSS3, and JavaScript for the highest level of power, flexibility, and optimization. It Provides HTML5 to deliver components like audio and video, as well as a local Storage proxy for saving data offline. It provides CSS3 style sheets for robust styling layer possible. Here are the detailed features listed below.

GUI Support:

  • Easily scales to different resolutions for maximum compatibility with different iPhone, iPad, and the various Android phones.
  • HTML5 and CSS3 allow higher flexibility.
  • Great support for animations and enhanced touch events

3.2. Audio Video Support

  • Provides HTML5 to deliver components like audio and video, as well as a local Storage proxy for saving data offline. Provides CSS3 style sheets for robust styling layer possible.
  • Provides a simple Container for HTML5 Video

3.3. Networking Support:

  • HTTP
  • GPS (location-based web services and accelerometer input)

3.4. Data Integration

  • AJAX
  • JSONP
  • YQL
  • Saving data offline with local Storage writers

Sencha Touch Licence

Sencha Touch is licensed under free commercial and open source licenses for application development, and a paid commercial license for OEM uses.

Commercial Software License:

This is the appropriate option if you are creating proprietary applications and you are not prepared to distribute and share the source code of your application under the GPL. This is now available at no charge to developers.

Open Source License:

Sencha is an avid supporter of open source software. This is the appropriate option if you are creating an open source application with a license compatible with the GNU GPL license v3. Although the GPLv3 has many terms, the most important is that you must provide the source code of your application to your users so they can be free to modify your application for their own needs. Visit below link to get more information on Sencha Touch Software License.

http://www.sencha.com/products/touch/license/

Download & Installation

  • Download the Sencha Touch Libraries
  • Make sure your development environment is set up
  • Make sure your development and production Web servers are properly installed and configured
  • Know the name of the CSS file you want your application to use. You will need this file name when you create the application HTML file in the next step

Sencha Touch Software Development IDE

Software developers spend their workday in an integrated development environment. An IDE is a set of tools that aids easy application development, by allowing developers do the following things

  • Write and edit source code
  • Refactoring code
  • Find and fix errors quickly
  • Code syntax intelligence/auto complete
  • Navigate code with ease
  • Compile and execute code
  • Browse class and subroutines
  • Integrated API documentations

It’s no wonder developers moved towards an IDE for their day to day development, but which IDE is right for you? What features you want? Here are the below Integrated Development Environments (IDE) Sencha touch supports

  • Eclipse Based IDEs
  • Aptana IDE
  • Spket  IDE

Wrap up

Here above I have articulated all of the framework features. I have been working in Sencha touch since its birth. Sencha is enhanced lot more features like performance improvement, additional API for data management, wider platform support, etc. It is claimed to be the best cross platform solution.   I agree with this point when I compare to the novice platforms like JQueery, iUI, etc. However, I couldn’t applaud the way it is aimed to achieve it. There are major roadblock that prompts me again and again while choosing Sencha as the platform for cross platform support with robust and acceptable performance. It failed to achieve the below things

  1. Performance in blackberry is remarkably bad
  2. No support for blackberry non touch devices
  3. Bad performance in android Low end devices. However, It works great in my HTC OneX, a high end device.
  4. UI is unacceptably bad in android low end devices
  5. Scrolling is very laggy, once the data set in a list reaches more then 200+ records
  6. SASS- Sencha claims SASS theming support is the backbone and added advantage compared to other platforms.  But, it is damn difficult and take couple of steps to compile and use in comparison with CSS3

Above all, I still say Sencha is the best platform in compared to all other mobile web frameworks.  It’s Just a thought in addition to your post.