Deploying a Sencha Touch app for Android

Yo!

I’m developing an application using Sencha Touch 2.3.1 and Cordova 3.4.1 on Ubuntu 14.04. Everything was fine, everything was ok and i was very happy with Sencha’s documentation… until i try to generate a Release APK for Google Play Store. It was much more painful than i expected, so this is a guide for ones trying to do it.

1 – Is your project set?

Well, this is a guide about deploying. However, i think it’s a good idea to walk through the project settings. Just to have sure we are working with similar stuff. Then, let’s go!

Firstly, have sure your environment is set. Sencha Cmd, Cordova and Android SDK (or whatever SDK you are deploying for) are installed (and on path). I won’t cover this steps.

Create your Sencha Touch project with Sencha Cmd. I put my Sencha Touch SDK path inside STOUCH variable. You should do something like that with yours.

$ sencha -sdk $STOUCH generate app MyApp ./MyApp

This will create a folder MyApp wherever you are. Change to it. Now we have to add Cordova (or PhoneGap) to our MyApp project.

$ cd MyApp

$ sencha cordova init

Nice. Now we have a Sencha Touch project that supports Cordova (or PhoneGap).

2 – Write your code!

This obvious second step is the moment you, developer, do what , a developer, should do. Write your code. Make your app. Do your magic.

3 – Deploy \o/

Finally. After several hours of fun, pain, love and hate, you want to deploy your app. Here i will talk only about Android deploying because this is my expertise. However, i don’t think it will be too much different for others plataforms.

Looks like Sencha Cmd cannot generate an APK signed as Release by itself on Ubuntu. I don’t have sure if you can do that on Windows, but i just couldn’t. The way i made it works was generating a Debug APK using Sencha Cmd and then using pure Cordova to sign it with a Release key. This is what i will describe next.

Edit cordova.local.properties. You should add the plataform you are going to deploy for. If Android only, make sure your cordova.local.properties looks like this:

cordova.platforms=android

Sencha’s documentation talks a lot about packager.json, However, i didn’t find a way to use it correctly. Looks like Sencha Cmd ignores it. Then, i don’t see a reason to edit anything in this file. Until this point i couldn’t find a way to correctly set Android target, min SDK or anything like that.

Build using Sencha Cmd. On MyApp root folder do:

$ sencha app build native

In the first run it compiles your app (inside the engine, it generates a package with everything someone need to run your app) and creates the Android folder inside “cordova/platforms” with everything you need to generate an APK. Including AndroidManifest.xml.

Now we have two debug versions of our app.

cordova/platforms/android/ant-build/MyApp-debug.apk

cordova/platforms/android/ant-build/MyApp-debug-unaligned.apk

We can send any (but it’s usually suggest to use the unaligned one) to a developer enabled device and run it. If that’s what you want, you have it. Cya and say thanks for all the fish. However, if you want to generate a Release signed APK to send to Play Store (for production, beta or alpha stages), keep reading.

At this moment, we will drop Sencha Cmd and use only pure Cordova (or PhoneGap). So, edit AndroidManifest.xml (at this point, it should be in cordova/platforms/android/AndroidManifest.xml ) as you would do in a native development and edit versionCode, versionName, targetSdkVersion and everything you need. I won’t cover details about this step also.

Then we need a key to sign our app. Google has a very good guide for this. If you are lazy (or don’t have time) to read and understand how it works, i can save you this time.

$ keytool -genkey -v -keystore /path/to/my-release-key.keystore -alias alias_name -keyalg RSA -keysize 2048 -validity 10000

This generate the file my-release-key.keystore on /path/to folder (obviously, replace this for a real path where you want to save thekey). Now we want to put it where Cordova (or PhoneGap) can read it.

In the same folder you found AndroidManifest.xml, we will create the file ant.properties. Inside it, put data about the key you created before. It should look like this:

key.store=/path/to/my-release-key.keystore

key.alias=alias_name

And we are done. We just need to run Cordova to generate our Release APK. Change to AndroidManifest.xml folder and run the build command.

$ cd cordova/platforms/android

$ cordova build android --release

It will ask for the key password you used when created this key and will genereate MyApp-release.apk inside ant-build. This is the appropriate package to be sent to a store.

And that’s it!


I hope i can help anyone in the same situation i was. I want to believe this isn’t the only option we have for doing this. I don’t like to have all those useless setting files (like packager.json or build.xml) and still need to interchange between Sencha Cmd and Cordova compiler. However, this is a working option and i hope it may help you as it helped me.

If you have any doubt, add a comment and i will try to help =)

Cya folks!

Advertisements

One thought on “Deploying a Sencha Touch app for Android

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s