شروع کار با Apache Cordova در ویژوال استودیو #4
نویسنده: سالار ربال
تاریخ: ۱۳۹۴/۰۱/۱۰ ۰:۳۰
آدرس: www.dntips.ir
| مطالب | ۳۶۹۴ |
| نویسندگان | ۲۷۶ |
| گروههای مطالب | ۱۰۲۴ |
| نقشههای راه | ۱۱۹ |
| دورهها | ۱۴ |
| اشتراکها | ۱۷۹۱۴ |
<script src="cordova.js"></script>
(function () {
"use strict";
document.addEventListener( 'deviceready', onDeviceReady.bind( this ), false );
function onDeviceReady() {
// Handle the Cordova pause and resume events
document.addEventListener( 'pause', onPause.bind( this ), false );
document.addEventListener('resume', onResume.bind(this), false);
document.addEventListener('menubutton', onMenuButton.bind(this), false);
document.addEventListener('backbutton', onBackButton.bind(this), false);
//document.addEventListener('searchbutton', onResume.bind(this), false);
//document.addEventListener('endcallbutton', onResume.bind(this), false);
//document.addEventListener('offline', onResume.bind(this), false);
//document.addEventListener('online', onResume.bind(this), false);
//document.addEventListener('startcallbutton', onResume.bind(this), false);
//document.addEventListener('volumedownbutton', onResume.bind(this), false);
//document.addEventListener('volumeupbutton', onResume.bind(this), false);
// TODO: Cordova has been loaded. Perform any initialization that requires Cordova here.
};
function onPause() {
// TODO: This application has been suspended. Save application state here.
alert("paused");
};
function onResume() {
alert("resume");
};
function onMenuButton() {
alert("menu");
};
function onBackButton() {
alert("back button");
};
} )();
.در مقالات آینده از افزونههای موجود، برای مدیریت رخدادهای باتری سیستم استفاده خواهیم کرد
Phones/Tablets
Android 1.6+
BlackBerry 5+
iOS 3+
Windows Phone 7
WebOS 1.4+
Symbian (Nokia S60)
Firefox Mobile Opera Mobile 11+
Opera Mini 5+
Desktop browsers
Chrome 11+
Firefox 3.6+
Internet Explorer 7+
Safari
برای نصب jQuery Mobile کافی است دستورات زیر را در package manager console ویژوال استودیو استفاده کنید:
PM>install-package jquery
PM>install-package jquery.mobile.rtl
بعد از دانلود فایلهای مورد نظر خود، فولدری بنام jquery.mobile.rtl در ریشه پروژه ایجاد خواهد شد. به ترتیب فایل های rtl.jquery.mobile-1.4.0.css و rtl.jquery.mobile-1.4.0.js موجود در زیر شاخههای فلدر مذکور را به head و آخر body فایل index.html اضافه کنید.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>CordovaApp01</title>
<!-- CordovaApp01 references -->
<link href="css/index.css" rel="stylesheet" />
<link href="jquery.mobile.rtl/css/themes/default/rtl.jquery.mobile-1.4.0.css" rel="stylesheet" />
</head>
<body>
<div data-role="page" id="page1">
<div data-role="header">
<h1>اولین برنامه</h1>
</div>
<div data-role="content">
<p>سلام من محتوای اولین برنامه هستم</p>
</div>
<div data-role="footer">
<h1>من فوتر هستم</h1>
</div>
</div>
<!-- Cordova reference, this is added to your app when it's built. -->
<script src="scripts/jquery-2.1.3.min.js"></script>
<script src="cordova.js"></script>
<script src="scripts/platformOverrides.js"></script>
<script src="scripts/index.js"></script>
<script src="jquery.mobile.rtl/js/rtl.jquery.mobile-1.4.0.js"></script>
</body>
</html> نتیجهی نهایی به شکل زیر خواهد بود:
در مقالهی بعد به استفاده از pluginها خواهیم پرداخت.
ادامه دارد...
<div data-role= "content" > <p>سلام من محتوای اولین برنامه هستم</p> </div>
<div data-role= "content" ng-view="" > </div>