Tarkib
Biz har doim rivojlanib boradigan texnologik landshaftda yashayapmiz va ish stoli mashinalari uchun an'anaviy tarmoqdan mobil qurilmalarga o'tish endi har qachongidan ham muhimroq.
Mobil texnologiyalar va qurilmalarning imkoniyatlari doimiy ravishda rivojlanib bormoqda, shuningdek, foydalanuvchini qabul qilish hajmi ortib bormoqda. Marketing tashkilotlari uchun ham, daromadlar oqimi va moliyaviy daromadlarni yaratish uchun ajoyib yangi dastur yaratish uchun yoki shunchaki mavjud dasturiy ta'minot va echimlar bilan tajriba o'tkazish uchun ham ko'proq tashkilotlar va individual ishlab chiquvchilar ushbu qiziqarli formatga kirishni xohlashlari ajablanarli emas.
Siz qaysi platformani maqsad qilyapsiz? Siz qaysi tilda yozasiz? Mobil ilovalarni ishlab chiqish natijalari bu kabi savollarni tug'dirishi mumkin. Har bir platforma uchun o'z dasturlaringizni yaratish uchun Objective-C, Java yoki C ++ kabi yangi tillarni o'rganishni o'ylashingiz kerak degani.
Buning o'zi potentsial ravishda bir qator xarajatlarni keltirib chiqaradi: yangi tilni o'rganish uchun moliyaviy xarajatlar (vaqt va resurs materiallarini o'z ichiga olgan holda) va rivojlanish jarayonini samarali boshqarish xarajatlari. Agar biz bir xil dasturni bir nechta platformalar va operatsion tizimlarga surishni o'ylab ko'rsak, bu xarajatlar oshadi va har bir kod bazasini boshqarish va boshqarish qiyinroq bo'ladi.
PhoneGap ushbu asoratlarni va har bir operatsion tizim uchun qo'llab-quvvatlanadigan ona tilidan foydalangan holda platformaga xos dasturlarni ishlab chiqish xavotirini olib tashlashni maqsad qilib, ishlab chiquvchilarga HTML, CSS va JavaScript-laridan foydalangan holda o'zaro faoliyat platformalar dasturlarini yaratishga ruxsat berish orqali, ko'pchilik uchun tanish bo'lgan veb-texnologiyalar. agar barchamiz bo'lmasa.
Bu barcha veb-ishlab chiquvchilar va dizaynerlar uchun mahalliy o'rnatilgan mobil ilovalarni yaratish eshigini keskin ochib beradi va ularga mobil platformalar uchun maxsus ishlab chiqish uchun zarur bo'lgan til qobiliyatlaridan foydalanish imkoniyatini beradi.
Bundan tashqari, biz telefonning geografik joylashuvi va GPS, akselerometr, kamera, video va audio yozib olish kabi PhoneGap JavaScript API-dan foydalangan holda amalga oshiriladigan mahalliy funktsiyalarni ishga tushirish imkoniyatini qo'sha olamiz va sizning HTML ilovalaringiz bir zumda batafsil dasturlarga aylanadi. nihoyatda kuchli xususiyatlar.
Tarmoqqa ulanish holati ko'rsatilmoqda
Sizning arizangiz foydalanuvchini tarmoqqa ulanishni talab qilishi mumkin. Bu qisman yangilanishlar, masofadan ma'lumotlarni uzatish yoki oqim uchun bo'lishi mumkin. PhoneGap API-dan foydalanib, biz har qanday tarmoq ulanishining holatini yoki mavjudligini osongina aniqlashimiz mumkin.
Buni qanday qilish kerak ...
Ushbu retseptda biz qurilmamizning tarmoqqa ulanish holatini doimiy ravishda tekshirish uchun dastur tuzamiz.
PhoneGap / Cordova JavaScript kutubxonasidan tashqari biz sahifamizdagi DOM elementlarini boshqarish va o'zgartirish uchun kichik engil JS kutubxonasi XUI.js dan ham foydalanamiz. Siz monkeh.me/uf65z-dan so'nggi XUI.js-ning tuzilgan versiyasini yuklab olishingiz mumkin. Agar xohlasangiz, jQuery kutubxonasidan foydalanishingiz mumkin:
1. Dastur uchun dastlabki HTML tartibini yarating. Ichida PhoneGap va XUI JavaScript kutubxonalariga havolalarni qo'shing bosh hujjatning.
2. Shuningdek, biz o'rnatamiz deviceready voqea tinglovchisi DOM to'liq yuklangandan so'ng, biz ham qo'shamiz onLoad () tana yorlig'iga funktsiya chaqiruvi:
! DOCTYPE HTML> html> head> meta http-equiv = "Content-type" content = "text / html; charset = utf-8"> title> Network Status / title> script type = "text / javascript" charset = " utf-8 "src =" cordova-2.2.0.js "> / script> script type =" text / javascript "charset =" utf-8 "src =" xui.js "> / script> / head> body onload = "onLoad ()"> / body> / html>
3. UI elementlarini dasturimiz tanasiga qo'shaylik. Yarating div bizning konteynerimiz vazifasini bajaradigan blok statusMessage va hisoblash elementlari, ikkalasi ham to'g'ridan-to'g'ri XUI kutubxonasi yordamida murojaat qilamiz. Biz tarkibiga tarkib ham kiritamiz tezlik Xabar elementini tanlang, shuning uchun id ushbu uchta elementning atributi ko'rsatilganlarga mos keladi:
h3> Tarmoq holati / h3> div id = "holder"> div id = "statusMessage"> / div> div id = "count"> / div> / div> div id = "speedMessage"> / div>
4. Yangisini yarating skript yopilishidan oldin yorliq bloki bosh ikkita global o'zgaruvchini belgilang va aniqlang, biz ularni maxsus kod ichida ishlatamiz. Endi biz onLoad ni o'rnatadigan usul deviceready tadbir tinglovchisi:
skript turi = "text / javascript" charset = "utf-8"> var intCheck = 0; var currentType; funktsiya onLoad () {document.addEventListener ("deviceready", onDeviceReady, false); } / skript>
5. Endi qo'shamiz OnDeviceready dan chaqirilgan usul deviceready voqea tinglovchisi. Ushbu funktsiya doirasida biz ikkita yangi voqea tinglovchilarini qo'shib, qurilmaning tarmoqqa ulanganligini yoki uzilganligini tekshiramiz. Ushbu tinglovchilarning ikkalasi ham bir xil qo'ng'iroq usulini ishlatadilar, ulanish.
6. Keyin biz bir xil ishlash uchun intervalli taymerni o'rnatamiz ulanish bizni ulanish uchun doimiy yangilanishlarni ta'minlash uchun har soniyada usul:
onDeviceReady () {document.addEventListener funktsiyasi ("onlayn", checkConnection, false); document.addEventListener ("oflayn", checkConnection, noto'g'ri); var connCheck = setInterval (function () {checkConnection ();}, 1000);}
7. The ulanish funktsiyasini o'rnatadi objConnection qurilmaning ulanishini namoyish qilish uchun o'zgaruvchan. Ushbu ob'ekt turi xususiyati, undan biz hozirgi ulanish turini aniqlay olamiz. Ushbu qiymatni boshqa funktsiyaga o'tkazamiz getConnectionType, biz ulanish turini foydalanuvchi uchun qulay bo'lgan mag'lubiyatga qaytarish uchun foydalanamiz.
8. Ushbu usul har soniyada ishlayotgani sababli, biz hozirgi ulanish turining oldingi ulanishdan farq qiladimi yoki yo'qligini aniqlay olmoqchimiz. Buni ulanish turi qiymatini currentType global o'zgaruvchisi va uning joriy qiymatga mos kelishini tekshiring.
9. Aloqa turining qaytarilgan qiymatiga qarab, biz ixtiyoriy ravishda foydalanuvchiga bizning dasturimizdan maksimal darajada foydalanish uchun ular yaxshiroq aloqaga ega bo'lishlari kerakligi to'g'risida xabar berishni tanlashimiz mumkin.
10. Shuningdek, biz ichida saqlangan tamsayı qiymatini oshiramiz intCheck global o'zgaruvchi, biz joriy ulanish faol bo'lgan soniyalar sonini hisoblash uchun foydalanamiz:
function checkConnection () {var objConnection = navigator.network.connection; var connectionInfo = getConnectionType (objConnection.type); var statusMessage = ’p>’ + connectionInfo.message + ’/ p>’; agar (currentType! = objConnection.type) {intCheck = 0; currentType = objConnection.type; if (connectionInfo.value = 3) {x $ (’# speedMessage’). html (’p> Ushbu dastur tezroq ulanishda yaxshiroq ishlaydi. / p>’); } else {x $ ('# speedMessage'). html (''); }} intCheck = ++ intCheck; x $ (’# statusMessage’). html (statusMessage); x $ ('# count'). html ('p> Checked' + intCheck + 'seconds ago / p>');}
11. The getConnectionType Yuqorida aytib o'tilgan usul qaytib keladi xabar va qiymat ga qarab mulk turi parametr sifatida yuborilgan qiymat. The qiymat xususiyatlari bizning qo'llanishimiz va foydalanuvchilarimiz tajribasi uchun qaysi darajadagi ulanishni eng yaxshi deb bilganimizni boshqarishimiz uchun qo'lda tayinlangan:
getConnectionType funktsiyasi (turi) {var connTypes = {}; connTypes [Connection.NONE] = {xabar: 'Tarmoq aloqasi yo'q', qiymati: 0}; connTypes [Connection.UNKNOWN] = {xabar: 'Noma'lum ulanish', qiymati: 1}; connTypes [Connection.ETHERNET] = {xabar: 'Ethernet aloqasi', qiymati: 2}; connTypes [Connection.CELL_2G] = {xabar: 'Cell 2G ulanish', qiymati: 3}; connTypes [Connection.CELL_3G] = {xabar: 'Cell 3G ulanishi', qiymati: 4}; connTypes [Connection.CELL_4G] = {xabar: 'Cell 4G aloqasi', qiymati: 5}; connTypes [Connection.WIFI] = {xabar: 'WiFi ulanishi', qiymati: 6}; return connTypes [type];}
12. Va nihoyat, foydalanuvchi interfeysiga biron bir uslub qo'shish uchun dasturimizning pastki qismiga bir nechta CSS ta'riflarini qo'shamiz:
style> div # holder {width: 250px; minimal balandlik: 60px; margin: 0 avtomatik; pozitsiya: nisbiy; chegara: 1px qattiq # ff0080; chegara radiusi: 10px; background: # ff0080;} div # holder p {margin: 20px auto; matn bilan tekislash: markaz; rang: #ffffff; font-weight: qalin;} div # speedMessage {width: 250px; margin: 0 avtomatik; pozitsiyasi: nisbiy;} / uslubi>
13. Ilovani bizning qurilmamizda ishga tushirish natijasi quyidagicha ko'rinadi:
14. Agar bizning foydalanuvchimiz ulanish usulini o'zgartirsa yoki butunlay uzib qo'ysa, intervalli taymer o'zgarishni aniqlaydi va shunga mos ravishda interfeysni yangilaydi va taymer qayta boshlanadi:
U qanday ishlaydi ...
Biz o'rnatdik onDeviceReady -ni tekshirish uchun ikkita yangi voqea tinglovchilarini yaratish usuli onlayn va oflayn tegishli ravishda voqealar. The onlayn hodisa qurilmaning tarmoq ulanishi boshlanganda yonadi va oflayn voqea tarmoq ulanishi o'chirilganda yoki yo'qolganda yonadi.
Ushbu hodisalar faqat bir marta yonadi va shuning uchun ushbu retseptda biz qo'shdik setInterval doimiy ravishda qo'ng'iroq qilish uchun taymer funktsiyasi ulanish tarmoqqa kiritilgan o'zgarishlarni olishimizga imkon beradigan usul. Ushbu funktsional imkoniyatlarning qo'shilishi katta yordam beradi va foydalanuvchi qurilmasi, masalan, 3G-dan WiFi ulanishiga o'tishni aniqlaydi. Agar shunday bo'ladigan bo'lsa, qurilma oflayn rejimga o'tmaydi, balki ulanish turini o'zgartiradi.
Yana ...
Sizning ilovangiz oqim ma'lumotlarini, masofaviy ulanishlarni yoki tarmoqqa ulanishning ma'lum darajasini talab qiladigan boshqa jarayonni o'z ichiga olishi mumkin. Maqomni doimiy ravishda tekshirib va turi ulanishning eng maqbul darajasidan pastga tushganligini yoki tavsiya etilganligini aniqlashimiz mumkin turi arizangiz uchun. Ushbu vaqtda siz foydalanuvchini xabardor qilishingiz yoki ba'zi bir masofadan qo'ng'iroqlar yoki ma'lumotlar oqimlariga kirishingizni cheklashingiz mumkin, bu sizning arizangizning javobida kechikish va ularning mobil provayderidan foydalanuvchiga mumkin bo'lgan qo'shimcha moliyaviy xarajatlarni oldini olish uchun.
Mavjud API usullarini chuqurroq o'rganish va qurilma xususiyatlari bilan o'zaro aloqada bo'lish uchun quyidagini tekshiring PhoneGap Mobile Application Development Cookbook, Packt Publishing tomonidan nashr etilgan.
