Smart Mobile Studio
  • News
  • Forums
  • Download
  • Store
  • Showcases
    • Featured demos
    • The Smart Contest 2013, Round 1 – Graphics
  • Documentation
    • Get the book
    • System requirements
    • Prerequisites
    • Getting started
      • Introduction
      • Application architecture
      • The application object
      • Forms and navigation
      • Message dialogs
      • Themes and styles
    • Project types
      • Visual project
      • Game project
      • Console project
    • Layout manager
    • Networking
      • TW3HttpRequest
      • TW3JSONP
      • Loading files
  • About

How to use Cordova

Posted on 07.12.2013 by Smart Mobile Studio Team Posted in Developers log, News

CordovaWhile the next version 2.0 is still not entirely ready, here’s a post about how your HTML5 application can be converted to a native application with Cordova (the open source base of PhoneGap). It’s a bit more tricky than with PhoneGap, but completely free of any costs and you don’t need to transmit your application to any server, which might be in times of NSA surveillance always a bit critical.

The tutorial below only covers the basics. If you want to use plugins to enhance the native experience (e.g. to access hardware directly), you need to consult the plugin’s documentation.

  1. Node.js_LogoInstall the latest Node.js
  2. Install Cordova via “npm install -g cordova”
  3. Eventually install the latest Java and JDK (if not installed already)
  4. Download Ant (“.zip archive”) and extract the content to any desired directory
  5. Android[Optionally] Install Eclipse (or ADT, see next item 6)
  6. Install Android SDK [included in ADT]
    • Version 2.2 (API 8) and 4.3 (API 18) [+others if desired]
    • Google APIs
    • Android SDK, Platform & Build Tools
  7. [Optionally] Install Blackberry10 API
    • similar to step 5 install NDK from the QNX IDE (for example to
      C:\BBNSDK

       as no spaces are allowed in the path (!))

    • call
      bbndk-env_10_2_0_1155.bat

        and then

      sdkinstall.bat

        (in the same command line window!)

  8. Windows Phone[Optionally] Install Windows Phone SDK
    • The SDK 8.0 for Windows 8 (includes everything)
    • [For Windows 7 or below:] SDK 7.1 + Updates
  9. Add paths to Java, Ant, Android SDK, BlackBerry10 (should be done via the batch files already)
    1. Click on the Start menu in the lower-left corner of the desktop, right-click on Computer, then click Properties.
    2. Click Advanced System Settings in the column on the left.
    3. In the resulting dialog box, press Environment Variables.
    4. Select the PATH variable and press Edit.
    5. In my case I needed to add:
      C:\Program Files\Java\jre7\bin;C:\Program Files\Java\jdk1.7.0_40\bin;C:\Program Files (x86)\Ant\bin;C:\Program Files\Java\jdk1.7.0_40\lib
    6. Ensure you also have a variable called
      JAVA_HOME

       , which points to the bin directory

      • If you have error message, which you don’t understand it’s likely that some paths are missing!

Cordova should be ready now to build Android, BlackBerry10, WP7 [& WP8] applications. You can now proceed the short tutorial below or continue with the command line interface documentation for Cordova, which covers the same commands, but with more detailed explanations.

  1. Locate your Smart Project’s bin (/ www) folder and…
    1. Type
      cordova create projectname com.smartmobilestudio.projectname ProjectName

        (replace “projectname” with the name of the project)

    2. change directory to “ProjectName” (i.e. “cd ProjectName”)
    3. replace the content in the www subdirectory with you’re content
      • do not delete config.xml, but you may (and should) edit that file for your needs
    4. Type
      cordova platform add android

        (for Android support)

    5. Type
      cordova platform add blackberry10

      (for BlackBerry10)

    6. Type
      cordova platform add wp7

      (for Windows Phone 7)

    7. Type
      cordova platform add wp8

      (for Windows
      Phone 8)

    8. ! Note the lower case platform names (i.e. “cordova platform add Android” will fail with a cryptic error message!)
    9. Type
      cordova build

        (to build the binaries, might take a while!)

      • “Build” will fail for Android, if the path contains spaces(!), but at least the error message is clear in that case
      • By default, “build” builds debug code, add
        --release

          for release versions

  2. [For Android only:] If you want to test your application in the emulators, they must be configured first!
    • Type
      android

       , then choose “Tools”->”Manage AVDs…” one virtual device for version 2.2 (i.e. a phone) and one for 4.3 (maybe a tablet)

  3. Test your application via 
    cordova emulate [platform]
    • For android that is
      cordova emulate android

       , then start the image you want manually (via 

      android

        ->”Tools”->”Manage AVDs…”)

  4. For native deployment you can also:  
    cordova run [platform]

If everything worked fine you should now have binaries of your application for GooglePlayAndroid, Blackberry 10, Windows Phone 7 and eventually Windows [Phone] 8. These applications can now be deployed the same way as native applications written in any other language. This includes selling the application via the device’s ecosystem’s store (e.g. Google Play).

iOS

The same steps can also be performed on Mac to retrieve OSX and iOS applications, that can be deployed via iTunes. However, an Apple developer account an XCode is required. For this a membership fee is necessary.

Build Cordova Deployment how-to tutorial
« Smart Mobile Studio v2.0 (beta)
Smart Mobile Studio 2.0 »

Pages

  • About
  • Feature Matrix
  • Forums
  • News
  • Release History
  • Download
  • Showcases
    • The Smart Contest 2013, Round 1 – Graphics
  • Store
  • Documentation
    • Creating your own controls
    • Debugging, exceptions and error handling
    • Differences between Delphi and Smart
    • Get the book
    • Getting started
      • Introduction
      • Local storage, session storage and global storage
      • Application architecture
      • The application object
      • Forms and navigation
      • Message dialogs
      • pmSmart Box Model
      • Themes and styles
    • Layout manager
    • Networking
      • Loading files
      • TW3HttpRequest
      • TW3JSONP
    • Prerequisites
    • Real data, talking to sqLite
    • System requirements
    • Project types
      • Visual project
      • Game project
      • Console project

Archives

  • December 2019
  • December 2018
  • November 2018
  • July 2018
  • June 2018
  • February 2018
  • September 2017
  • April 2017
  • November 2016
  • October 2016
  • September 2016
  • April 2016
  • March 2016
  • January 2016
  • October 2015
  • September 2015
  • July 2015
  • April 2015
  • January 2015
  • December 2014
  • October 2014
  • September 2014
  • August 2014
  • July 2014
  • June 2014
  • March 2014
  • February 2014
  • January 2014
  • December 2013
  • November 2013
  • October 2013
  • August 2013
  • July 2013
  • June 2013
  • May 2013
  • April 2013
  • March 2013
  • February 2013
  • January 2013
  • December 2012
  • November 2012
  • August 2012
  • July 2012
  • June 2012
  • May 2012
  • April 2012
  • March 2012
  • February 2012
  • January 2012
  • November 2011
  • October 2011
  • September 2011

Categories

  • Announcements (25)
  • Developers log (119)
  • Documentation (26)
  • News (104)
  • News and articles (16)

WordPress

  • Register
  • Log in
  • WordPress

Subscribe

  • Entries (RSS)
  • Comments (RSS)
© Optimale Systemer AS