الأحداث في كوردوفا

من موسوعة حسوب
< Cordova
مراجعة 08:51، 16 ديسمبر 2018 بواسطة جميل-بيلوني (نقاش | مساهمات) (تعديل موضع جدول المحتويات)
اذهب إلى التنقل اذهب إلى البحث

توفر كوردوفا العديد من الأحداث التي يمكن استخدامها من قبل التطبيقات، إذ يمكن إضافة مُنصِتات (listeners) لها لتحسس وقوعها ومعالجتها.

إليك المثال التالي المكون من ملفين. الملف الأول هو ملف HTML بالشكل التالي:

<!DOCTYPE html>
<html>
    <head>
    <title>Device Ready Example</title>
    <script type="text/javascript" charset="utf-8" src="cordova.js"></script>
    <script type="text/javascript" charset="utf-8" src="example.js"></script>
    </head>
    <body onload="onLoad()">
    </body>
</html>

والملف الثاني هو ملف JavaScript:

// example.js الملف
// انتظار تحميل الواجهة البرمجية للجهاز
//
function onLoad() {
    document.addEventListener("deviceready", onDeviceReady, false);
}
// الواجهات البرمجية للجهاز جاهزة
//
function onDeviceReady() {
    document.addEventListener("pause", onPause, false);
    document.addEventListener("resume", onResume, false);
    document.addEventListener("menubutton", onMenuKeyDown, false);
    // إضافة مستمعات بشكل مشابه لبقية الأحداث
}
function onPause() {
    //  pause معالجة الحدث
}
function onResume() {
    // resume معالجة الحدث
}
function onMenuKeyDown() {
    // menubutton معالجة الحدث
}
// إضافة معالجات لأحداث أخرى

ملاحظة: عادةً، يجب أن تستخدم التطبيقات التابع document.addEventListener لإرفاق مُنصِت (listener) بحدثٍ ما بمجرد وقوع الحدث deviceready.

يسرد الجدول التالي أحداث كوردوفا والمنصات المدعومة:

المنصات المدعومة

/الأحداث

أندرويد iOS ويندوز
deviceready ✔️ ✔️ ✔️
pause ✔️ ✔️ ✔️
resume ✔️ ✔️ ✔️
backbutton ✔️ ✔️
menubutton ✔️
searchbutton ✔️
startcallbutton
endcallbutton
volumedownbutton ✔️
volumeupbutton ✔️
activated ✔️

deviceready

يُطلق الحدث deviceready عند تحميل كوردوفا بالكامل. هذا الحدث ضروري لأي تطبيق، إذ يُخطِر بأنّ واجهات كوردوفا البرمجية الخاصة بالجهاز قد تم تحميلها، وأنه بالإمكان الوصول إليها.

تتألف كوردوفا من شيفرتين أساسيتين: الشيفرة الأصيلة (native) وشيفرة JavaScript. أثناء تحميل الشيفرة الأصيلة، يتم عرض صورة تحميل مُخصصة. من جهة أخرى، لا تُحمّل JavaScript إلا بعد تحميل شجرة DOM. وهذا يعني أن تطبيق الويب قد يستدعي دوال JavaScript قبل أن تصبح الشيفرة الأصيلة المقابلة متاحة.

يُطلق الحدث deviceready بمجرد تحميل كوردوفا بالكامل. وعندها يمكنك إجراء الاستدعاءات بأمان من الواجهات البرمجية لكوردوفا.

عادةً ما تُرفق التطبيقات مُنصِتًا (listener) للحدث document.addEventListener بمجرد تحميل DOM الخاص بملف HTML.

يختلف سلوك الحدث deviceready عن الأحداث الأخرى. فأيُّ معالج أحداث (event handler) يتم تسجيله بعد إطلاق الحدث deviceready ستُسدعى دالة الرد (callback function) المرتبطة به على الفور. اطلع على المثال التالي:

document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
    // يمكنك الآن استخدام الواجهة البرمجية للجهاز بأمان
}

pause

يُطلق الحدث pause عندما ترسل المنصة الأصلية التطبيقَ إلى الخلفية، يحدث هذا عادةً عندما ينتقل المستخدم إلى تطبيق آخر.

document.addEventListener("pause", onPause, false);
function onPause() {
    // هنا pause عالج الحدث 
}

ملاحظات خاصة بالمنصة iOS

في مُعالج الحدث pause، لا تعمل أي استدعاءات للواجهة البرمجية لكوردوفا أو الإضافات المحلية التي تمر عبر لغة Objective-C، إلى جانب الاستدعاءات التفاعلية (interactive calls)، مثل التنبيهات أو الدالة console.log()‎، إذ لنْ تُعالَج إلا عند استئناف التطبيق عند التشغيل التالي.

الحدث resign المخصوص بنظام iOS هو بديل للحدث pause، إذ يرصد قيام المستخدمين بتمكين زر القفل Lock لأجل قفل الجهاز مع تشغيل التطبيق في المقدمة (foreground). إذا تم تمكين التطبيق (والجهاز) من استخدام المهام المتعددة (multi-tasking)، فسيُقرن هذا الحدث مع حدث pause لاحق؛ ولكن فقط على منصة iOS 5، تُدفع جميع التطبيقات متعددة المهام المقفلة في منصة iOS 5 إلى الخلفية.

لكي تبقى التطبيقات قيد التشغيل عند قفلها في منصة iOS 5، قم بتعطيل تعدد المهام في التطبيق عن طريق ضبط الخاصية UIApplicationExitsOnSuspend إلى القيمة YES. أمّا إن أردت تشغيله أثناء قفله على منصة iOS 4، فهذا الإعداد لا يهم.

resume

يُطلق الحدث resume عندما تسحب المنصة الأصلية التطبيق من الخلفية وتستأنف عمله.

document.addEventListener("resume", onResume, false);
function onResume() {
    // هنا resume عالج الحدث
}

ملاحظات خاصة بمنصة IOS

تُنفذ الدوال التفاعلية المُستدعاة من أحد معالجات الحدث pause في وقت لاحق عند استئناف التطبيق، والذي يُشار إليه من الحدث resume. ويشمل ذلك التنبيهات، والدالة console.log()‎، وكل الاستدعاءات القادمة من الإضافات أو الواجهة البرمجية لكوردوفا، والتي تمر عبر لغة Objective-C.

  • الحدث active: الحدث active المخصوص بنظام iOS هو بديل للحدث resume، حيث يرصد قيام المستخدمين بتعطيل الزر Lock لأجل فتح (unlock) الجهاز مع تشغيل التطبيق في المقدمة. إذا تم تمكين التطبيق (والجهاز) من استخدام المهام المتعددة، فسيُقرن هذا مع حدث resume لاحق؛ ولكن فقط في المنصة iOS 5، ستُدفع جميع التطبيقات متعددة المهام المقفولة (locked) في منصة iOS 5 إلى الخلفية. إن أردت أن تبقى التطبيقات قيد التشغيل عند قفلها في المنصة iOS 5، قم بتعطيل تعدد المهام في التطبيق عن طريق ضبط الخاصية UIApplicationExitsOnSuspend إلى القيمة YES. أما إن أردت تشغيل التطبيق أثناء القفل على منصة iOS 4، فهذا الإعداد لا يهم.
  • الحدث resume: عندما يُستدعى من أحد معالجات الحدث resume، فالدوال التفاعلية مثل alert()‎ يجب أن تُغلّف داخل استدعاءٍ للدالة setTimeout()‎، مع ضبط قيمة المهلة (timeout) إلى القيمة 0 وإلا فسيختنق التطبيق.

إليك المثال التالي:

document.addEventListener("resume", onResume, false);
function onResume() {
    setTimeout(function() {
            // ضع ما تريد أن يحدث هنا
        }, 0);
}

ملاحظات خاصة بمنصة أندرويد

ارجع إلى دليل دورة حياة تطبيق أندرويد لمزيد من التفاصيل حول بعض الملاحظات الخاصة بالحدث resume في أندرويد.

backbutton

يُطلق هذا الحدث عندما يضغط المستخدم على زر الرجوع.

لاستبدال السلوك الافتراضي لزر الرجوع، عليك تسجيل مُنصتٍ (listener) للحدث backbutton. فلم يعد ضروريًا استدعاء أي تابع آخر لتبديل سلوك الزر الخلفي الافتراضي.

document.addEventListener("backbutton", onBackKeyDown, false);
function onBackKeyDown() {
    // معالجة عملية الضغط على الزر الخلفي
}

ملاحظات خاصة بمنصة ويندوز

إن أردت العودة للسلوك الافتراضي (و الذي هو خروج التطبيق)، فأطلق خطأً في دالة رد النداء (callback) الخاصة بالحدث backbutton:

document.addEventListener('backbutton', function (evt) {
    if (cordova.platformId !== 'windows') {
        return;
    }
    if (window.location.href !== firstPageUrl) {
        window.history.back();
    } else {
        throw new Error('Exit'); // هذا سيوقف التطبيق
    }
}, false);

menubutton

يُطلق هذا الحدث عندما يضغط المستخدم على زر القائمة (menu button).

إنشاء معالجٍ أحداث (event handler) يستبدل السلوك الافتراضي لزر القائمة. إليك المثال التالي:

document.addEventListener("menubutton", onMenuKeyDown, false);
function onMenuKeyDown() {
    // معالجة عملية الضغط على زر العودة
}

searchbutton

يُطلق هذا الحدث عندما يضغط المستخدم على زر البحث في منصة أندرويد. إن كنت بحاجة إلى استبدال سلوك زر البحث الافتراضي على أندرويد، فيمكنك تسجيل مُنصِت للحدث searchbutton.

document.addEventListener("searchbutton", onSearchKeyDown, false);
function onSearchKeyDown() {
    // معالجة عمليةالضغط على زر البحث
}

startcallbutton

يُطلق هذا الحدث عند قيام المستخدم بالضغط على زر بدء المكالمة. إذا احتجت إلى استبدال السلوك الافتراضي لبدء المكالمة، فيمكنك تسجيل مُنصِتٍ للحدث startcallbutton.

document.addEventListener("startcallbutton", onStartCallKeyDown, false);
function onStartCallKeyDown() {
    // معالجة عملية الضغط على زر بدء مكالمة
}

endcallbutton

يُطلق هذا الحدث عندما يضغط المستخدم على زر إنهاء المكالمة. يستبدل هذا الحدث السلوك الافتراضي لعملية إنهاء المكالمة.

document.addEventListener("endcallbutton", onEndCallKeyDown, false);
function onEndCallKeyDown() {
    // معالجة عملية الضغط على زر إنهاء المكالمة
}

volumedownbutton

يُطلق هذا الحدث عند قيام المستخدم بالضغط على زر خفض الصوت. إذا احتجت إلى استبدال السلوك الافتراضي لخفض الصوت، فيمكنك تسجيل منصتٍ للحدث volumedownbutton.

document.addEventListener("volumedownbutton", onVolumeDownKeyDown, false);
function onVolumeDownKeyDown() {
    // معالجة عملية الضغط على رز خفض الصوت
}

volumeupbutton

يُطلق هذا الحدث عند قيام المستخدم بالضغط على زر رفع الصوت. إن كنت بحاجة إلى استبدال السلوك الافتراضي لرفع الصوت، فيمكنك تسجيل منصتٍ للحدث volumeupbutton.

document.addEventListener("volumeupbutton", onVolumeUpKeyDown, false);
function onVolumeUpKeyDown() {
    // معالجة عملية الضغط على زر رفع الصوت
}

activated

يُطلق هذا الحدث عند تنشيط Windows Runtime. انظر توثيق MSDN لمزيد من التفاصيل وأنواع التنشيط.

document.addEventListener("activated", activated, false);
function activated(args) {
    if (args && args.kind === Windows.ApplicationModel.Activation.ActivationKind.file) {
       // StorageFile للحصول على الكائن الأصلي args.raw استخدم
        Windows.Storage.FileIO.readTextAsync(args.raw.detail[0].files[0]).done(function (text) {
            console.log(text);
        }, function (err) {
            console.error(err);
        });
    }
}

ملاحظات خاصة بمنصة ويندوز

  • يمكنك الوصول إلى وسائط الحدث activated من الخاصية args.raw.detail[0]‎، إذ يمكنك استخدامها للحصول على مزيد من المعلومات حول الأنواع، أو لاستدعاء أحد توابع وسائط التنشيط.
  • تُنسخ أيضًا الوسائط الأصلية للحدث activated في args.detail[0]‎، إذ يمكن استخدامها احتياطًا في حالة فقدان إحدى خاصيات args الداخلية. انتقل إلى هذه الصفحة لمزيد من التفاصيل.
  • يمكن أن يُطلق الحدث activated قبل الحدث deviceready، لذا يجب عليك حفظ راية التنشيط (activation flag) وحفظ الوسائط args داخل سياق التطبيق في حال احتجت إليها (حالة الهدف المشترك [Share target]). ينبغي أن يحدث الاشتراك في الحدث activated قبل معالج الحدث deviceready (أو app.bindEvents بلغة قوالب كوردوفا).

انظر أيضًا

مصادر