XPlatform APPlication Devlopment on Visual Studio

Howdy Fellas! I recently received an email from a  follower of my blog he wanted to know how to develop cross(XPlatform) mobile APPs on Visual studios.

If you are unfamiliar to cross platform apps or hybrid apps, they are those apps that can run on more then one platform and treated as (partially) native while running on an instance of a particular OS. Since they are a combination of loosely typed and cross platform supported languages like

HTML 5 CSS and Javascript -> Native (Android/Iphone/Blackberry) etc..

The tools you need to get started are:

1. Visual Studios(at least version 2012 recommended )

2. Icenium Plugin for visual Studios

3. Fundamental knowledge of Visual studios IDE Environment

4. Fundamental Syntax of HTML5/CSS3/Javascript and their working knowledge

and of course a working internet connection 🙂 and that’s all

STEP #1 :

DOWNLOAD and install Visual studios

STEP#2

goto : http://www.icenium.com/product/visual-studio-extension

and download and install the Icenium  addon for visual studios

after you done installing Visual studios and Icenium it should probably look something like this..

vs after install ice

 Visual Studio After installing Icenium plugging

Note : I am using Visual studio 2012, but you can use an advance version as well, it works the same way.

STEP#3

Now to start a new Project goto :
File->New->Project: Icenium Tab and select any option amongst the given options

starting new project

Starting a new Project

I used the Jquery mobile but you can use any you like the fields below i.e

Name : [name of you app/project]
Location: [location of your app/project]
Solution name : [generic: solution name for your app/project]

after making the project

after you done starting a project

After you are done starting a project you app should look something like this.

Now Index.html is the page where all the magic happens. You’ll hard code everything in here and leave the rest if you are less experience in web/app development.

you can now view your freshly made app just out of the box by clicking icenium->Run [appname] in simulator

building app

viewing you project in simulator

Note: inorder to use icenium you have to login first, when you first click the icenium tab after installing it you will be prompted with the login pre-requisite.

view in realtime

viewing your app in simulator(realtime)

here’s a view that should be shown when you run your app in simulator

you can tweak the phone build versions, from the highlighted area in red in the figure. Hence forth now your first app ready to get published

in order to publish your app you need to go to icenium tab again and icenium->build [appname] in cloud

publishing ur app

publishing your app in cloud

after you click the build in cloud the build type will come up

build droidoriphone

now it’s upto you what you want you app to be built in either Android or Iphone..

after it’s done building the app on cloud you can either download the version on you local computer or download it with QR reader on your phone

download the built app

download the built version

I have an android phone so i downloaded the android one after building it in android version.

That’s all guys, hope that helped. In case i missed something comment or PM me… Good day!

Advertisements

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 )

Twitter picture

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

Facebook photo

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

Google+ photo

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

Connecting to %s