PhoneGap/Cordova Compatibility For Codename One

DZone 's Guide to

PhoneGap/Cordova Compatibility For Codename One

How the open source project Codename One works with Cordova/PhoneGap and NetBeans to build native mobile apps.

· Mobile Zone ·
Free Resource

We just released the first version of the open source CN1Cordova project on github. This means you can take a common Cordova/PhoneGap app, import it into NetBeans and build a native app using our cloud build servers without any changes!

Before we delve into the exact process of converting an app lets start by reviewing the exact benefits PhoneGap/Cordova developers can gain from Codename One. You can also check out the video tutorial and slides below.

Why Would I Want To Convert?

What Advantages Does Codename One Hold For PhoneGap/Cordova Developers?

Build Cloud On Steroids

Codename One provides a build cloud similar to PhoneGap build only far more advanced. It can translate Java bytecode into native thus allowing you to write a great deal of your "native" API in Java instead of writing it again and again for every platform.

Better Native Code Support

You can and should write your "native" code in Java thus removing the need to write Objective-C/Swift code when building a plugin. However, you can still use cn1lib's and native interfaces to implement pretty much anything using true native calls to Objective-C, Dalvik/ART runtimes.

Better Protection Of IP

Cordova/PhoneGap apps are effectively just a set of HTML/JavaScript & CSS files. Since native packaging is "just a zip file", it triggered a cottage industry of unzipping such applications and reselling them thru other accounts/stores.
Its much harder to do this for compiled applications, making the Java code in Codename One more opaque to the casual hacker. If your application contains sensitive logic you can code it in Java for extra security. We are also considering a hardened version of the PhoneGap integration that will encrypt the files within making the process even more secure.

IDE Integration Java - JavaScript - HTML

NetBeans has remarkable JavaScript & html/css support. It also supports all the common web frameworks such as react, angular etc. while being completely free...
NetBeans is also one of the best Java IDE's in the market and having one single all encompassing environment is a huge benefit.

Easy, Doesn't Require A Mac, Automates Certificates/Signing

Codename One's environment works on Mac, Linux & Windows without a problem. One of the "killer features" of Codename One is the certificate wizard that makes the normally nightmarish process of signing an iOS app, bare-able.

Migration To Java

If your team prefers Java you can move to a Java application in stages or even integrate pieces that are written in Java with Cordova elements.

What Are The Limitations?

The first version of the converter doesn't currently translate plugins, it does have some builtin plugins for features such as camera etc.
This is something we intend to address soon so the translation process will be smoother.

Since the native implementation of plugins in Codename One differs a great deal from native plugins in PhoneGap/Cordova there will be some manual work required to migrate plugins. Thankfully since most plugin functionality is already supported in the core Codename One Java API, this is relatively trivial work for most cases.

Currently the browser component used in Codename One is based on the JavaFX browser component which is pretty awful. Its based on webkit but has many limitations in regard to full HTML5 compliance and doesn't correctly specify things such as user-agent. It does work with most JavaScript frameworks correctly though.
We have plans to replace that component with a more mature browser component based on chromium if there is enough community interest to justify the effort.

Why Didn't You Do This Sooner?

We were (and still are) concerned about confusion. Codename One uses a rather elaborate architecture of converting bytecode to native code. This is coupled with an OpenGL ES based rendering pipeline and native widget mixing.
But then we added things like JavaScript support which uses TeaVM and our own set of complex libraries to facilitate WORA (Write Once Run Anywhere). At this point with so many other projects making noise about cross platform mobile development, we came to the conclusion that "avoiding confusion" isn't a reasonable enough argument.

Does This Mean a Shift In Focus For Codename One?

Our core competitive advantage has always been our huge API and client UI libraries, even with the support above it is still one of the key advantages.

Porting A Cordova/PhoneGap app To Codename One

Pre-requisites for this are: NetBeans IDE, JDK 8 (not Java JRE.. JDK!) & Apache Ant.
Download cn1-cordova-tools.zip and extract.

From the terminal or command prompt:

$ cd cn1-cordova-tools
$ ant create -Dsource=/full/path/to/cordova/app

Note: make sure you are using Java 8 and if not make sure your JAVA_HOME environment variable points at the Java 8 home directory otherwise you might get an UnsupportedClassVersionError. Also make sure you are using the full path to the Cordova app and not a short path or this won't work (no relative paths etc.).
This will create Netbeans Project inside the cn1-cordova-tools directory with settings (package id and name) matching the app specified in the -Dsource argument. The contents of the app's www directory will be copied to the project's src/html directory.

You can open this project up in NetBeans to start working on it. You will be able to run and debug the Java source files in the project. To send a cloud build or change project configuration just use the right click menu and select the correct options.

As mentioned above plugins won't be imported. If the app has plugins installed, you'll see a warning printed.
Future versions should add support for this in some form (e.g. replacing well known plugins with Codename One plugins). There is already support in Codename One for developing Cordova plugins and distributing them as cn1libs (Codename One's native library/plugin format). We will publish the instructions for this as the integration matures.

java ,mobile ,phonegap ,phone gap ,cordova ,open source ,netbeans ,html5 ,javascript ,mobile app

Published at DZone with permission of Shai Almog , DZone MVB. See the original article here.

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}