Sencha Touch 2 Native Packaging for iOS on Mac 

Requirements

Software

Apple iOS provisioning

Note: You will need to know your App ID and App Name to complete the packaging process.

Steps to package your application for iOS on Mac

  1. Prerequisite: Complete iOS provisioning on Apple iOS provisioning portal.
  2. Install the packager (NKBuild.pkg), part of SenchaSDKTools 2.0
  3. Create a packaging configuration file to be use with the native packager (nkbuild).
  4. Run the packager (nkbuild) to create a packaged <application>.app.

Step 1: Complete iOS provisioning on Apple iOS provisioning portal for the application

Please use the Apple iOS provisioning portal to setup the appropriate development and distribution certifications and profiles.  

Step 2: Install the packager.

Step 3: Create a packaging configuration file to be use with the native packager.

The configuration file has the following format:

{
 
 
"applicationName":"<AppName>",
 
"applicationId":"<AppID>",
 
"outputPath":"<AppPackageOutputPath>",
 
"iconName":"<AppIconName>",
 
"versionString":"<AppVersion>",
 
"webAppPath":"<PathToWebApp>",
 
"configuration":"<Release | Debug>",
 
"platform":"<iOSSimulator | iOS>",
 
"deviceType":"<iPhone | iPad | Universal>",
 
"certificateAlias":"<(Optional)CertificateAlias>",
 
"orientations": ["portrait",
 
"landscapeLeft",
 
"landscapeRight",
 
"portraitUpsideDown"
 
]
 
}

Note: A configuration file template can be created by running the following command in the Terminal:

sencha package -g -c <config.template>

<config.template> is the name of the configuration file.

The following parameters are applicable to iOS packaging:

Parameters Details
"applicationName":"<AppName>" Both AppName and AppID can be found on the iOS provisioning portal on the App IDs section. !Screen Shot 2011-09-21 at 5.40.23 PM.png!E.g. from above, 
  • AppName is “Sencha Touch 2 Packaging”
  • AppID is “com.Sencha.Touch2Packaging”

    Note: the App ID is the same as the one you put in the Identifier field in Xcode.
"applicationId":"<AppID>"
"outputPath":"<AppPackageOutputPath>" The output location of the packaged application, <application.app>.
"iconName":"<AppIconName>" The icon file to be used for your application.

Note: Retina icon should be specified with @2x at the end of the icon name. For example icon.png (regular) and icon@2x.png (retina). If a retina icon with the <Icon Name>@2x.png exists, the packager will include the retina icon.

Note: Please refer to the iOS icon guideline for further information on icon file specifications.
"versionString":"<AppVersion>", The version of the application.
"webAppPath":"<PathToWebApp>" The path of the web application to be packaged.
"configuration":"<Release | Debug>" Specify build type: Release or Debug.
"platform":"<Simulator | iOS>" Specify if the build is for the iOS simulator (iOSSimulator) or for the device (iOS).

Note: the iOS simulator cannot run a signed build. A signed build can only be run on the device.
"deviceType":"<iPhone | iPad | Universal>" Specify device type.

Available options:
- iPhone: for iPhone applications
- iPad: for iPad applications
- Universal: for both iPhone and iPad applications
"certificateAlias":"<(Optional)CertificateAlias>" This is an optional configuration. You can specify a specific Certificate Alias to use for signing your application. 

Note: If omitted, the default certificate used is the one you setup in iOS Provisioning Portal.
"orientations": ["portrait", "landscapeLeft", "landscapeRight", "portraitUpsideDown" Specify the orientations of the application.

 Available options: “portrait”, “landscapeLeft”, “landscapeRight” and “portraitUpsideDown”

Sample debug configuration file

{
 
"applicationName":"Sencha Touch 2 Packaging",
 
"applicationId":"com.sencha.touch2packaing",
 
"iconName":"icon.png",
 
"versionString":"1.0",
 
"outputPath":"~/Desktop/nkBuild-iOS",
 
"webAppPath":"~/Desktop/www/",
 
"configuration":"Debug",
 
"platform":"iOSSimulator",
 
"deviceType":"iPhone",
 
"orientations": ["portrait",
 
"landscapeLeft",
 
"landscapeRight",
 
"portraitUpsideDown"
 
]
 
}

Sample release configuration file

{
 
"applicationName":"Sencha Touch 2 Packaging",
 
"applicationId":"com.sencha.touch2packaing",
 
"iconName":"icon.png",
 
"versionString":"1.0",
 
"outputPath":"~/Desktop/nkBuild-iOS",
 
"webAppPath":"~/Desktop/www/",
 
"configuration":"Release",
 
"platform":"iOS",
 
"deviceType":"iPhone",
 
"orientations": ["portrait",
 
"landscapeLeft",
 
"landscapeRight",
 
"portraitUpsideDown"
 
]
 
}

Step 4: Run the packager (nkbuild) to create a packaged <application>.app. 

Packaging a debug application and run it on the iOS simulator

Prerequisite*:* The Platform and Configuration setting needs to be set in the config file.

Example:

"platform":"iOSSimulator"

"configuration":"Debug"

Note: if the Platform and Configuration settings are not provisioned,  iOS will not run the application correctly.

To package a debug/unsigned application to run on the iOS simulator, issue the following command in Terminal:

sencha package -r -c <configFile>

The iOS simulator with the application running will launch after successful executing this command. 

Note: the “deviceType” identifier will trigger the appropriate simulator: iPhone or iPad.

Packaging the application to deploy on the iOS device

To package a signed application to run on the device, issue the following command in Terminal:

sencha package -c <configFile>

Note: an <AppName.app> is created in the specified output location. This is the application that you can use to deploy to the iOS device.

See Also

  1. Apple iOS provisioning portal
  2. iOS Icon guideline