AllInWorld99 provides a reference manual covering many aspects of web programming, including technologies such as HTML, XHTML, CSS, XML, JavaScript, PHP, ASP, SQL,FLASH, jQuery, java, for loop, switch case, if, if else, for...of, for...in, for...each,while loop, blogger tips, blogger meta tag generator, blogger tricks, blogger pagination, client side script, html code editor, javascript editor with instant output, css editor, online html editor, materialize css tutorial, materialize css dropdown list,break, continue statement, label,array, json, get day and month dropdown list using c# code, CSS button,protect cd or pendrive from virus, cordova, android example, html and css to make android app, html code play,telerik show hide column, Transparent image convertor, copy to clipboard using javascript without using any swf file, simple animation using css, SQL etc. AllInWorld99 presents thousands of code examples (accompanied with source code) which can be copied/downloaded independantly. By using the online editor provided,readers can edit the examples and execute the code experimentally.


     The following tutorial we are learn about how to create a simple android application using cordova, we already learn about cordova  installation and configuration.

     After the cordova installation and cofiguration, open command prompt (windows key + R => type cmd=>press Enter)

Command prompt

Step 1:
     First you need to choose the folder, create your folder on any of your drive, I have created the folder name "Android Cordova Project" in E:\ drive. Open command prompt and type your drive letter like E: and press enter. Next type cd E:\Android Cordova Project and press enter. Now your command prompt will see like below image.

Cordova directory


Step 2:
     That all now you have successfully ready to create the android project.

Step 3:
     You need to create the folder name, package name and project name.

Syntax
  cordova create FolderName PackageName projectname

Folder Name - One folder create in the current directory by this name.
Package Name -Your package name should start with com
Project name - Name of your android application

Example
cordova create TestApp com.Test.android "Test Application"

Create android cordova project
If you enter the above command and enter a new folder will created, this is the project folder.

Step 4:
     Move to the newly created folder by using CD command (cd TestApp).

Move to the current directory

Step 5:
     Lets add the platform, you can add windows, wp8, IOS, amazon-fireos, blackberry10, firefoxos. But now we are leaning the part of android os, so we will add the android os by the following command.

Syntax
     cordova platform add android[@version]
@version - is optional

Example
     cordova platform add android@4.1.1

Add android platform in cordova


Step 6:
     Go to the www folder and you can see some files including index.html. Now just we are modifying the index.html file.

     Right click on the index.html file and open with notepad or any other editor and copy and paste the following code and save the file.


<!DOCTYPE html>

<html>

    <head>
        <title>Hello World</title>
    </head>
    <body bgcolor="red">  
  This is the test android application
        <script type="text/javascript" src="cordova.js"></script>
    </body>
</html>

Step 7:
     We did the coding side now we need to build the application and run, type the following command.
     cordova build android

Build android cordova project

Wait few seconds, now this program was compiled and create a android-debug.apk file in "E:\Android Cordova Project\TestApp\platforms\android\build\outputs\apk".

Cordova created the apk output

Step 8:
     Install the file in any android device and see the output. I am using bluestacks to view the output.

Test cordova android app


Open it and see the output.

My first android app





0 comments:

Post a Comment

Total Pageviews