📝 ملخص الصفحة
تتناول هذه الصفحة عملية إنشاء الشاشة الثالثة والأخيرة في تطبيق تعليمي، حيث تُعرض معلومات مفصلة عن معلم محدد (مثل المصمك) تم اختياره من شاشة سابقة. تشمل هذه الشاشة عنوان المعلم، وصورة رمزية له، ووصفًا نصيًا، بالإضافة إلى زر للخريطة يتيح عرض خريطة تفاعلية تظهر موقع المعلم في المدينة المحددة.
يشرح النص كيفية عمل مكون ListPicker (قائمة الخيارات) في التطبيق، حيث يؤدي تحديد صورة في القائمة إلى تغيير محتويات الشاشة لعرض قائمة بالخيارات المتاحة، مثل اختيار الرياض لتنفيذ إجراءات محددة.
تتضمن الصفحة أمثلة مرئية توضح شاشة اختيار المعالم التي تعرض قائمة بالخيارات (مثل المصمك ومدينة بوليفارد الرياض)، وشاشة عرض معلومات المدينة التي تظهر محتوى ديناميكيًا بعد الاختيار، مثل عرض معلومات وصور لمدينتي الرياض وجدة.
يهدف الدرس إلى تعليم الطلاب كيفية تصميم واجهات المستخدم التفاعلية في تطبيقات الهواتف المحمولة، مع التركيز على استخدام مكونات مثل ListPicker لعرض البيانات وتحديث الشاشات بناءً على اختيارات المستخدم.
يُعد هذا المحتوى جزءًا من منهج تعليمي يهدف إلى تطوير مهارات البرمجة وتصميم التطبيقات، مع تطبيق عملي على إنشاء شاشات متعددة في تطبيق واحد.
📄 النص الكامل للصفحة
عند تشغيل التطبيق النهائي على هاتفك المحمول، سيعمل مكوّن ListPicker (قائمة الخيارات) بالطريقة التالية: عند تحديد صورة لكل قائمة، تتغير محتويات الشاشة لإظهار قائمة بالخيارات. فعلى سبيل المثال، عند الضغط على مكوّن ListPicker (قائمة الخيارات) الخاص بالرياض، سينفذ التطبيق الإجراء التالي:
شكل 3.25: مكوّن ListPicker (قائمة الخيارات)
--- SECTION: إنشاء الشاشة الثالثة للتطبيق Creating the Third Screen of the App ---
إنشاء الشاشة الثالثة للتطبيق Creating the Third Screen of the App
ستعرض الشاشة الثالثة والأخيرة في التطبيق المعلومات حول المعلم المحدد من الشاشة السابقة. وستعرض هذه الشاشة عنوان المعلم وصورة رمزية له ووصفًا نصيًا، وستعرض أيضًا زرًا للخريطة يتيح عرض خريطة تفاعلية تظهر موقع المعلم في المدينة المحددة. وسيكون لكل معلم شاشته المخصصة. في هذا الدرس ستنشئ الشاشة الخاصة بالمصمك.
وزارة التعليم Ministry of Education 2025 - 1447
142
--- VISUAL CONTEXT ---
**IMAGE**: شاشة اختيار المعالم
Description: A smartphone screen displaying a list of two items: 'Al Masmak' and 'Boulevard Riyadh City'. The phone's status bar at the top displays a Wi-Fi signal icon, battery icon, and the time '9:48'. The bottom navigation bar shows a triangle, circle, and square icon.
Context: This screen represents the initial state of the ListPicker component, allowing the user to select a landmark from a predefined list.
**IMAGE**: شاشة عرض معلومات المدينة
Description: A smartphone screen displaying content related to 'Discover Saudi Arabia'. It has a header 'Cities'. Below the header, 'RIYADH' is displayed with an image of the Riyadh skyline, and 'JEDDAH' is displayed with an image of Jeddah's waterfront. The phone's status bar at the top displays a Wi-Fi signal icon, battery icon, and the time '9:48'. The bottom navigation bar shows a triangle, circle, and square icon.
Context: This screen demonstrates the dynamic content display after a selection is made from the ListPicker, showing specific information and images for selected cities like Riyadh and Jeddah.
🎴 بطاقات تعليمية للمراجعة
عدد البطاقات: 4 بطاقة لهذه الصفحة
ما هي وظيفة مكون ListPicker (قائمة الخيارات) في تطبيق App Inventor؟
الإجابة: عند تحديد صورة لكل قائمة، تتغير محتويات الشاشة لإظهار قائمة بالخيارات. فعلى سبيل المثال، عند الضغط على مكون ListPicker الخاص بالرياض، سينفذ التطبيق الإجراء المناسب.
الشرح: مكون ListPicker يسمح للمستخدم باختيار عنصر من قائمة، مما يؤدي إلى تغيير محتويات الشاشة لعرض المعلومات المرتبطة بالعنصر المحدد.
تلميح: فكر في كيفية تفاعل المستخدم مع القائمة وتأثير ذلك على عرض المحتوى.
التصنيف: تعريف | المستوى: سهل
ما هي مكونات الشاشة الثالثة في تطبيق المعالم السياحية؟
الإجابة: ستعرض الشاشة الثالثة والأخيرة في التطبيق المعلومات حول المعلم المحدد من الشاشة السابقة. وستعرض هذه الشاشة عنوان المعلم وصورة رمزية له ووصفًا نصيًا، وستعرض أيضًا زرًا للخريطة يتيح عرض خريطة تفاعلية تظهر موقع المعلم في المدينة المحددة.
الشرح: الشاشة الثالثة هي شاشة تفاصيل المعلم، وتحتوي على جميع المعلومات الأساسية والوسائط المتعددة المتعلقة بالمعلم المحدد.
تلميح: تذكر أن هذه الشاشة تظهر بعد اختيار معلم معين.
التصنيف: مفهوم جوهري | المستوى: متوسط
ما هي خاصية التخصيص في شاشات تطبيق المعالم السياحية؟
الإجابة: سيكون لكل معلم شاشته المخصصة. في هذا الدرس ستنشئ الشاشة الخاصة بالمصمك.
الشرح: التطبيق مصمم بحيث يكون لكل معلم شاشة تفاصيل مخصصة تعرض معلوماته الفريدة، مما يوفر تجربة مستخدم شخصية.
تلميح: فكر في كيفية تصميم واجهة مستخدم مختلفة لكل معلم.
التصنيف: مفهوم جوهري | المستوى: سهل
ما هو التسلسل المنطقي لشاشات تطبيق المعالم السياحية كما ورد في النص؟
الإجابة: 1. الشاشة الأولى: اختيار المدينة (مثل الرياض، جدة). 2. الشاشة الثانية: اختيار المعلم من القائمة (مثل المصمك، بوليفارد الرياض). 3. الشاشة الثالثة: عرض معلومات المعلم المحدد (عنوان، صورة، وصف، خريطة).
الشرح: التطبيق يتبع هيكلية هرمية تبدأ بالمدينة، ثم المعلم داخل المدينة، ثم تفاصيل المعلم المحدد، مما يوفر تجربة تصفح منظمة.
تلميح: راجع تدفق المستخدم من اختيار عام إلى عرض تفاصيل محددة.
التصنيف: صيغة/خطوات | المستوى: متوسط