Jump to content

Sencha Touch

From Wikipedia, the free encyclopedia

This is an old revision of this page, as edited by 195.250.62.9 (talk) at 07:49, 20 July 2012 (link is not available now). The present address (URL) is a permanent link to this revision, which may differ significantly from the current revision.

Sencha Touch
Developer(s)Sencha
Stable release
2.0.1 / April 23, 2012; 12 years ago (2012-04-23)
Written inJavaScript
Operating systemAndroid, iOS, RIM, Kindle
Available inEnglish
TypeJavaScript library
LicenseGPLv3 or commercial
Websitewww.sencha.com/products/touch

Sencha Touch is a user interface (UI) JavaScript library, or framework, specifically built for Mobile Web. It can be used by Web developers to develop user interfaces for mobile web applications that look and feel like native applications on supported mobile devices. It is fully based on web standards such as HTML5, CSS3 and JavaScript.Sencha Touch enables you to quickly and easily create HTML5 based mobile apps that work on Android, iOS and Blackberry devices and produce a native-app-like experience inside a browser.

Version history and support

Sencha Touch is a product of Sencha which was formed after popular JavaScript library projects Ext JS, jQTouch and Raphaël were combined.[1] The first release of Sencha Touch was version 0.90 beta on July 17, 2010. This beta release supported devices running Android, and iOS (on iPhone, iPod touch, iPad). Subsequently the first stable version 1.0 was released on November 2010. Version 1.1.0 added support for devices running BlackBerry OS version 6. The latest release, Sencha Touch 2, released on March 7, 2012 and is designed to run on WebKit based browsers such as Android, Google Chrome for Android, RIM Blackberry Browser, Bada Mobile Browser, Kindle Fire Browser, and Safari. Sencha has announced its intention to support Windows Phone in the 2.x line. There are no plans to support Firefox Mobile.

Features

GUI controls

Sencha Touch includes a set of graphical user interface GUI-based controls or "components" for use within mobile web applications. These components are highly optimized for touch input. List of components:[2]

  • Buttons with device specific themes and effects
  • Form elements such as text fields for email, date picker, address, etc.; sliders; selectors; and comboboxes
  • List component which has momentum scrolling along with index
  • Minimal icon set
  • Toolbars, menus
  • Movable tabs
  • Bottom toolbars
  • Map component with support to multi-touch input such as pinch and zoom

All the components can be themed according to the target device. This is done using SASS, a stylesheet language built over CSS.

CSS transitions (animations)

Sencha Touch has certain in-built transition effects.

  • Slide over or under current element.
  • Pop
  • Flips
  • Cube

Touch event management

It supports common touch gestures basically built from touch events which are Web standards but are supported only by Android, iOS, and some touch enabled devices.

  • Tap
  • Double tap
  • Swipe
  • Scroll
  • Pinch

Application data support

Sencha Touch, being a JavaScript framework, consists of both UI and data libraries.[3] Using the data libraries, web applications can retrieve data from remote servers. Sencha Touch has a data package to support web standards for data interchange with servers such as Ajax and JSONP.[4] It also supports YQL.[5][6] Using these technologies, data can be bound to visual components such as lists to reflect data from servers.

Offline applications

Mobile Web applications require connection to the network to serve data to users. However users would like to use applications even when it is not connected, and synchronize with servers when connected. The ability of a web application to work offline is a big feature of HTML5.[7] HTML5 uses CACHE MANIFEST to manage resources to fetch while connected to a server and to maintain usage of those resources while offline.[8] Sencha Touch leverages this feature and adds to it to make good offline applications. Using the Framework it is possible to dynamically change the list of resources such as scripts, stylesheets, etc., that we want to cache based on the state of application and user demand.[9] It is possible to store data by binding it to components using JSONP while being online, so the data remains present when the device gets disconnected.

Comparison to native applications

Native applications on mobile devices have access to all the device components such as the camera, compass, and microphone[10] which Sencha Touch can access through the use of a native shell such as Phonegap. As mobile browsers and devices have evolved to meet emerging standards, components such as the GPS, WebSockets, and accelerometer are now available to mobile web applications, with GPS specifically supported with Sencha Touch.[11] Sencha Touch can be used along with PhoneGap or its own native packager, to create applications native to a mobile device for access to currently native-only components and to app marketplaces.[12] The capability of such applications is restricted by the capability of PhoneGap. Alternatively, Sencha Touch can be used with its own native packager that is included in Sencha Touch 2 Preview SDK tools.

See also

References

  1. ^ http://www.sencha.com/blog/2010/06/14/ext-js-jqtouch-raphael-sencha/
  2. ^ http://notes.sencha.com/post/709462805/intro-to-sencha-touch
  3. ^ http://badassjs.com/post/707996695/sencha-touch-a-cross-platform-html5-mobile-application
  4. ^ http://www.developria.com/2010/11/sencha-touch-javascript-mobile.html
  5. ^ http://www.technogadge.com/sencha-touch-open-source-html5-mobile-app-framework/
  6. ^ http://www.learnsomethings.com/2010/10/24/10-nights-with-sencha-touch-developing-the-mobile-portfolio-tracker/
  7. ^ http://www.w3.org/TR/offline-webapps/
  8. ^ http://diveintohtml5.org/offline.html
  9. ^ http://www.sencha.com/learn/Tutorial:Taking_Sencha_Touch_Apps_Offline
  10. ^ http://mobile.tutsplus.com/articles/news/sencha-touch-html5-mobile-framework/
  11. ^ http://www.mobilexweb.com/blog/safari-ios-accelerometer-websockets-html5
  12. ^ http://www.sencha.com/learn/Tutorial:A_Sencha_Touch_MVC_application_with_PhoneGap

Bibliography

  • Jesus Garcia and Anthony De Moss, Sencha Touch in Action (Early access edition), ISBN 978-1-61729-037-4.
Retrieved from "https://en.wikipedia.org/w/index.php?title=Sencha_Touch&oldid=503244391"