الفرق بين المراجعتين لصفحة: «ReactNative/appregistry»
رقية-بورية (نقاش | مساهمات) ط مراجعة |
رقية-بورية (نقاش | مساهمات) ط مراجعة |
||
سطر 1: | سطر 1: | ||
<noinclude>{{DISPLAYTITLE:المكون AppRegistry في ReactNative}}</noinclude> | <noinclude>{{DISPLAYTITLE:المكون AppRegistry في ReactNative}}</noinclude> | ||
'''ملاحظة''': إذا كنت تستخدم <code>expo-cli</code> فلا يوجد سوى | '''ملاحظة''': إذا كنت تستخدم <code>expo-cli</code> فلا يوجد سوى مكوّن إدخال واحد مسجل مسبقًا في <code>AppRegistry</code> ويُتعامل معه تلقائيًا، لذلك فلا حاجة لاستخدام واجهة برمجة التطبيقات (API) هذه. | ||
يُمثل <code>AppRegistry</code> نقطة دخول جافا سكريبت لتشغيل جميع تطبيقات React Native. ويجب تسجيل جميع مكونات التطبيق الجذرية مع <code>AppRegistry.registerComponent</code>، ومن ثم يتمكن النظام الأصلي من تحميل التطبيق وتشغيله عن طريق استدعاء الدالة <code>AppRegistry.runApplication</code>.<syntaxhighlight class="react" lang="javascript">import { Text, AppRegistry } from 'react-native'; | يُمثل <code>AppRegistry</code> نقطة دخول [[JavaScript|جافا سكريبت]] لتشغيل جميع تطبيقات [[ReactNative|React Native]]. ويجب تسجيل جميع مكونات التطبيق الجذرية مع <code>AppRegistry.registerComponent</code>، ومن ثم يتمكن النظام الأصلي من تحميل التطبيق وتشغيله عن طريق استدعاء الدالة <code>AppRegistry.runApplication</code>.<syntaxhighlight class="react" lang="javascript">import { Text, AppRegistry } from 'react-native'; | ||
const App = (props) => ( | const App = (props) => ( | ||
سطر 12: | سطر 12: | ||
AppRegistry.registerComponent('Appname', () => App);</syntaxhighlight> | AppRegistry.registerComponent('Appname', () => App);</syntaxhighlight> | ||
لإيقاف التطبيق عند ازالة واجهة | لإيقاف التطبيق عند ازالة واجهة معيّنة (<code>[[ReactNative/view|View]]</code>)، استدعي الدالة <code>AppRegistry.unmountApplicationComponenetAtRootTag</code> على الوسم الذي مُرّرت سابقًا للدالة <code>runApplication</code>. | ||
يجب أن يكون <code>AppRegistry</code> مطلوبًا في بداية سلسلة المطلوبات للتأكد من إعداد بيئة التنفيذ | يجب أن يكون <code>AppRegistry</code> مطلوبًا في بداية سلسلة المطلوبات للتأكد من إعداد بيئة التنفيذ الصحيح قبل أن تكون هناك حاجة لوحدات أخرى. | ||
__toc__ | __toc__ | ||
سطر 31: | سطر 31: | ||
|- | |- | ||
| <code>provider</code> | | <code>provider</code> | ||
| ComponentProvider | | [[ReactNative/components and apis|<code>ComponentProvider</code>]] | ||
| نعم | | نعم | ||
|} | |} | ||
سطر 101: | سطر 101: | ||
|- | |- | ||
| <code>componenetProvider</code> | | <code>componenetProvider</code> | ||
| ComponentProvider | | <code>[[ReactNative/components and apis|ComponentProvider]]</code> | ||
| نعم | | نعم | ||
|- | |- | ||
سطر 142: | سطر 142: | ||
|- | |- | ||
| <code>component</code> | | <code>component</code> | ||
| ComponentProvider | | <code>[[ReactNative/components and apis|ComponentProvider]]</code> | ||
| نعم | | نعم | ||
|} | |} | ||
سطر 156: | سطر 156: | ||
<syntaxhighlight class="react" lang="javascript">static getSections()</syntaxhighlight> | <syntaxhighlight class="react" lang="javascript">static getSections()</syntaxhighlight> | ||
تُرجع جميع كائنات <code>Runnables</code>، وهي كائنات يحتوي | تُرجع جميع كائنات <code>Runnables</code>، وهي كائنات يحتوي كلّ واحد منها على مفتاح (AppKey) وقيمة من نوع <code>Runnable</code> والتي تتكون من: | ||
* | * مكوّن (<code>ComponentProvider</code>). | ||
* دالة تشغيل (<code>run</code>). | * دالة تشغيل (<code>run</code>). | ||
سطر 194: | سطر 194: | ||
يحتوي الخطاف (hook) على المكونات التالية: | يحتوي الخطاف (hook) على المكونات التالية: | ||
* <code>component</code> من النوع ComponentProvider (مطلوب). | * <code>component</code> من النوع <code>ComponentProvider</code> (مطلوب). | ||
* <code>ScopedPerformanceLogger</code>من النوع IPerformanceLogger (مطلوب). | * <code>ScopedPerformanceLogger</code>من النوع <code>IPerformanceLogger</code> (مطلوب). | ||
تُرجع الدالة <code>hook</code> مكوِّن React. | تُرجع الدالة <code>hook</code> مكوِّن <code>[[React]]</code>. | ||
=== <code>runApplication</code> === | === <code>runApplication</code> === | ||
سطر 221: | سطر 221: | ||
<syntaxhighlight class="react" lang="javascript">static unmountApplicationComponentAtRootTag(rootTag)</syntaxhighlight> | <syntaxhighlight class="react" lang="javascript">static unmountApplicationComponentAtRootTag(rootTag)</syntaxhighlight> | ||
توقِف التطبيق عندما يُزال | توقِف التطبيق عندما يُزال مكوّن معيّن. | ||
'''المعاملات''' | '''المعاملات''' | ||
سطر 240: | سطر 240: | ||
<code>HeadlessTask</code> هي شيفرة يتم تنفيذها بدون واجهة مستخدم. المعامل <code>taskProvider</code> يُرجع دالة تأخذ بيانات من الشيفرة الأصلية. وبعد تنفيذ الدالة يُرسل إشعار للشيفرة الأصلية وقد يُدمر سياق جافا سكريبت الحالي (JS context). | <code>HeadlessTask</code> هي شيفرة يتم تنفيذها بدون واجهة مستخدم. المعامل <code>taskProvider</code> يُرجع دالة تأخذ بيانات من الشيفرة الأصلية. وبعد تنفيذ الدالة يُرسل إشعار للشيفرة الأصلية وقد يُدمر سياق جافا سكريبت الحالي (JS context). | ||
تُستعمل هذه الدالة لتشغيل بعض المهام في التطبيق أثناء عمله في | تُستعمل هذه الدالة لتشغيل بعض المهام في التطبيق أثناء عمله في الخلفية، لمزامنة البيانات أو التعامل مع الإشعارات الفورية أو تشغيل الموسيقى مثلًا. | ||
'''المعاملات''' | '''المعاملات''' | ||
سطر 254: | سطر 254: | ||
|- | |- | ||
| <code>taskProvider</code> | | <code>taskProvider</code> | ||
| taskProvider | | <code>taskProvider</code> | ||
| نعم | | نعم | ||
|} | |} | ||
سطر 264: | سطر 264: | ||
<syntaxhighlight class="react" lang="javascript">static registerCancellableHeadlessTask(taskKey, taskProvider, taskCancelProvider)</syntaxhighlight> | <syntaxhighlight class="react" lang="javascript">static registerCancellableHeadlessTask(taskKey, taskProvider, taskCancelProvider)</syntaxhighlight> | ||
<code>HeadlessTask</code> هي شيفرة | <code>HeadlessTask</code> هي شيفرة تُنفّد بدون واجهة مستخدِم، حيث يُرجع المعامل <code>taskProvider</code> دالةً تأخذ بيانات من الشيفرة الأصلية، وبعد تنفيذ الدالة يُرسِل إشعارًا للشيفرة الأصلية. وقد يُدمر سياق جافا سكريبت الحالي المعامل <code>taskCancelProvider</code> دالة تُرجع النوع <code>void</code> ولا تأخذ معاملات، وتُستدعى عندما يُرسل طلب الإلغاء. | ||
'''المعاملات''' | '''المعاملات''' | ||
سطر 278: | سطر 278: | ||
|- | |- | ||
| <code>taskProvider</code> | | <code>taskProvider</code> | ||
| TaskProvider | | <code>TaskProvider</code> | ||
| نعم | | نعم | ||
|- | |- | ||
| <code>taskCancelProvider</code> | | <code>taskCancelProvider</code> | ||
| TaskCancelProvider | | <code>TaskCancelProvider</code> | ||
| نعم | | نعم | ||
|} | |} | ||
* المعامل <code>TaskProvider</code> هو دالة تُرجع الدالة <code>Task</code>. | * المعامل <code>TaskProvider</code> هو دالة تُرجع الدالة <code>Task</code>. | ||
* الدالة <code>Task</code> تأخذ بيانات | * الدالة <code>Task</code> تأخذ بيانات مثل معاملات وتُرجع <code>Promise</code>. | ||
* الدالة <code>TaskCancelProvider</code> تُرجع | * الدالة <code>TaskCancelProvider</code> تُرجع <code>TaskCanceller</code>. | ||
* الدالة <code>TaskCanceller</code> لا تأخذ معاملات وتُرجع النوع <code>void</code>. | * الدالة <code>TaskCanceller</code> لا تأخذ معاملات وتُرجع النوع <code>void</code>. | ||
=== <code>startHeadlessTask</code> === | === <code>startHeadlessTask</code> === | ||
سطر 295: | سطر 295: | ||
تُستدعى من الشيفرة الأصلية، وتبدأ تنفيذ <code>headless task</code>. | تُستدعى من الشيفرة الأصلية، وتبدأ تنفيذ <code>headless task</code>. | ||
المعامل <code>taskId</code> هو المُعرِّف الخاص بالمهمة المُراد | المعامل <code>taskId</code> هو المُعرِّف الخاص بالمهمة المُراد بدؤها، والمعامل <code>taskKey</code> هو المفتاح الخاص بها، أمّا المعامل <code>data</code> فهو البيانات التي يجب إرسالها للمهمة المراد تنفيذها. | ||
'''المعاملات''' | '''المعاملات''' | ||
سطر 322: | سطر 322: | ||
تُستدعى من الشيفرة الأصلية، وتلغي تنفيذ <code>headless task</code>. | تُستدعى من الشيفرة الأصلية، وتلغي تنفيذ <code>headless task</code>. | ||
المعامل <code>taskId</code> هو المُعرِّف الخاص بالمهمة المُراد الغاء تنفيذها (وهي المهمة التي بدأت عند استدعاء الدالة <code>startHeadlessTask</code> | المعامل <code>taskId</code> هو المُعرِّف الخاص بالمهمة المُراد الغاء تنفيذها (وهي المهمة التي بدأت عند استدعاء الدالة <code>startHeadlessTask</code>، والمعامل <code>taskKey</code> هو المفتاح الخاص بها. | ||
'''المعاملات''' | '''المعاملات''' |
مراجعة 04:55، 6 مارس 2021
ملاحظة: إذا كنت تستخدم expo-cli
فلا يوجد سوى مكوّن إدخال واحد مسجل مسبقًا في AppRegistry
ويُتعامل معه تلقائيًا، لذلك فلا حاجة لاستخدام واجهة برمجة التطبيقات (API) هذه.
يُمثل AppRegistry
نقطة دخول جافا سكريبت لتشغيل جميع تطبيقات React Native. ويجب تسجيل جميع مكونات التطبيق الجذرية مع AppRegistry.registerComponent
، ومن ثم يتمكن النظام الأصلي من تحميل التطبيق وتشغيله عن طريق استدعاء الدالة AppRegistry.runApplication
.
import { Text, AppRegistry } from 'react-native';
const App = (props) => (
<View>
<Text>App1</Text>
</View>
);
AppRegistry.registerComponent('Appname', () => App);
لإيقاف التطبيق عند ازالة واجهة معيّنة (View
)، استدعي الدالة AppRegistry.unmountApplicationComponenetAtRootTag
على الوسم الذي مُرّرت سابقًا للدالة runApplication
.
يجب أن يكون AppRegistry
مطلوبًا في بداية سلسلة المطلوبات للتأكد من إعداد بيئة التنفيذ الصحيح قبل أن تكون هناك حاجة لوحدات أخرى.
الدوال
setWrapperComponentProvider
static setWrapperComponenetProvider(provider)
المعاملات
الاسم | النوع | مطلوب |
---|---|---|
provider
|
ComponentProvider
|
نعم |
enableArchitectureIndicator
static enableArchitectureIndicator(enabled)
المعاملات
الاسم | النوع | مطلوب |
---|---|---|
enabled
|
قيمة منطقية (boolean) | نعم |
registerConfig
static registerConfig([config])
الاسم | النوع | مطلوب |
---|---|---|
config
|
AppConfig | نعم |
المفاتيح الصالحة للاستخدام مع AppConfig
الاسم | النوع | مطلوب |
---|---|---|
appKey
|
سلسلة نصية (string) | نعم |
component
|
ComponentProvider | لا |
run
|
دالة (function) | لا |
section
|
قيمة منطقية (bool) | لا |
registerComponent()
static registerComponent(appKey, componentProvider, section?)
المعاملات
الاسم | النوع | مطلوب |
---|---|---|
appKey
|
سلسلة نصية (string) | نعم |
componenetProvider
|
ComponentProvider
|
نعم |
section
|
قيمة منطقية (bool) | لا |
registerRunnable()
static registerRunnable(appKey, run)
المعاملات
الاسم | النوع | مطلوب |
---|---|---|
appKey
|
سلسلة نصية (string) | نعم |
run
|
دالة (function) | نعم |
registerSection
static registerSection(appKey, component)
المعاملات
الاسم | النوع | مطلوب |
---|---|---|
appKey
|
سلسلة نصية (string) | نعم |
component
|
ComponentProvider
|
نعم |
getAppKeys
static getAppKeys()
تُرجع مصفوفة من AppKeys
.
getSectionKeys()
static getSectionKeys()
تُرجع مصفوفة من sectionKeys
.
getSections()
static getSections()
تُرجع جميع كائنات Runnables
، وهي كائنات يحتوي كلّ واحد منها على مفتاح (AppKey) وقيمة من نوع Runnable
والتي تتكون من:
- مكوّن (
ComponentProvider
). - دالة تشغيل (
run
).
getRunnable()
static getRunnable(appKey)
تُرجع كائن من النوع Runnable
، ويتكون من:
- مكون (
ComponentProvider
). - دالة تشغيل (
run
)
getRegistry()
static getRegistry()
تُرجع الكائن Registry
والذي يحتوي على:
sections
runnables
setComponentProviderInstrumentationHook()
static setComponentProviderInstrumentationHook(hook)
المعاملات
الاسم | النوع | مطلوب |
---|---|---|
hook
|
دالة (function) | نعم |
يحتوي الخطاف (hook) على المكونات التالية:
component
من النوعComponentProvider
(مطلوب).ScopedPerformanceLogger
من النوعIPerformanceLogger
(مطلوب).
تُرجع الدالة hook
مكوِّن React
.
runApplication
static runApplication(appKey, appParameters)
تُحمِّل حزمة تشغيل التطبيق.
المعاملات
الاسم | النوع | مطلوب |
---|---|---|
appKey
|
سلسلة نصية (string) | نعم |
appParameters
|
any | نعم |
unmountApplicationComponentAtRootTag
static unmountApplicationComponentAtRootTag(rootTag)
توقِف التطبيق عندما يُزال مكوّن معيّن.
المعاملات
الاسم | النوع | مطلوب |
---|---|---|
rootTag
|
عدد (number) | نعم |
registerHeadlessTask()
static registerHeadlessTask(taskKey, taskProvider)
HeadlessTask
هي شيفرة يتم تنفيذها بدون واجهة مستخدم. المعامل taskProvider
يُرجع دالة تأخذ بيانات من الشيفرة الأصلية. وبعد تنفيذ الدالة يُرسل إشعار للشيفرة الأصلية وقد يُدمر سياق جافا سكريبت الحالي (JS context).
تُستعمل هذه الدالة لتشغيل بعض المهام في التطبيق أثناء عمله في الخلفية، لمزامنة البيانات أو التعامل مع الإشعارات الفورية أو تشغيل الموسيقى مثلًا.
المعاملات
الاسم | النوع | مطلوب |
---|---|---|
taskKey
|
سلسلة نصية (string) | نعم |
taskProvider
|
taskProvider
|
نعم |
- المعامل
TaskProvider
هو دالة تُرجع الدالةTask
. - الدالة
Task
تأخذ بيانات وسيطة (arugments) وتُرجعPromise
يتم استيفاؤه على أنهundefined
.
registerCancellableHeadlessTask()
static registerCancellableHeadlessTask(taskKey, taskProvider, taskCancelProvider)
HeadlessTask
هي شيفرة تُنفّد بدون واجهة مستخدِم، حيث يُرجع المعامل taskProvider
دالةً تأخذ بيانات من الشيفرة الأصلية، وبعد تنفيذ الدالة يُرسِل إشعارًا للشيفرة الأصلية. وقد يُدمر سياق جافا سكريبت الحالي المعامل taskCancelProvider
دالة تُرجع النوع void
ولا تأخذ معاملات، وتُستدعى عندما يُرسل طلب الإلغاء.
المعاملات
الاسم | النوع | مطلوب |
---|---|---|
taskKey
|
سلسلة نصية (string) | نعم |
taskProvider
|
TaskProvider
|
نعم |
taskCancelProvider
|
TaskCancelProvider
|
نعم |
- المعامل
TaskProvider
هو دالة تُرجع الدالةTask
. - الدالة
Task
تأخذ بيانات مثل معاملات وتُرجعPromise
. - الدالة
TaskCancelProvider
تُرجعTaskCanceller
. - الدالة
TaskCanceller
لا تأخذ معاملات وتُرجع النوعvoid
.
startHeadlessTask
static startHeadlessTask(taskId, taskKey, data)
تُستدعى من الشيفرة الأصلية، وتبدأ تنفيذ headless task
.
المعامل taskId
هو المُعرِّف الخاص بالمهمة المُراد بدؤها، والمعامل taskKey
هو المفتاح الخاص بها، أمّا المعامل data
فهو البيانات التي يجب إرسالها للمهمة المراد تنفيذها.
المعاملات
الاسم | النوع | مطلوب |
---|---|---|
taskId
|
عدد (number) | نعم |
taskKey
|
سلسلة نصية (string) | نعم |
data
|
any | نعم |
cancelHeadlessTask()
static cancelHeadlessTask(taskId, taskKey)
تُستدعى من الشيفرة الأصلية، وتلغي تنفيذ headless task
.
المعامل taskId
هو المُعرِّف الخاص بالمهمة المُراد الغاء تنفيذها (وهي المهمة التي بدأت عند استدعاء الدالة startHeadlessTask
، والمعامل taskKey
هو المفتاح الخاص بها.
المعاملات
الاسم | النوع | مطلوب |
---|---|---|
taskId
|
عدد (number) | نعم |
taskKey
|
سلسلة نصية (string) | نعم |
data
|
any | نعم |