الفرق بين المراجعتين لصفحة: «ReactNative/slider»
أنشأ الصفحة ب'Slider' |
جميل-بيلوني (نقاش | مساهمات) طلا ملخص تعديل |
||
(9 مراجعات متوسطة بواسطة 3 مستخدمين غير معروضة) | |||
سطر 1: | سطر 1: | ||
Slider | <noinclude>{{DISPLAYTITLE:المكون Slider في ReactNative}}</noinclude> | ||
<blockquote>'''مهمل:''' اسخدم [https://reactnative.dev/docs/slider هذه الحزم من المجتمع] بدلًا منه. | |||
</blockquote> | |||
يُستخدم مكوّن شريط التمرير (Slider) لاختيار قيمةٍ من مجال قيم. | |||
__toc__ | |||
== الخاصيات == | |||
موروثة من خاصيات المكوّن <code>[[ReactNative/view|View]]</code>. | |||
=== <code>style</code> === | |||
تُستخدم لتنسيق وتخطيط المكون <code>Slider</code>. ويمكن الاطلاع على <code>StyleSheet.js</code> و<code>ViewStylePropTypes.js</code> لمزيدٍ من المعلومات. | |||
{| class="wikitable" | |||
! النوع | |||
! مطلوب | |||
|- | |||
| تنسيق ([[ReactNative/view style props|View.style]]) | |||
| لا | |||
|} | |||
=== <code>disabled</code> === | |||
لن يستطيع المستخدم تحريك شريط التّمرير عندما تكون قيمتها <code>true</code>، وقيمتها الافتراضيّة هي <code>false</code>. | |||
{| class="wikitable" | |||
! النوع | |||
! مطلوب | |||
|- | |||
| (bool) | |||
| لا | |||
|} | |||
=== <code>maximumValue</code> === | |||
تحدد أكبر قيمةٍ ابتدائيّةٍ لشريط التمرير، وقيمتها الافتراضية هي <code>1</code>. | |||
{| class="wikitable" | |||
! النوع | |||
! مطلوب | |||
|- | |||
| عدد (number) | |||
| لا | |||
|} | |||
=== <code>minimumTrackTintColor</code> === | |||
تحدد اللون المستخدم للمسار الموجود على يسار الزّرّ، وتتجاوز التدرج الأزرق الافتراضيّ على منصة iOS. | |||
{| class="wikitable" | |||
! النوع | |||
! مطلوب | |||
|- | |||
| لون (<code>[[ReactNative/colors|color]]</code>) | |||
| لا | |||
|} | |||
=== <code>minimumValue</code> === | |||
تحدد أصغر قيمةٍ ابتدائيّةٍ لشريط التمرير، وقيمتها الافتراضية هي <code>0</code>. | |||
{| class="wikitable" | |||
! النوع | |||
! مطلوب | |||
|- | |||
| عدد (number) | |||
| لا | |||
|} | |||
=== <code>onSlidingComplete</code> === | |||
تٌستدعى عندما يفلت المستخدم شريط التمرير حتى لو لم تتغير قيمته، وتمرَّر القيمة الحالية لشريط التمرير كمعاملٍ للمعالج. | |||
{| class="wikitable" | |||
! النوع | |||
! مطلوب | |||
|- | |||
| دالة (function) | |||
| لا | |||
|} | |||
=== <code>onValueChange</code> === | |||
تٌستدعى هذه الدالة باستمرار عند سحب المستخدم للشريط. | |||
{| class="wikitable" | |||
! النوع | |||
! مطلوب | |||
|- | |||
| دالة (function) | |||
| لا | |||
|} | |||
=== <code>step</code> === | |||
قيمة خطوة شريط التمرير، وتتراوح بين 0 و(maximumValue - minimumValue)، وقيمتها الافتراضيّة هي <code>0</code>. | |||
{| class="wikitable" | |||
! النوع | |||
! مطلوب | |||
|- | |||
| عدد (number) | |||
| لا | |||
|} | |||
=== <code>maximumTrackTintColor</code> === | |||
تحدد اللون المستخدم للمسار الموجود على يمين الزّرّ، وتتجاوز التدرج الرماديّ الافتراضيّ على منصة iOS. | |||
{| class="wikitable" | |||
! النوع | |||
! مطلوب | |||
|- | |||
| لون (<code>color</code>) | |||
| لا | |||
|} | |||
=== <code>testID</code> === | |||
تستخدم لوضع هذا العرض في اختبارات أتمتة واجهة المستخدم (UI automation tests). | |||
{| class="wikitable" | |||
! النوع | |||
! مطلوب | |||
|- | |||
| سلسلة نصية (string) | |||
| لا | |||
|} | |||
=== <code>value</code> === | |||
تحدد القيمة الابتدائية لشريط التمرير، وتتراوح بين minimumValue وmaximumValue -اللتان كانت قيمهما الافتراضيّة <code>0</code> و<code>1</code> على التوالي- وقيمتها الافتراضيّة هي <code>0</code>. | |||
'''ملاحظة:''' هذا المكون غير متحكّم به لذا لا حاجة لتحديث القيمة أثناء السحب. | |||
{| class="wikitable" | |||
! النوع | |||
! مطلوب | |||
|- | |||
| عدد (number) | |||
| لا | |||
|} | |||
=== <code>thumbTintColor</code> === | |||
اللون المستخدم لتلوين قبضة شريط التمرير -التي سيتحرك بواسطتها- على منصّة iOS، أو لون مفتاح التبديل الأمامي على منصّة Android. | |||
{| class="wikitable" | |||
! النوع | |||
! مطلوب | |||
|- | |||
| لون (<code>color</code>) | |||
| لا | |||
|} | |||
=== <code>maximumTrackImage</code> === | |||
تحدد أكبر صورة مسارٍ، وتدعم الصّور الثابتة فقط، حيث يتمدد البكسل في أقصى يسار الصورة ليملأ المسار. | |||
{| class="wikitable" | |||
! النوع | |||
! مطلوب | |||
! المنصة | |||
|- | |||
| مصدر الصورة (Image.propTypes.source) | |||
| لا | |||
| iOS | |||
|} | |||
=== <code>minimumTrackImage</code> === | |||
تحدد أصغر صورة مسارٍ، وتدعم الصور الثابتة فقط، حيث يتمدد البكسل في أقصى يمين الصورة ليملأ المسار. | |||
{| class="wikitable" | |||
! النوع | |||
! مطلوب | |||
! المنصة | |||
|- | |||
| مصدر الصورة (Image.propTypes.source) | |||
| لا | |||
| iOS | |||
|} | |||
=== <code>thumbImage</code> === | |||
تحدّد صورةً لقبضة شريط التّمرير، وتدعم الصّور الثّابتة فقط. | |||
{| class="wikitable" | |||
! النوع | |||
! مطلوب | |||
! المنصة | |||
|- | |||
| مصدر الصورة (Image.propTypes.source) | |||
| لا | |||
| iOS | |||
|} | |||
=== <code>trackImage</code> === | |||
تحدّد صورةً وحيدةً للمسار، وتدعم الصور الثابتة فقط، حيث تتمدد البكسلات في منتصف الصورة لتملأ المسار. | |||
{| class="wikitable" | |||
! النوع | |||
! مطلوب | |||
! المنصة | |||
|- | |||
| مصدر الصورة (Image.propTypes.source) | |||
| لا | |||
| iOS | |||
|} | |||
== مصادر == | |||
* [https://reactnative.dev/docs/slider صفحة Slider في توثيق React Native الرسميّ] | |||
[[تصنيف: ReactNative]] | |||
[[تصنيف:React Native Component]] |
المراجعة الحالية بتاريخ 14:45، 9 أكتوبر 2021
مهمل: اسخدم هذه الحزم من المجتمع بدلًا منه.
يُستخدم مكوّن شريط التمرير (Slider) لاختيار قيمةٍ من مجال قيم.
الخاصيات
موروثة من خاصيات المكوّن View
.
style
تُستخدم لتنسيق وتخطيط المكون Slider
. ويمكن الاطلاع على StyleSheet.js
وViewStylePropTypes.js
لمزيدٍ من المعلومات.
النوع | مطلوب |
---|---|
تنسيق (View.style) | لا |
disabled
لن يستطيع المستخدم تحريك شريط التّمرير عندما تكون قيمتها true
، وقيمتها الافتراضيّة هي false
.
النوع | مطلوب |
---|---|
(bool) | لا |
maximumValue
تحدد أكبر قيمةٍ ابتدائيّةٍ لشريط التمرير، وقيمتها الافتراضية هي 1
.
النوع | مطلوب |
---|---|
عدد (number) | لا |
minimumTrackTintColor
تحدد اللون المستخدم للمسار الموجود على يسار الزّرّ، وتتجاوز التدرج الأزرق الافتراضيّ على منصة iOS.
النوع | مطلوب |
---|---|
لون (color )
|
لا |
minimumValue
تحدد أصغر قيمةٍ ابتدائيّةٍ لشريط التمرير، وقيمتها الافتراضية هي 0
.
النوع | مطلوب |
---|---|
عدد (number) | لا |
onSlidingComplete
تٌستدعى عندما يفلت المستخدم شريط التمرير حتى لو لم تتغير قيمته، وتمرَّر القيمة الحالية لشريط التمرير كمعاملٍ للمعالج.
النوع | مطلوب |
---|---|
دالة (function) | لا |
onValueChange
تٌستدعى هذه الدالة باستمرار عند سحب المستخدم للشريط.
النوع | مطلوب |
---|---|
دالة (function) | لا |
step
قيمة خطوة شريط التمرير، وتتراوح بين 0 و(maximumValue - minimumValue)، وقيمتها الافتراضيّة هي 0
.
النوع | مطلوب |
---|---|
عدد (number) | لا |
maximumTrackTintColor
تحدد اللون المستخدم للمسار الموجود على يمين الزّرّ، وتتجاوز التدرج الرماديّ الافتراضيّ على منصة iOS.
النوع | مطلوب |
---|---|
لون (color )
|
لا |
testID
تستخدم لوضع هذا العرض في اختبارات أتمتة واجهة المستخدم (UI automation tests).
النوع | مطلوب |
---|---|
سلسلة نصية (string) | لا |
value
تحدد القيمة الابتدائية لشريط التمرير، وتتراوح بين minimumValue وmaximumValue -اللتان كانت قيمهما الافتراضيّة 0
و1
على التوالي- وقيمتها الافتراضيّة هي 0
.
ملاحظة: هذا المكون غير متحكّم به لذا لا حاجة لتحديث القيمة أثناء السحب.
النوع | مطلوب |
---|---|
عدد (number) | لا |
thumbTintColor
اللون المستخدم لتلوين قبضة شريط التمرير -التي سيتحرك بواسطتها- على منصّة iOS، أو لون مفتاح التبديل الأمامي على منصّة Android.
النوع | مطلوب |
---|---|
لون (color )
|
لا |
maximumTrackImage
تحدد أكبر صورة مسارٍ، وتدعم الصّور الثابتة فقط، حيث يتمدد البكسل في أقصى يسار الصورة ليملأ المسار.
النوع | مطلوب | المنصة |
---|---|---|
مصدر الصورة (Image.propTypes.source) | لا | iOS |
minimumTrackImage
تحدد أصغر صورة مسارٍ، وتدعم الصور الثابتة فقط، حيث يتمدد البكسل في أقصى يمين الصورة ليملأ المسار.
النوع | مطلوب | المنصة |
---|---|---|
مصدر الصورة (Image.propTypes.source) | لا | iOS |
thumbImage
تحدّد صورةً لقبضة شريط التّمرير، وتدعم الصّور الثّابتة فقط.
النوع | مطلوب | المنصة |
---|---|---|
مصدر الصورة (Image.propTypes.source) | لا | iOS |
trackImage
تحدّد صورةً وحيدةً للمسار، وتدعم الصور الثابتة فقط، حيث تتمدد البكسلات في منتصف الصورة لتملأ المسار.
النوع | مطلوب | المنصة |
---|---|---|
مصدر الصورة (Image.propTypes.source) | لا | iOS |