الفرق بين المراجعتين ل"ReactNative/dynamiccolorios"
جميل-بيلوني (نقاش | مساهمات) ط |
|||
| (مراجعة متوسطة واحدة بواسطة نفس المستخدم غير معروضة) | |||
| سطر 1: | سطر 1: | ||
| − | + | <noinclude>{{DISPLAYTITLE:الدالة DynamicColorIOS في React Native}}</noinclude> | |
الدالة <code>DynamicColorIOS</code> هي نوع لون منصة خاص بنظام iOS.<syntaxhighlight lang="javascript"> | الدالة <code>DynamicColorIOS</code> هي نوع لون منصة خاص بنظام iOS.<syntaxhighlight lang="javascript"> | ||
DynamicColorIOS({ light: color, dark: color }); | DynamicColorIOS({ light: color, dark: color }); | ||
| − | </syntaxhighlight>تأخذ الدالة DynamicColorIOS وسيطًا واحدًا ككائن بمفتاحين هما: <code>dark</code> و <code>light</code>. يقابل هذان المفتاحان الألوانَ التي تريد استخدامها في "الوضع الفاتح" و "الوضع الداكن" على نظام iOS.<blockquote>قد يتوفر مستقبلًا مزيد من المفاتيح لتفضيلات المستخدم المختلفة كالتباين العالي.</blockquote>سيختار النظام في وقت التشغيل أيًا من اللونين لعرضه بناءً على إعدادات مظهر النظام الحالية. الألوان الديناميكية مفيدة للعلامات التجارية أو الألوان الأخرى الخاصة بالتطبيق والتي لا تزال تستجيب تلقائيًا لتغييرات إعدادات النظام. | + | </syntaxhighlight>تأخذ الدالة <code>DynamicColorIOS</code> وسيطًا واحدًا ككائن بمفتاحين هما: <code>dark</code> و <code>light</code>. يقابل هذان المفتاحان الألوانَ التي تريد استخدامها في "الوضع الفاتح" و "الوضع الداكن" على نظام iOS.<blockquote>'''ملاحظة''': قد يتوفر مستقبلًا مزيد من المفاتيح لتفضيلات المستخدم المختلفة كالتباين العالي.</blockquote>سيختار النظام في وقت التشغيل أيًا من اللونين لعرضه بناءً على إعدادات مظهر النظام الحالية. الألوان الديناميكية مفيدة للعلامات التجارية أو الألوان الأخرى الخاصة بالتطبيق والتي لا تزال تستجيب تلقائيًا لتغييرات إعدادات النظام.<blockquote>'''ملاحظات المطور''' |
| − | + | '''في iOS''': تشبه الدالة DynamicColorIOS توابع iOS الأصيلة <code>[https://developer.apple.com/documentation/uikit/uicolor/3238040-colorwithdynamicprovider UIColor colorWithDynamicProvider:]</code> | |
| − | |||
| − | + | '''في الويب''': إن كنت على دراية باستخدام <code>@media (prefers-color-scheme: dark)</code> في CSS، فهذه الدالة مشابهة لذلك، ولكن يمكنك تحديد اللون الذي يجب استخدامه في ظل ظروف مكان استخدامه مهما كانت بدلًا من تحديد كل الألوان في استعلام media.</blockquote>إليك المثال التالي:<syntaxhighlight lang="javascript"> | |
| − | |||
| − | '''في الويب''': | ||
| − | |||
| − | إن كنت على دراية باستخدام <code>@media (prefers-color-scheme: dark)</code> في CSS، فهذه الدالة مشابهة لذلك، ولكن يمكنك تحديد اللون الذي يجب استخدامه في ظل ظروف مكان استخدامه مهما كانت بدلًا من تحديد كل الألوان في استعلام media.</blockquote> | ||
| − | |||
| − | |||
| − | <syntaxhighlight lang="javascript"> | ||
import { DynamicColorIOS } from 'react-native'; | import { DynamicColorIOS } from 'react-native'; | ||
| سطر 26: | سطر 18: | ||
* [https://reactnative.dev/docs/dynamiccolorios صفحة DynamicColorIOS في توثيق React Native الرسمي.] | * [https://reactnative.dev/docs/dynamiccolorios صفحة DynamicColorIOS في توثيق React Native الرسمي.] | ||
| + | [[تصنيف:ReactNative]] | ||
| + | [[تصنيف:React Native API]] | ||
المراجعة الحالية بتاريخ 14:14، 9 أكتوبر 2021
الدالة DynamicColorIOS هي نوع لون منصة خاص بنظام iOS.
DynamicColorIOS({ light: color, dark: color });
تأخذ الدالة DynamicColorIOS وسيطًا واحدًا ككائن بمفتاحين هما: dark و light. يقابل هذان المفتاحان الألوانَ التي تريد استخدامها في "الوضع الفاتح" و "الوضع الداكن" على نظام iOS.
ملاحظة: قد يتوفر مستقبلًا مزيد من المفاتيح لتفضيلات المستخدم المختلفة كالتباين العالي.
سيختار النظام في وقت التشغيل أيًا من اللونين لعرضه بناءً على إعدادات مظهر النظام الحالية. الألوان الديناميكية مفيدة للعلامات التجارية أو الألوان الأخرى الخاصة بالتطبيق والتي لا تزال تستجيب تلقائيًا لتغييرات إعدادات النظام.
ملاحظات المطور
في iOS: تشبه الدالة DynamicColorIOS توابع iOS الأصيلة
UIColor colorWithDynamicProvider:في الويب: إن كنت على دراية باستخدام
@media (prefers-color-scheme: dark)في CSS، فهذه الدالة مشابهة لذلك، ولكن يمكنك تحديد اللون الذي يجب استخدامه في ظل ظروف مكان استخدامه مهما كانت بدلًا من تحديد كل الألوان في استعلام media.
إليك المثال التالي:
import { DynamicColorIOS } from 'react-native';
const customDynamicTextColor = DynamicColorIOS({
dark: 'lightskyblue',
light: 'midnightblue'
});