الفرق بين المراجعتين ل"Cordova/cordova plugin statusbar"

من موسوعة حسوب
اذهب إلى التنقل اذهب إلى البحث
(أنشأ الصفحة ب'<noinclude>{{DISPLAYTITLE:إضافة شريط الحالة في كوردوفا}}</noinclude> تصنيف: Cordova تصنيف: Plugin يوفر الكائن <...')
 
سطر 2: سطر 2:
 
[[تصنيف: Cordova]]
 
[[تصنيف: Cordova]]
 
[[تصنيف: Plugin]]
 
[[تصنيف: Plugin]]
 +
==شريط الحالة==
 
يوفر الكائن <code>StatusBar</code> بعض الدوال التي يمكن استخدامها لتخصيص شريطي الحالة في منصتي iOS و أندرويد.  
 
يوفر الكائن <code>StatusBar</code> بعض الدوال التي يمكن استخدامها لتخصيص شريطي الحالة في منصتي iOS و أندرويد.  
  
سطر 9: سطر 10:
  
 
تتطلب هذه الطريقة في التثبيت هذه الإصدار 5.0 من كوروفا وما فوقه:  
 
تتطلب هذه الطريقة في التثبيت هذه الإصدار 5.0 من كوروفا وما فوقه:  
−
<syntaxhighlight lang="xml">cordova plugin add cordova-plugin-statusbar‎</syntaxhighlight>  
+
<syntaxhighlight lang="javascript">cordova plugin add cordova-plugin-statusbar‎</syntaxhighlight>  
  
 
لا يزال بالإمكان تثبيت هذه الإضافة على الإصدارات القديمة من كوردوفا عبر المُعرِّف <code>deprecated</code>  
 
لا يزال بالإمكان تثبيت هذه الإضافة على الإصدارات القديمة من كوردوفا عبر المُعرِّف <code>deprecated</code>  
−
<syntaxhighlight lang="xml">cordova plugin add org.apache.cordova.statusbar‎</syntaxhighlight>  
+
<syntaxhighlight lang="javascript">cordova plugin add org.apache.cordova.statusbar‎</syntaxhighlight>  
  
 
من الممكن أيضًا تثبيت هذه الإضافة عبر مستودع git مباشرة (إلا أنه غير مستقر)  
 
من الممكن أيضًا تثبيت هذه الإضافة عبر مستودع git مباشرة (إلا أنه غير مستقر)  
−
<syntaxhighlight lang="xml">cordova plugin add https://github.com/apache/cordova-plugin-statusbar.git‎</syntaxhighlight>  
+
<syntaxhighlight lang="javascript">cordova plugin add https://github.com/apache/cordova-plugin-statusbar.git‎</syntaxhighlight>  
  
 
=== تفضيلات ===  
 
=== تفضيلات ===  
 
=== الملف Config.xml ====  
 
=== الملف Config.xml ====  
 
* <code>StatusBarOverlaysWebView</code> (قيمة منطقية، القيمة الافتراضية هي true). على منصة iOS 7، هذا الخيار يجعل شريط الحالة يركب (overlay) على [[Cordova/webviews|العارض]] أولا يركب عند بدء التشغيل.  
 
* <code>StatusBarOverlaysWebView</code> (قيمة منطقية، القيمة الافتراضية هي true). على منصة iOS 7، هذا الخيار يجعل شريط الحالة يركب (overlay) على [[Cordova/webviews|العارض]] أولا يركب عند بدء التشغيل.  
−
<syntaxhighlight lang="xml"><preference name="StatusBarOverlaysWebView" value="true" />‎</syntaxhighlight>  
+
<syntaxhighlight lang="javascript"><preference name="StatusBarOverlaysWebView" value="true" />‎</syntaxhighlight>  
 
* <code>StatusBarBackgroundColor</code> (سلسلة نصية تمثل لونًا سداسعشريًا [color hex]، بدون قيمة افتراضية). على منصة iOS 7، يضبط هذا الخيار لون خلفية شريط الحالة باللون المُتضمّن في السلسلة النصية السداسعشرية (‎#RRGGBB) عند بدء التشغيل. إذا لم يتم تعيين هذه القيمة، فسيكون لون الخلفية شفافًا.  
 
* <code>StatusBarBackgroundColor</code> (سلسلة نصية تمثل لونًا سداسعشريًا [color hex]، بدون قيمة افتراضية). على منصة iOS 7، يضبط هذا الخيار لون خلفية شريط الحالة باللون المُتضمّن في السلسلة النصية السداسعشرية (‎#RRGGBB) عند بدء التشغيل. إذا لم يتم تعيين هذه القيمة، فسيكون لون الخلفية شفافًا.  
−
<syntaxhighlight lang="xml"><preference name="StatusBarBackgroundColor" value="#000000" />‎</syntaxhighlight>  
+
<syntaxhighlight lang="javascript"><preference name="StatusBarBackgroundColor" value="#000000" />‎</syntaxhighlight>  
 
* <code>StatusBarStyle</code> (نمط شريط الحالة، االقيمة الافتراضية هي lightcontent). على منصة iOS 7، يعيّن هذا الخيار نمط شريط الحالة. الخيارات الافتراضية المتاحة، lightcontent و blacktranslucent و blackopaque.  
 
* <code>StatusBarStyle</code> (نمط شريط الحالة، االقيمة الافتراضية هي lightcontent). على منصة iOS 7، يعيّن هذا الخيار نمط شريط الحالة. الخيارات الافتراضية المتاحة، lightcontent و blacktranslucent و blackopaque.  
−
<syntaxhighlight lang="xml"><preference name="StatusBarStyle" value="lightcontent" />‎</syntaxhighlight>  
+
<syntaxhighlight lang="javascript"><preference name="StatusBarStyle" value="lightcontent" />‎</syntaxhighlight>  
 
* <code>StatusBarDefaultScrollToTop</code> (قيمة منطقية، القيمة الافتراضية تساوي false). في نظام التشغيل iOS 7، يتيح هذا الخيار ل[[Cordova/webviews|عارض]] لكوروفا استخدام سلوك التمرير إلى الأعلى (scroll-to-top) الافتراضي. القيمة الافتراضية هي false، حتى يمكنك الاستماع إلى الحدث "statusTap" (الموضح أدناه) وتخصيص السلوك بدلاً من ذلك.  
 
* <code>StatusBarDefaultScrollToTop</code> (قيمة منطقية، القيمة الافتراضية تساوي false). في نظام التشغيل iOS 7، يتيح هذا الخيار ل[[Cordova/webviews|عارض]] لكوروفا استخدام سلوك التمرير إلى الأعلى (scroll-to-top) الافتراضي. القيمة الافتراضية هي false، حتى يمكنك الاستماع إلى الحدث "statusTap" (الموضح أدناه) وتخصيص السلوك بدلاً من ذلك.  
−
<syntaxhighlight lang="xml"><preference name="StatusBarDefaultScrollToTop" value="false" />‎</syntaxhighlight>  
+
<syntaxhighlight lang="javascript"><preference name="StatusBarDefaultScrollToTop" value="false" />‎</syntaxhighlight>  
 
====ملاحظات خاصة بمنصة أندرويد ====  
 
====ملاحظات خاصة بمنصة أندرويد ====  
  
 
تحدد إرشادات أندرويد، الإصدار 5 وما بعده، أن يكون لون شريط الحالة مختلفًا عن لون التطبيق الرئيسي (بخلاف لون شريط الحالة الموحد في العديد من تطبيقات iOS 7+‎)، لذلك قد ترغب بدلاً من ذلك في تعيين لون شريط الحالة في وقت التشغيل عبر التابعين <code>StatusBar.backgroundColorByHexString</code> أو <code>StatusBar.backgroundColorByName</code>. فيما يلي إحدى الطرق الممكنة للقيام بذلك:  
 
تحدد إرشادات أندرويد، الإصدار 5 وما بعده، أن يكون لون شريط الحالة مختلفًا عن لون التطبيق الرئيسي (بخلاف لون شريط الحالة الموحد في العديد من تطبيقات iOS 7+‎)، لذلك قد ترغب بدلاً من ذلك في تعيين لون شريط الحالة في وقت التشغيل عبر التابعين <code>StatusBar.backgroundColorByHexString</code> أو <code>StatusBar.backgroundColorByName</code>. فيما يلي إحدى الطرق الممكنة للقيام بذلك:  
−
<syntaxhighlight lang="xml">if (cordova.platformId == 'android') {
+
<syntaxhighlight lang="javascript">if (cordova.platformId == 'android') {
 
     StatusBar.backgroundColorByHexString("#333");
 
     StatusBar.backgroundColorByHexString("#333");
 
}‎</syntaxhighlight>  
 
}‎</syntaxhighlight>  
سطر 39: سطر 40:
  
 
إضافة أو عدل هاتين الخاصيتين إذا لم تكونا موجودتين. عيّن <code>"Status bar is initially hidden"</code> إلى القيمة <code>"YES"</code> وعّين <code>"View controller-based status bar appearance"</code> إلى القيمة <code>"NO"</code>. إذا عدّلتها يدويًا من دون استخدام بيئة العمل Xcode، فستكون المفاتيح والقيم كما يلي:  
 
إضافة أو عدل هاتين الخاصيتين إذا لم تكونا موجودتين. عيّن <code>"Status bar is initially hidden"</code> إلى القيمة <code>"YES"</code> وعّين <code>"View controller-based status bar appearance"</code> إلى القيمة <code>"NO"</code>. إذا عدّلتها يدويًا من دون استخدام بيئة العمل Xcode، فستكون المفاتيح والقيم كما يلي:  
−
<syntaxhighlight lang="xml"><key>UIStatusBarHidden</key>
+
<syntaxhighlight lang="javascript"><key>UIStatusBarHidden</key>
 
<true/>
 
<true/>
 
<key>UIViewControllerBasedStatusBarAppearance</key>
 
<key>UIViewControllerBasedStatusBarAppearance</key>
سطر 49: سطر 50:
  
 
على الرغم من أن هذا الكائن موجود في النطاق العام (global scope)، إلا أنه لن يكون متوفرًا إلا بعد إطلاق الحدث <code>deviceready</code>.  
 
على الرغم من أن هذا الكائن موجود في النطاق العام (global scope)، إلا أنه لن يكون متوفرًا إلا بعد إطلاق الحدث <code>deviceready</code>.  
−
<syntaxhighlight lang="xml">document.addEventListener("deviceready", onDeviceReady, false);
+
<syntaxhighlight lang="javascript">document.addEventListener("deviceready", onDeviceReady, false);
 
function onDeviceReady() {
 
function onDeviceReady() {
 
     console.log(StatusBar);
 
     console.log(StatusBar);
سطر 72: سطر 73:
  
 
على منصة iOS 7، يجعل هذا التابعُ شريط الحالة يركب (overlay) على [[Cordova/webviews|العارض]]، أو العكس.  
 
على منصة iOS 7، يجعل هذا التابعُ شريط الحالة يركب (overlay) على [[Cordova/webviews|العارض]]، أو العكس.  
−
<syntaxhighlight lang="xml">StatusBar.overlaysWebView(true);‎</syntaxhighlight>  
+
<syntaxhighlight lang="javascript">StatusBar.overlaysWebView(true);‎</syntaxhighlight>  
  
 
===الوصف===  
 
===الوصف===  
سطر 82: سطر 83:
  
 
=== مثال سريع ===  
 
=== مثال سريع ===  
−
<syntaxhighlight lang="xml">StatusBar.overlaysWebView(true);
+
<syntaxhighlight lang="javascript">StatusBar.overlaysWebView(true);
 
StatusBar.overlaysWebView(false);‎</syntaxhighlight>  
 
StatusBar.overlaysWebView(false);‎</syntaxhighlight>  
  
سطر 88: سطر 89:
  
 
استخدم شريط الحالة الافتراضي (النص غامق على خلفية فاتحة).  
 
استخدم شريط الحالة الافتراضي (النص غامق على خلفية فاتحة).  
−
<syntaxhighlight lang="xml">StatusBar.styleDefault();‎</syntaxhighlight>  
+
<syntaxhighlight lang="javascript">StatusBar.styleDefault();‎</syntaxhighlight>  
  
 
=== المنصات المدعومة ===  
 
=== المنصات المدعومة ===  
سطر 100: سطر 101:
  
 
لأجل استخدام شريط الحالة ذو المحتوى المُشعّ lightContent (نص مُشِع على خلفية داكنة).  
 
لأجل استخدام شريط الحالة ذو المحتوى المُشعّ lightContent (نص مُشِع على خلفية داكنة).  
−
<syntaxhighlight lang="xml">StatusBar.styleLightContent();‎</syntaxhighlight>  
+
<syntaxhighlight lang="javascript">StatusBar.styleLightContent();‎</syntaxhighlight>  
  
 
=== المنصات المدعومة ===  
 
=== المنصات المدعومة ===  
سطر 112: سطر 113:
  
 
لاستخدام شريط الحالة من النوع blackTranslucent (نص فاتح، على خلفية داكنة).  
 
لاستخدام شريط الحالة من النوع blackTranslucent (نص فاتح، على خلفية داكنة).  
−
<syntaxhighlight lang="xml">StatusBar.styleBlackTranslucent();‎</syntaxhighlight>  
+
<syntaxhighlight lang="javascript">StatusBar.styleBlackTranslucent();‎</syntaxhighlight>  
  
 
=== المنصات المدعومة ===  
 
=== المنصات المدعومة ===  
سطر 124: سطر 125:
  
 
لاستخدام شريط الحالة من النوع blackOpaque (نص مشعّ على خلفيات داكنة).  
 
لاستخدام شريط الحالة من النوع blackOpaque (نص مشعّ على خلفيات داكنة).  
−
<syntaxhighlight lang="xml">StatusBar.styleBlackOpaque();‎</syntaxhighlight>  
+
<syntaxhighlight lang="javascript">StatusBar.styleBlackOpaque();‎</syntaxhighlight>  
  
 
=== المنصات المدعومة ===  
 
=== المنصات المدعومة ===  
سطر 136: سطر 137:
  
 
على منصة iOS 7، عند تعيين StatusBar.statusBarOverlaysWebView إلى القيمة false، يمكنك تعيين لون خلفية شريط الحالة حسب اسم اللون.  
 
على منصة iOS 7، عند تعيين StatusBar.statusBarOverlaysWebView إلى القيمة false، يمكنك تعيين لون خلفية شريط الحالة حسب اسم اللون.  
−
<syntaxhighlight lang="xml">StatusBar.backgroundColorByName("red");‎</syntaxhighlight>  
+
<syntaxhighlight lang="javascript">StatusBar.backgroundColorByName("red");‎</syntaxhighlight>  
  
 
أسماء الألوان المدعومة هي:  
 
أسماء الألوان المدعومة هي:  
−
<syntaxhighlight lang="xml">black, darkGray, lightGray, white, gray, red, green, blue, cyan, yellow, magenta, orange, purple, brown‎</syntaxhighlight>  
+
<syntaxhighlight lang="javascript">black, darkGray, lightGray, white, gray, red, green, blue, cyan, yellow, magenta, orange, purple, brown‎</syntaxhighlight>  
  
 
=== المنصات المدعومة ===  
 
=== المنصات المدعومة ===  
سطر 151: سطر 152:
  
 
يعيّن هذا التابع لون خلفية شريط الحالة عبر إعطائه سلسلة نصية تحتوي لونًا سداسعشريًا (hex).  
 
يعيّن هذا التابع لون خلفية شريط الحالة عبر إعطائه سلسلة نصية تحتوي لونًا سداسعشريًا (hex).  
−
<syntaxhighlight lang="xml">StatusBar.backgroundColorByHexString("#C0C0C0");‎</syntaxhighlight>  
+
<syntaxhighlight lang="javascript">StatusBar.backgroundColorByHexString("#C0C0C0");‎</syntaxhighlight>  
  
 
اختصارات ألوان CSS مدعومةٌ أيضًا.  
 
اختصارات ألوان CSS مدعومةٌ أيضًا.  
−
<syntaxhighlight lang="xml">StatusBar.backgroundColorByHexString("#333"); // => #333333
+
<syntaxhighlight lang="javascript">StatusBar.backgroundColorByHexString("#333"); // => #333333
 
StatusBar.backgroundColorByHexString("#FAB"); // => #FFAABB‎</syntaxhighlight>  
 
StatusBar.backgroundColorByHexString("#FAB"); // => #FFAABB‎</syntaxhighlight>  
  
سطر 171: سطر 172:
  
 
يخفي هذا التابع شريط الحالة.  
 
يخفي هذا التابع شريط الحالة.  
−
<syntaxhighlight lang="xml">StatusBar.hide();‎</syntaxhighlight>  
+
<syntaxhighlight lang="javascript">StatusBar.hide();‎</syntaxhighlight>  
  
 
=== المنصات المدعومة ===  
 
=== المنصات المدعومة ===  
سطر 183: سطر 184:
  
 
يعرض هذا التابع شريط الحالة.  
 
يعرض هذا التابع شريط الحالة.  
−
<syntaxhighlight lang="xml">StatusBar.show();‎</syntaxhighlight>  
+
<syntaxhighlight lang="javascript">StatusBar.show();‎</syntaxhighlight>  
  
 
=== المنصات المدعومة ===  
 
=== المنصات المدعومة ===  
سطر 195: سطر 196:
  
 
تحقق من هذه الخاصية لمعرفة ما إذا كان شريط الحالة مرئيًا أم لا.  
 
تحقق من هذه الخاصية لمعرفة ما إذا كان شريط الحالة مرئيًا أم لا.  
−
<syntaxhighlight lang="xml">if (StatusBar.isVisible) {
+
<syntaxhighlight lang="javascript">if (StatusBar.isVisible) {
 
     // do something
 
     // do something
 
}‎</syntaxhighlight>  
 
}‎</syntaxhighlight>  
سطر 209: سطر 210:
  
 
أنصِت لهذا الحدث لمعرفة ما إذا تم النقر على شريط الحالة.  
 
أنصِت لهذا الحدث لمعرفة ما إذا تم النقر على شريط الحالة.  
−
<syntaxhighlight lang="xml">window.addEventListener('statusTap', function() {
+
<syntaxhighlight lang="javascript">window.addEventListener('statusTap', function() {
 
     // scroll-up with document.body.scrollTop = 0; or do whatever you want
 
     // scroll-up with document.body.scrollTop = 0; or do whatever you want
 
});‎</syntaxhighlight>  
 
});‎</syntaxhighlight>  

مراجعة 15:41، 23 ديسمبر 2018



شريط الحالة

يوفر الكائن StatusBar بعض الدوال التي يمكن استخدامها لتخصيص شريطي الحالة في منصتي iOS و أندرويد.

تحذير: تقرير عن القضايا على Apache Cordova issue tracker

التثبيت

تتطلب هذه الطريقة في التثبيت هذه الإصدار 5.0 من كوروفا وما فوقه: 

cordova plugin add cordova-plugin-statusbar‎

لا يزال بالإمكان تثبيت هذه الإضافة على الإصدارات القديمة من كوردوفا عبر المُعرِّف deprecated 

cordova plugin add org.apache.cordova.statusbar‎

من الممكن أيضًا تثبيت هذه الإضافة عبر مستودع git مباشرة (إلا أنه غير مستقر) 

cordova plugin add https://github.com/apache/cordova-plugin-statusbar.git‎

تفضيلات

الملف Config.xml =

  • StatusBarOverlaysWebView (قيمة منطقية، القيمة الافتراضية هي true). على منصة iOS 7، هذا الخيار يجعل شريط الحالة يركب (overlay) على العارض أولا يركب عند بدء التشغيل.
<preference name="StatusBarOverlaysWebView" value="true" />‎
  • StatusBarBackgroundColor (سلسلة نصية تمثل لونًا سداسعشريًا [color hex]، بدون قيمة افتراضية). على منصة iOS 7، يضبط هذا الخيار لون خلفية شريط الحالة باللون المُتضمّن في السلسلة النصية السداسعشرية (‎#RRGGBB) عند بدء التشغيل. إذا لم يتم تعيين هذه القيمة، فسيكون لون الخلفية شفافًا.
<preference name="StatusBarBackgroundColor" value="#000000" />‎
  • StatusBarStyle (نمط شريط الحالة، االقيمة الافتراضية هي lightcontent). على منصة iOS 7، يعيّن هذا الخيار نمط شريط الحالة. الخيارات الافتراضية المتاحة، lightcontent و blacktranslucent و blackopaque.
<preference name="StatusBarStyle" value="lightcontent" />‎
  • StatusBarDefaultScrollToTop (قيمة منطقية، القيمة الافتراضية تساوي false). في نظام التشغيل iOS 7، يتيح هذا الخيار لعارض لكوروفا استخدام سلوك التمرير إلى الأعلى (scroll-to-top) الافتراضي. القيمة الافتراضية هي false، حتى يمكنك الاستماع إلى الحدث "statusTap" (الموضح أدناه) وتخصيص السلوك بدلاً من ذلك.
<preference name="StatusBarDefaultScrollToTop" value="false" />‎

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

تحدد إرشادات أندرويد، الإصدار 5 وما بعده، أن يكون لون شريط الحالة مختلفًا عن لون التطبيق الرئيسي (بخلاف لون شريط الحالة الموحد في العديد من تطبيقات iOS 7+‎)، لذلك قد ترغب بدلاً من ذلك في تعيين لون شريط الحالة في وقت التشغيل عبر التابعين StatusBar.backgroundColorByHexString أو StatusBar.backgroundColorByName. فيما يلي إحدى الطرق الممكنة للقيام بذلك: 

if (cordova.platformId == 'android') {
    StatusBar.backgroundColorByHexString("#333");
}‎

إخفاء شريط الحالة عند بدء التشغيل

خلال وقت التشغيل، يمكنك استخدام الدالة StatusBar.hide أدناه، ولكن إذا كنت تريد إخفاء شريط الحالة عند بدء تشغيل التطبيق، فعليك تعديل الملف Info.plist الخاص بتطبيقك.

إضافة أو عدل هاتين الخاصيتين إذا لم تكونا موجودتين. عيّن "Status bar is initially hidden" إلى القيمة "YES" وعّين "View controller-based status bar appearance" إلى القيمة "NO". إذا عدّلتها يدويًا من دون استخدام بيئة العمل Xcode، فستكون المفاتيح والقيم كما يلي: 

<key>UIStatusBarHidden</key>
<true/>
<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>‎

التوابع

تعرّف هذه الإضافة كائنًا عامًّا StatusBar.

على الرغم من أن هذا الكائن موجود في النطاق العام (global scope)، إلا أنه لن يكون متوفرًا إلا بعد إطلاق الحدث deviceready. 

document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
    console.log(StatusBar);
}‎
  • StatusBar.overlaysWebView
  • StatusBar.styleDefault
  • StatusBar.styleLightContent
  • StatusBar.styleBlackTranslucent
  • StatusBar.styleBlackOpaque
  • StatusBar.backgroundColorByName
  • StatusBar.backgroundColorByHexString
  • StatusBar.hide
  • StatusBar.show

خاصيات

  • StatusBar.isVisible

الأحداث

  • statusTap

StatusBar.overlaysWebView

على منصة iOS 7، يجعل هذا التابعُ شريط الحالة يركب (overlay) على العارض، أو العكس. 

StatusBar.overlaysWebView(true);‎

الوصف

على منصة iOS 7، اضبط هذا الخيار عند القيمة false لإظهار شريط الحالة مثل ما هو الحال في منصة iOS 6. قم بتعيين نمط ولون الخلفية بالشكل الذي تراه مناسبًا استخدام الدوال الأخرى.

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

  • iOS

مثال سريع

StatusBar.overlaysWebView(true);
StatusBar.overlaysWebView(false);‎

StatusBar.styleDefault

استخدم شريط الحالة الافتراضي (النص غامق على خلفية فاتحة). 

StatusBar.styleDefault();‎

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

  • iOS
  • أندرويد 6 وما بعده
  • Windows Phone 7
  • Windows Phone 8
  • Windows Phone 8.1

StatusBar.styleLightContent

لأجل استخدام شريط الحالة ذو المحتوى المُشعّ lightContent (نص مُشِع على خلفية داكنة). 

StatusBar.styleLightContent();‎

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

  • iOS
  • Android 6+
  • Windows Phone 7
  • Windows Phone 8
  • Windows Phone 8.1

StatusBar.styleBlackTranslucent

لاستخدام شريط الحالة من النوع blackTranslucent (نص فاتح، على خلفية داكنة). 

StatusBar.styleBlackTranslucent();‎

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

  • iOS
  • Android 6+
  • Windows Phone 7
  • Windows Phone 8
  • Windows Phone 8.1

StatusBar.styleBlackOpaque

لاستخدام شريط الحالة من النوع blackOpaque (نص مشعّ على خلفيات داكنة). 

StatusBar.styleBlackOpaque();‎

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

  • iOS
  • Android 6+
  • Windows Phone 7
  • Windows Phone 8
  • Windows Phone 8.1

StatusBar.backgroundColorByName

على منصة iOS 7، عند تعيين StatusBar.statusBarOverlaysWebView إلى القيمة false، يمكنك تعيين لون خلفية شريط الحالة حسب اسم اللون. 

StatusBar.backgroundColorByName("red");‎

أسماء الألوان المدعومة هي: 

black, darkGray, lightGray, white, gray, red, green, blue, cyan, yellow, magenta, orange, purple, brown‎

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

  • iOS
  • أندرويد الإصدار 5 وما بعده
  • Windows Phone 7
  • Windows Phone 8
  • Windows Phone 8.1

StatusBar.backgroundColorByHexString

يعيّن هذا التابع لون خلفية شريط الحالة عبر إعطائه سلسلة نصية تحتوي لونًا سداسعشريًا (hex). 

StatusBar.backgroundColorByHexString("#C0C0C0");‎

اختصارات ألوان CSS مدعومةٌ أيضًا. 

StatusBar.backgroundColorByHexString("#333"); // => #333333
StatusBar.backgroundColorByHexString("#FAB"); // => #FFAABB‎

على منصة iOS 7، عند تعيين StatusBar.statusBarOverlaysWebView إلى القيمة false، فيمكنك تعيين لون خلفية شريط الحالة عبر سلسلة نصية سداسعشرية (‎#RRGGBB).

على منصتي WP7 و WP8، يمكنك أيضًا تحديد قيم من قبيل ‎#AARRGGBB، حيث تمثل AA قيمة الشفافية ألفا (alpha value)

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

  • iOS
  • Android 5+
  • Windows Phone 7
  • Windows Phone 8
  • Windows Phone 8.1

StatusBar.hide

يخفي هذا التابع شريط الحالة. 

StatusBar.hide();‎

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

  • iOS
  • أندرويد
  • Windows Phone 7
  • Windows Phone 8
  • Windows Phone 8.1

StatusBar.show

يعرض هذا التابع شريط الحالة. 

StatusBar.show();‎

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

  • iOS
  • أندرويد
  • Windows Phone 7
  • Windows Phone 8
  • Windows Phone 8.1

StatusBar.isVisible

تحقق من هذه الخاصية لمعرفة ما إذا كان شريط الحالة مرئيًا أم لا. 

if (StatusBar.isVisible) {
    // do something
}‎

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

  • iOS
  • أندرويد
  • Windows Phone 7
  • Windows Phone 8
  • ويندوز فون 8.1

statusTap

أنصِت لهذا الحدث لمعرفة ما إذا تم النقر على شريط الحالة. 

window.addEventListener('statusTap', function() {
    // scroll-up with document.body.scrollTop = 0; or do whatever you want
});‎

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

  • iOS

مصادر

مجلوبة من "https://wiki.hsoub.com/index.php?title=Cordova/cordova_plugin_statusbar&oldid=26660"