Friday, October 24, 2014

Using Cordova/PhoneGap with Xamarin Android

    Since I haven't found a lot of informations on this matter searching with Google I've decided to share my solution and, maybe, save some time for some of you. The target of this post is to get the Cordova / Phonegap running inside an Xamarin Android project on an Android device.

    In order to use Cordova inside an Xamarin project you would first need to build the Cordova framework.  What I did was to clone the repository Cordova Android and then follow the Building without the Tooling instructions.

      Once you have the cordova*.jar we can start binding the library using Xamarin. Do to that you will have to create a new Project using Xamarin Studio (this does not work in Visual Studio) and select the Android Java Bindings project type:

       The structure of the project is pretty simple. Add the Jar to the Jars folder and ensure the Build action is set to EmbeddedJar and try to build the project.

  You will get some errors compiling but luckily these errors are on components we don't need to bind to. So what you have to to is to edit the Metadata.xml file inside the Transforms folder and add the these two internal packages that we want to ignore:

Doing that will enable to correctly build the binding project.

    Now that we have the binding we can test it. For this I have build a test Project and copied the test www container from the github repository.  It took some while to make it work but everything seems to run as expected. I didn't have time to implement all the activities from the sample but only some of them. It should be pretty easy to port also the others if needed. This sample also uses a custom plugin that launches activities when the button on the main screen get pressed so you should basically have all that you need to start using Cordova with Xamarin. When you launch the project you should see this screen on your device/emulator:

These are the items implemented in the Test project: Backgroundcolor, Basic Authentification, Full Screen, HTML not found, Iframe Lifecycle, Menus & Splashscreen

Here is the link to my Github repository that contains the Binding project and the Test project. This sample is using Cordova 3.7.0

Contact me if you need help

P.S. Still preparing the 3rd post on BLE and it will be the most interesting one as it will be on running in the background.