Latest Ext JS 7.8 is now available. Learn more

Sencha Touch 2 RC—Now with Native Packaging

February 22, 2012 426 Views
Show

Today, we’re happy to announce the release candidate of Sencha Touch 2 as well as our “native packaging for Windows and Mac”:#native-packaging.

Download Sencha Touch 2 RC   View Release Notes

*UPDATE*: Sencha Touch 2 GA is now available. Go download that instead!

h3. Six full-featured example apps

To provide some inspiration, we’re shipping six combination examples written by the Sencha Touch core team. Each uses best practices to help you get started on building your next great application.

  1. Jog with Friends Jog with Friends
    Combines Facebook’s social graph with a favorite activity.
  2. Touch Style Touch Style
    An infinite carousel of endless fashion items to keep every shopaholic happy.
  3. O'Reilly O’Reilly
    A conference template that’s as impactful as its content.
  4. TouchTweets TouchTweets
    Highlights how easy it is to consume all those @Sencha tweets.
  5. KivaTouch KivaTouch
    Help individuals around the globe.
  6. GeoCongress GeoCongress
    Keep a watchful eye on what your elected officials are up to.

In addition to the new examples, we have fixed various bugs and added some more features:

h4. Ext Direct

Combined with your favorite server side stack, you can now invoke remote methods client side using Sencha Touch.

// Calling a method on the server
myRemoteClass.myRemoteMethod();

h4. Enhancements to DataView

We now have a new option on DataViews that give your lists padding and rounded corners.

Ext.create(‘Ext.List’, {
ui: ’round’ // It’s that simple
});

While we’re all accustomed to using carousels when transitioning between cards, we thought it would be helpful if we could add in the ability to horizontally scroll Lists. DataViews can now scroll horizontally giving you all the momentum scrolling goodness you’ve come to love.

Ext.create(‘Ext.List’, {
inline: { wrap: false } // Smooth horizontal scrolling
});

h4(#native-packaging). Bridging to Native APIs

While we wait for native APIs to be exposed in standard browsers (WebKit just landed Vibration API), you can get access to many commonly requested APIs by packaging your app in a native shell. With the release of our native packager, you now have access to these popular APIs via JavaScript. In addition to a sample app and demo video, we’ve written a guide on Using Native APIs to show how simple using native APIs from JavaScript can be. This release candidate has the following APIs:

* Connection – tells you whether or not the device has a current connection to the internet
* Notification – allows you to use native notification windows (the native version of Ext.Msg)
* Orientation – gives you as much information as the device provides about its current orientation
* Camera – allows your app to take pictures or select from the camera library (with your user’s permission)

h4. Screencast

Quick walkthrough of packaging your web app for native distribution. View on Vimeo

h3. SDK Tools Update

Back in October of last year, we previewed our native packaging for iOS and Android as part of our SDK Tools. Although we only released the Mac OS version, we talked about being able to build these mobile applications on multiple platforms. Today’s release now supports the ability to package and sign iOS applications on Windows.

Download SDK Tools
Download for Mac   Download for Windows

h4. Getting Started

Once you download and install the SDK tools, you can start packaging your HTML5 app in a native shell by running a simple command.

notextile.. // Packaging made simple
sencha package ios.json

Let’s take a look at the json config file for packaging on Windows

notextile.. // Source of your ios.conf
{
“versionString”:”1.0″,
“iconName”:”icon.png”,

“applicationName”:”MyGreatApp”,
“applicationId”:”com.yourcompany.MyGreatApp”,

// Your webapp path
“inputPath”:”C:/projects/MyGreatApp/www/”,

// Native app destination
“outputPath”:”C:/projects/MyGreatApp/ios/”,

// Destination App Store!!!!
“configuration”:”Release”,

“platform”:”ios”,
“deviceType”:”iPhone”,

// Your Developer Cert
“certificatePath”: “c:/certs/Developer.p12”,
“certificateAlias”:”iPhone Developer”,

“orientations”: [“portrait”,
“landscapeLeft”,
“landscapeRight”,
“portraitUpsideDown”
] }

If all goes well you should see the following:

notextile.. The application was successfully packaged
The application was successfully signed

To help get you started, we’ve written a native packaging guide to help get you started with the process. We think this functionality opens up a whole new world for web developers around the globe. Sencha is excited to offer these capabilities to the mobile community free of charge.

h3. Summary

We are extremely proud of this progress we’ve made in this release candidate. We’ve worked around the clock refining and polishing Sencha Touch 2 for general release! We believe that Sencha Touch 2.0 raises the bar for mobile web experiences. We hope you think so too.

h4. Follow Sencha Touch 2 Development

If you missed all the great progress in our development of Sencha Touch 2, catch up with our release blog posts from the last three weeks:

* *Feb 1*: “Sencha Touch 2 Beta”:https://www.sencha.com/blog/sencha-touch-2-raising-the-bar/
* *Feb 8*: “Sencha Touch 2 Beta 2”:https://www.sencha.com/blog/dive-into-dataview-with-sencha-touch-2-beta-2/ and a tutorial on DataView
* *Feb 14*: “Sencha Touch 2 Beta 2”:https://www.sencha.com/blog/sencha-touch-2-beta-3-kindle-fire-and-chrome-support/ added support for Kindle Fire, and Chrome for Android
* *Feb 22*: Sencha Touch 2 Release Candidate
* *Mar 6*: “Sencha Touch 2 GA”:https://www.sencha.com/blog/announcing-sencha-touch-2/

<!--

coming soon

Something Awesome Is

COMING SOON!
-->

<!--

[gravityform id="31" title="true" description="true" field_values="order_type=other"]
-->