Sunday 13 April 2014

Integration of Database in Android using Phonegap.

Hello Friends,


Today we are going to see How we can manage the database in Android using Phonegap.

For more videos please follow this channels
Please get the latest details about programming
visit our website
http://webconnect.0fees.net/

1) Create the New Phonegap Project. See Here

2) Add this code to your index.html page under Project=>asset=>www=>index.html


3) Now you will get the following UI.


4) When ever you want to use the storage API then you must check this that cordova loaded successfully loaded in DOM or not.
document.addEventListener("deviceready","onDeviceReady",false);
function onDeviceReady() {
      alert("Cordova is loaded successfully.")

}



5) Write this Code for Creating the Database "Student"




6) Write this code for Inserting record to the Database.


7) at last you will get this output.



For more videos please follow this channels
Please get the latest details about programming
visit our website
http://webconnect.0fees.net/


Thank You
Abhishek Bendre

Event Life Cycle of Phonegap API.

Hello Friends,

Today, we are going to see how we can use the different of Phonegap API.

here is the list of event which we can use in our application.

For more videos please follow this channels
Please get the latest details about programming
visit our website
http://webconnect.0fees.net/

1) ondeviceready:
                      This event fires when the cordova is successfully loaded into the DOM. just like the load event of the document.
2) pause:
                      This event fires when an application puts into the background mode.
3) resume:
                     This event fires when an application is in foreground mode. (back into active state)
4) online:
                    This event fires when an application goes online or device is connected to the internet.
5) offline:
                   This event fires when an application goes offline or device is not connected to the internet.
6) backbutton:
                   This event fires when the user press the backbutton.
7) batterycritical:
                   This event fires when the battery reaches the critical level threshold. and this value is device-specific.
8) batterylow:
                    This event fires when the battery reaches the low level threshold.
9) batterystatus:
                   This event fires when the battery status changed at list one percentage (1%)
10) menubutton:
                   This event fires when the user press the menu button.
11) searchbutton:
                  This event fires when the user press the search button.
            
12) startcallbutton:
                 This event fires when the user press the start call button.
13) endcallbutton:
                 This event fires when the user end the call.
14) volumedownbutton:
                 This event fires when the user incress the volume. (Supported by Blackberry)
15) volumeupbutton:
                 This event fires when the user decress the volume.(Supported by Blackberry)


Now, we are using the some of event in this demo

1) Create your Phonegap project. Seehere

2) Open your index.html page and write this code into you page.



3) After, run this application.



For more videos please follow this channels
Please get the latest details about programming
visit our website
http://webconnect.0fees.net/


Thank You
Abhishek Bendre

How to Use Notification in Android using Phonegap API.

Hello Friends,


Today,  we are going to see how we can manage the dialogs or Notification in android using phonegap API.

For more videos please follow this channels
Please get the latest details about programming
visit our website
http://webconnect.0fees.net/

Create New Project called NotificationProject using Nodejs Command prompt.

1) Open Nodejs command Prompt and fire the below command.
cordova create NotificationProject web.connect NotificationProject
cd > NotificationProject
cordova platforms add android

cordova build




2) Add the dialog plugin to our project. Dont forgot to build after adding plugin to project
in the same directory

cordova plugin add "org.apache.cordova.dialog"



3) Import project to Eclipse. See this blog
4) Add button to your index.html page.

5) call a function ShowAlert on button click.


6) Add the following code to this function.

navigator.notification.alert("This is alert",null,"Information","OK");



7) For Confirm Dialog:
navigator.notification.confirm("Do you want to close this window?",result,"Confirmation","Yes,No");
function result(btnIndex) {
      if(btnIndex == 1) {
            navigator.notification.alert("You have clicked on Yes Button.",null,"Information","OK");
      }

}



8) For prompt dialog. This will prompt an alert and accepts the input from alert.
navigator.notification.prompt("Enter your Name?",result,"Get Name",['OK','Cancel'],"Default Name");
function result(returnValue) {
       navigator.notification.alert(returnValue,null,"Information","OK");

}


For more videos please follow this channels
Please get the latest details about programming
visit our website
http://webconnect.0fees.net/

Thank You
Abhishek Bendre


How to get Device Information in Android using Phonegap

Hello friends,


Today we are going to see "How we can get the DeviceInfo in Android using Phonegap3".

For more videos please follow this channels
Please get the latest details about programming
visit our website
http://webconnect.0fees.net/

Here are the Steps that how we can get the Device Information.

1) Create a New Project using Nodejs Command Prompt.
http://webboostings.blogspot.in/2014/04/how-to-configure-phonegap-for-android.html
2) Import the project into eclipse.
3) Add the plugin using the following command.

cordova plugin add "org.apache.cordova.device"



4) Now Configure you html page where you want to display this Information.


5) Now, Use device.model, device.cordova, device.platform, device.version etc.

6) And here is the output.


For more videos please follow this channels
Please get the latest details about programming
visit our website
http://webconnect.0fees.net/


Thank You
Abhishek Bendre

How to create HelloWorld App in Android using Phonegap

Hello Friends,


Today we are going to see How we can create a simple "HelloWorldApp" in Android using Phonegap.

For more videos please follow this channels
Please get the latest details about programming
visit our website
http://webconnect.0fees.net/


Here are the steps through which we can create the Project.

1) Open Nodejs Command Prompt
2) Type the Following command:
3) cordova create HelloWorld com.webconnect HelloWorld
4) cd HelloWorld
5) cordova platforms add android
6) Now Open Eclipse
7) Select File=>New=>Project=>Browse the HelloWorld=>Platforms=>android Directory
8) in Asset=>www=>index.html Add your own text whatever you want.
9) Create an AVD

10) Run your Project.






For more videos please follow this channels
Please get the latest details about programming
visit our website
http://webconnect.0fees.net/


Thank You
Abhishek Bendre

Thursday 10 April 2014

How to Configure and Create iOS app using Phonegap

Hello Friends,

Today we are going to configure the Phonegap 3 for iOS.

For more videos please follow this channels
Please get the latest details about programming
visit our website
http://webconnect.0fees.net/

MAC Requirements for using latest Phonegap.

1) Need MAC OS 10.9.0
2) Need xCode 5
3) Install Nodejs inMAC. Download Nodejs
Now after installing the Nodejs in MAC then we have to fire some commands.

4) so, Open terminal in MAC
5) fire the command : sudo npm install -g phonegap




6) After completing the above process fire the next command.

sudo npm install -g cordova



these command will install the phonegap and cordova globally.
7) Create your project by giving this command.
cordova create HelloWorld com.abhishek.webconnect HelloWorld

Description:
1) HelloWorld  => Directory Name
2) com.abhishek.webconnect  => Package Name
3) HelloWorld   => Project Name
8) This project will create in your Home Directory.
9) Go to the HelloWorld Directory by using cd and ls command using terminal.
10) Now add the platforms to our project. cordova platforms add ios
11) Build your project. cordova build




For more videos please follow this channels
Please get the latest details about programming
visit our website
http://webconnect.0fees.net/



Thank You

Abhishek B. Bendre

How to Configure Phonegap for Android in Windows.

Hello Friends,

Today, we are going to set-up the environment for Android Phoengap 3.

For more videos please follow this channels
Please get the latest details about programming
visit our website


1) Install the latest JDK on you PC. Download JDK
2) Download the latest SDK for Android DevelopmentDownload Android SDK and Eclipse
3) Download the Ant BinaryDownload Ant Binary
4) Extract the ant Binary ZIP. Copy all the Files into the Downloaded SDK folder.




here is the path where you have to copy the ant files.
adt-bundle/sdk/tools/ant

Configuration of Path Variables.








5) Right Click on "My Computer" => Properties
6) Click on "Advance System Settings" on Left Side.
7) In Advance Tab Click on "Environment Variables" button.
8) Copy you Installed jdk path and Create New Variable and Name it "JAVA_HOME" as listed in Image.

9) Now Edit the "Path"Variable in First Section. Add the Following paths to the end of the existing path
       1) Add you sdk platform tools path :  C\Android Developement\adt-bundle\sdk\platform-tools
       2) Add you sdk tools path : C:\Android Developement\adt-bundle\sdk\tools
       3) Add you sdk ant path : C:\Android Developement\adt-bundle\sdk\tools\ant\bin
       4) Add your Java home path : %JAVA_HOME%\bin

10) All in one you will get the following full path for "Path" variable.
;C\Android Developement\adt-bundle\sdk\platform-tools; C:\Android Developement\adt-bundle\sdk\tools; C:\Android Developement\adt-bundle\sdk\tools\ant\bin; %JAVA_HOME%\bin

11) Create Same thing for the System Variable Section just below the User Variables.
12) For testing just open your "Command Prompt" and type "java" for testing the Java Path and "ant" for ant binary path.


For more videos please follow this channels
Please get the latest details about programming
visit our website



Thank You
Abhishek Bendre