في تطبيقات الهاتف المحمول ، يختلف سير عمل مكون Image قليلاً عن سير العمل في تطبيقات الويب. توضح هذه المقالة بالتفصيل كيفية استخدام مكون Image في تطبيق الهاتف المحمول. عند تكرار العناصر ، مثل عناصر List ومكونات Grid ، فإن تحميل Image من نموذج البيانات ليس واضحًا ويتطلب إجراءً معينًا للتحميل باستخدام BP.
استخدام مكون Image في تكرار العناصر ( List/Grid )
دعنا نرى مثالاً حيث لدينا جدول رحلات وكل كائن طيران له غلافه الخاص الذي يمثله حقل ImageFile [ file ].
تخيل أن قائمة الرحلات الجوية ممثلة بمكون List . كل عنصر من مكونات List - هو مكون Card يحتوي على Image وبعض المكونات الأخرى لعرض معلومات الرحلة ذات الصلة. في مصمم واجهة المستخدم يبدو بالطريقة التالية:
بادئ ذي بدء ، يجب تحديد Data Source للمكون الأصلي (مكون List في هذه الحالة).
لتحميل البيانات من قاعدة البيانات إلى مكون Image ، نحتاج إلى إنشاء عملية تجارية جديدة لمكون Image .
يبدأ BP المطلوب بإنشاء عنصر صورة في التطبيق ، أي مشغل onCreate . بادئ ذي بدء ، من الضروري تلقي كائن نموذج البيانات المطابق للصورة المحددة. للقيام بذلك ، يمكنك استخدام البيانات التي تم استلامها بالفعل بواسطة العنصر الأصل ( List في هذه الحالة). للحصول على البيانات من List ، يتم استخدام كتلة " List Get Data .
منطق BP الذي نبنيه هو كما يلي: إذا كان أحد عناصر مصفوفة Data (كائن نموذج flight ) يحتوي على معرف ( ID ) يساوي Record ID ، فعندئذ وجدنا عنصر جدول الرحلة الذي نحتاجه. بعد ذلك ، يتم أخذ ID ملف الصورة من كائن نموذج الطيران وتحميله في مكون الصورة باستخدام معرف عنصر Widget ID المطلوب.
للتكرار على جميع عناصر صفيف Data ، يتم استخدام كتلة BP For each loop ، وفي جسم الحلقة ، يتم توسيع كل عنصر من عناصر مصفوفة Data باستخدام كتلة Expand Flight . إذا كان Flight ID = Record ID ، فسيتم أخذ معرف ملف ImageFile ويتم تحميل كائن الملف باستخدام Server request GET /_files/:id/download/ block. مثال على BP المقابل على النحو التالي.
في الخطوة التالية ، يتم توسيع ملف الصورة باستخدام كتلة Expand file لتمرير مصفوفة البايت كمدخلات لخاصية Data كتلة Image Update Properties . من الضروري أيضًا تحديد معرف عنصر Widget ID لعنصر صورة معين في الورقة ، مع تمرير القيمة من كتلة onCreate في بداية BP. تظهر نتيجة الجزء الأخير من BP في المثال أدناه:
في النهاية ، يتم استخدام كتلة Break Loop حتى لا تتكرر على العناصر المتبقية من المصفوفة دون جدوى.
تحميل صورة من نظام ملفات الهاتف الذكي للمستخدم
ضع في اعتبارك مثالاً لتحميل الصورة الرمزية لملف تعريف المستخدم. تتكون واجهة الويب من صورة وزر يقوم بتشغيل BP ، ويبدو كالتالي:
بعد ذلك ، يسمح BP المناسب للمستخدم بتحديد الملفات من أجهزته باستخدام كتلة Select Files . وإذا تم تحديد الملفات بنجاح ، فسيتم أخذ العنصر ذي index = 0 . تبدو BP المقابلة كما يلي:
يجب تحميل عنصر الملف الناتج من مصفوفة Files إلى خادم تطبيق الويب لمزيد من الاستخدام ( Server request POST /_files/ ). في حالة نجاح الطلب ، يتم تمرير كائن الملف في إخراج Server request POST /_files/ block إلى إدخال كتلة Expand file للحصول على Bytes Array ، والذي يتم تمريره إلى مدخلات كتلة Image Update Properties في خاصية Data .
