مقدمه
با سلام خدمت کاربران گرامی سایت پی وی لرن و کاربرانی که علاقمند به فراگیری دوره آموزش کوردوا هستند. در جلسه گذشته پلاگین Media capture و کاربردهای اساسی آن آشنا شدیم در این جلسه آموزش کار با پلاگین Network Information در کوردوا ارائه می گردد.
آموزش کار با پلاگین Network Information در کوردوا
از پلاگین Network Information برای فراهم آوردن اطلاعات در مورد شبکه دستگاه (device’s network) استفاده می شود.
در آموزش کار با پلاگین Network Information در کوردوا به صورت مرحله به مرحله و گام به گام با نصب و کار با این پلاگین آشنا خواهید شد.
مرحله ۱ – نصب پلاگین Network Information
برای نصب پلاگین Media باید دستور زیر را در پنجره command prompt اجرا کنید.
مثال :
| C:\Users\username\Desktop\CordovaProject>cordova plugin add cordova-plugin-network-information |
مرحله ۲ – اضافه کردن دکمه ها
بیایید برای دریافت اطلاعات network یک دکمه در index.html ایجاد کنیم.
مثال :
| <button id = "networkInfo">INFO</button> |
مرحله ۳ – اضافه کردن Event Listeners
در این مرحله سه event listeners در تابع onDeviceReady در درون index.js اضافه می نماییم.
از یکی listen ها برای کلیک بر روی دکمه ای که قبلاً ایجاد کرده ایم استفاده می شود.
از دو listen دیگر نیز برای تغییر در وضعیت اتصال استفاده می گردد.
مثال :
| document.getElementById("networkInfo").addEventListener("click", networkInfo); document.addEventListener("offline", onOffline, false); document.addEventListener("online", onOnline, false); |
مرحله ۴C – ساخت توابع
هنگام کلیک بر روی دکمه، تابع networkInfo اطلاعات مرتبط با اتصال شبکه فعلی را باز می گرداند.
در این مرحله روش type را فراخوانی می نماییم.
توابع دیگر، توابع onOffline و onOnline هستند.
این توابع تغییرات اتصال را بررسی می کنند و با بروز هر گونه تغییر پیام هشداری را ظاهر می نمایند.
مثال :
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | function networkInfo() { var networkState = navigator.connection.type; var states = {}; states[Connection.UNKNOWN] = 'Unknown connection'; states[Connection.ETHERNET] = 'Ethernet connection'; states[Connection.WIFI] = 'WiFi connection'; states[Connection.CELL_2G] = 'Cell 2G connection'; states[Connection.CELL_3G] = 'Cell 3G connection'; states[Connection.CELL_4G] = 'Cell 4G connection'; states[Connection.CELL] = 'Cell generic connection'; states[Connection.NONE] = 'No network connection'; alert('Connection type: ' + states[networkState]); } function onOffline() { alert('You are now offline!'); } function onOnline() { alert('You are now online!'); } |
هنگامی که برنامه را به شبکه متصل می کنیم، تابع OnOnline هشداری را ظاهر خواهد کرد.
cordova network online
با فشردن دکمه INFO پیغام هشدار ظاهر شده وضعیت network را نشان خواهد داد.
cordova network info
در صورت قطع اتصال با network، تابع onOffline فراخوانی می گردد.
cordova network offline
کلام آخر
در این جلسه با پلاگین Network Information آشنا شدیم و کار با آن را آموختیم.
در جلسه بعدی با پلاگین Splash Screen در کوردوا آشنا می شویم.
با پی وی لرن همراه باشید.
فروشگاه
فیلم های آموزشی
کتاب های آموزشی
مقالات آموزشی
وردپرس
