لإنشاء الشاشة الثالثة للتطبيق - كتاب هندسة البرمجيات - الصف 12 - الفصل 1 - المملكة العربية السعودية

الكتاب: كتاب هندسة البرمجيات - الصف 12 - الفصل 1 | المادة: هندسة البرمجيات | المرحلة: الصف 12 | الفصل الدراسي: 1

الدولة: المملكة العربية السعودية | المنهج: المنهج السعودي - وزارة التعليم

الدرس: إنشاء شاشة ثالثة

📚 معلومات الصفحة

الكتاب: كتاب هندسة البرمجيات - الصف 12 - الفصل 1 | المادة: هندسة البرمجيات | المرحلة: الصف 12 | الفصل الدراسي: 1

الدولة: المملكة العربية السعودية | المنهج: المنهج السعودي - وزارة التعليم

نوع المحتوى: درس تعليمي

الفصل: 2

مستوى الصعوبة: مبتدئ

📝 ملخص الصفحة

تقدم هذه الصفحة درسًا عمليًا حول إنشاء الشاشة الثالثة لتطبيق جوال باستخدام برنامج تصميم واجهات المستخدم مثل 'Pencil'. يبدأ الدرس بتعليمات خطوة بخطوة لسحب وإفلات عناصر واجهة المستخدم من قسم 'Mobile - Android ICS'، بما في ذلك شكل الهاتف وشريط الإشعارات والنص، مع تعديل خصائص النص مثل اللون والمحتوى.

يتم شرح العملية من خلال خمس خطوات مرقمة، حيث يتم إضافة نصين: 'Al Masmak (المصمك)' و'Boulevard of Riyadh City (بوليفارد مدينة الرياض)'، مما يعزز مهارات التصميم والتخصيص. يتضمن الدرس أيضًا شكلًا توضيحيًا (شكل 2.32) يظهر واجهة البرنامج مع الألواح الجانبية والمنطقة المركزية لعرض النماذج الأولية للشاشات.

يهدف هذا المحتوى إلى تعليم الطلاب أساسيات تصميم واجهات المستخدم لتطبيقات الجوال، مع التركيز على الاستخدام العملي للأدوات والنمذجة الأولية، مما يساعد في تطوير مشاريع تقنية واقعية.

📄 النص الكامل للصفحة

--- SECTION: لإنشاء الشاشة الثالثة للتطبيق --- لإنشاء الشاشة الثالثة للتطبيق: من قسم Mobile - Android ICS (الهاتف المحمول - أندرويد ICS)، اسحب وأفلت شكل Phone (هاتف) على يمين شكل الهاتف الثاني. 1 اسحب شكل Status Bar (شريط الإشعارات) وأفلته في الجزء العلوي من شاشة الهاتف كما يبدو على شاشة الهاتف الحقيقي. 2 اسحب وأفلت شكل Text (نص)، 3 ثم من علامة التبويب Properties (خصائص) غيّر لون النص واكتب Al Masmak (المصمك). 4 كرّر الخطوتين الأخيرتين لكتابة Boulevard of Riyadh City (بوليفارد مدينة الرياض). 5 --- SECTION: شكل 2.32: إنشاء شاشة ثالثة --- شكل 2.32: إنشاء شاشة ثالثة وزارة التعليم 107 Ministry of Education 2025 - 1447 --- VISUAL CONTEXT --- **DIAGRAM**: شكل 2.32: إنشاء شاشة ثالثة Description: A screenshot of a user interface (UI) design software, likely 'Pencil', demonstrating the steps to create a third screen for a mobile application. The interface is divided into three main areas: a left panel for UI elements, a central canvas displaying phone screen mockups, and a right panel for element properties. X-axis: N/A Y-axis: N/A Data: The diagram illustrates a workflow for UI design. The left panel shows categories like 'Mobile - Android ICS' containing elements such as 'Phone', 'Tablet', 'Status Bar', 'Text', and 'Button'. The central canvas shows three phone screens: the first with a green background and emblem, the second titled 'Discover Saudi Arabia' with images of 'RIYADH' and 'JEDDAH', and the third being designed. The right panel shows 'TEXT' properties, including content, color, font, and alignment. Key Values: Software Name: Pencil, UI Element Category: Mobile - Android ICS, UI Element: Phone, UI Element: Status Bar, UI Element: Text, Properties Panel: TEXT, Text Content: Al Masmak, Text Content: Boulevard of Riyadh City Context: This visual element provides a practical, step-by-step guide for students on how to use a UI design tool to prototype mobile application screens, specifically focusing on dragging and dropping elements and modifying text properties. The numbered circles (1-5) directly correspond to the instructional steps provided in the text.

🎴 بطاقات تعليمية للمراجعة

عدد البطاقات: 4 بطاقة لهذه الصفحة

ما هي الخطوات المذكورة لإنشاء الشاشة الثالثة للتطبيق باستخدام أداة التصميم؟

الإجابة: 1. من قسم Mobile - Android ICS، اسحب وأفلت شكل Phone على يمين شكل الهاتف الثاني. 2. اسحب شكل Status Bar وأفلته في الجزء العلوي من شاشة الهاتف. 3. اسحب وأفلت شكل Text. 4. من علامة التبويب Properties غيّر لون النص واكتب 'Al Masmak'. 5. كرّر الخطوتين الأخيرتين لكتابة 'Boulevard of Riyadh City'.

الشرح: هذه الخطوات توضح عملية تصميم واجهة المستخدم خطوة بخطوة باستخدام أداة تصميم مثل Pencil، وهي مهارة عملية في هندسة البرمجيات.

تلميح: ركز على الأرقام التسلسلية في النص والعمليات المتعلقة بسحب وإفلات العناصر.

التصنيف: صيغة/خطوات | المستوى: متوسط

ما هو الغرض من علامة التبويب Properties (خصائص) في أداة تصميم واجهة المستخدم؟

الإجابة: الغرض من علامة التبويب Properties هو تعديل خصائص العناصر المرسومة، مثل تغيير لون النص ومحتواه.

الشرح: تعديل الخصائص هو جزء أساسي من عملية تصميم الواجهات، حيث يسمح للمصمم بتخصيص مظهر وسلوك العناصر.

تلميح: فكر في الإجراء الذي تم تنفيذه بعد سحب عنصر Text.

التصنيف: مفهوم جوهري | المستوى: سهل

ما هي العناصر (UI Elements) المذكورة في قسم Mobile - Android ICS والتي يمكن سحبها إلى لوحة التصميم؟

الإجابة: العناصر المذكورة هي: Phone (هاتف)، Status Bar (شريط الإشعارات)، Text (نص).

الشرح: معرفة عناصر واجهة المستخدم المتاحة في مكتبة الأداة هو الخطوة الأولى لبناء النموذج الأولي للتطبيق.

تلميح: انظر إلى العناصر التي تم سحبها في الخطوات المذكورة.

التصنيف: تعريف | المستوى: سهل

ما هو الإجراء المتكرر (Repetition) المطلوب عند إضافة نصين مختلفين في التصميم؟

الإجابة: الإجراء المتكرر هو: سحب عنصر Text، ثم من علامة التبويب Properties تغيير لون النص وكتابة المحتوى المطلوب.

الشرح: التكرار هو مبدأ مهم في البرمجة والتصميم، ويظهر هنا في عملية إضافة عناصر متشابهة مع اختلاف في البيانات (المحتوى).

تلميح: تذكر الخطوة التي تبدأ بكلمة 'كرّر'.

التصنيف: مفهوم جوهري | المستوى: متوسط