Phonegap / Apache Cordova Device Api tutorials

Apache Cordova / Phonegap Device API Tutorial

Want create site? Find Free WordPress Themes and plugins.
Phonegap / Apache Cordova Device Api tutorials

Phonegap / Apache Cordova Device Api tutorial

 

In previous tutorials, we had look on phonegap events, from this tutorials we’re going see plugin tutorials. In this phonegap device api tutorial,i will explain how to get device information such as device uuid, model, platform, version. cordova version using Phonegap / Apache Cordova device plugin.

What you’ll learn from this tutorial ?

  • What is device api?
  • How to get device information using phonegap device api ?
  • how to create phonegap application for getting device information ?

What is device api ?

Device api is used to gather specific information about device such as cordova version, mobile model , platform information, device unique id (UUID). OS version

What are the properties of phonegap device api?

  • device.cordova returns cordova version
  • device.model returns device model (E.g HTC 132)
  • device.platform platform information (E.g Android)
  • device.uuid returns phone unique id (1sd341sdr1)
  • device.version App version

How to get device information using phonegap device api ?

  • Create Phonegap / Apache Cordova project
cordova create DeviceInfo com.phongap.deviceinfo DeviceInfo
  • Change working directory
cd DeviceInfo
  • Add Platform
cordova platform add android
  • Now add plugin for device plugin
cordova plugin add org.apache.cordova.device
  • Now Change your index.html code

In this tutorial i’ve integrated Ionic Framework for UI design

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Device Info</title>
<link rel="stylesheet" href="css/ionic.min.css">
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/jq.js"></script>
<script>
function onLoad()
{
alert("onload");
document.addEventListener("deviceready",odr,false);
}
function odr()
{
alert("device ready");
var cordovaVersion=device.cordova;
var phoneModel=device.model;
var phonePlatform=device.platform;
var phoneUUID=device.uuid;
var osVersion=device.version;
$("#cordovaVersion").html(cordovaVersion);
$("#phoneModel").html(phoneModel);
$("#phonePlatform").html(phonePlatform);
$("#phoneUUID").html(phoneUUID);
$("#osVersion").html(osVersion);
}
</script>
</head>
<body onload="onLoad()">
<div class="bar bar-header bar-light">
<h1 class="title">Device Information</h1>
</div>
<br/><br/>
<ul class="list list-inset">
<div class="item">
Cordova Version <p id="cordovaVersion" class="item-note"></p>
</div>
<div class="item">
Phone Model <p id="phoneModel" class="item-note"></p>
</div>
<div class="item">
Platform <p id="phonePlatform" class="item-note"></p>
</div>
<div class="item">
UUID <p id="phoneUUID" class="item-note"></p>
</div>
<div class="item">
OS Version <p id="osVersion" class="item-note"></p>
</div>
</div>
</body>
</html>

 

Screenshot

phonegap device api tutorials

phonegap device api tutorials

Did you find apk for android? You can find new Free Android Games and apps.
MyMail WordPress Plugin free
Save $50 USD on Ionic Firebase Chat Source CodeEXPLORE