صفحة 126 - كتاب التقنية الرقمية - الصف 12 - الفصل 1 - المملكة العربية السعودية

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

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

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

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

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

📋 المحتوى المنظم

📖 محتوى تعليمي مفصّل

نوع: محتوى تعليمي

المكونات الأكثر استخدامًا في واجهة تصميم تطبيقات الهواتف الذكية

نوع: محتوى تعليمي

جدول يوضح المكونات الأكثر استخدامًا في واجهة تصميم تطبيقات الهواتف الذكية.

نوع: محتوى تعليمي

إنشاء تطبيق الغذاء الصحي في مطور التطبيقات MIT

نوع: محتوى تعليمي

اكتب اسم الصفحة الرئيسة (Home) ليكون عنوانًا للشاشة الأولى (Screen1)، والتي ستكون هي الشاشة الرئيسة للتطبيق.

نوع: محتوى تعليمي

لتغيير عنوان الشاشة:

نوع: QUESTION_ACTIVITY

اضغط على Screen1 (الشاشة الأولى) من قسم Components (المكونات). 1 مرر الشريط الجانبي للأسفل في قسم Properties (الخصائص)، 2 وفي حقل Title (العنوان)، اكتب كلمة الصفحة الرئيسة (Home). 3

نوع: METADATA

وزارة التعليم Ministry of Education 2025 - 1447

🔍 عناصر مرئية

المكونات الأكثر استخدامًا في واجهة تصميم تطبيقات الهواتف الذكية

A table listing common user interface components used in smartphone app design, detailing their names, associated icons, and functions.

A screenshot of the MIT App Inventor development environment. It displays a 'Viewer' panel showing a smartphone screen with 'Screen1' at the top, a 'Components' panel (highlighted with a red circle labeled '1') listing 'Screen1', and a 'Properties' panel (highlighted with a red circle labeled '2') displaying various properties for 'Screen1'. The properties visible include 'AboutScreen', 'AccentColor', 'AlignHorizontal', 'AlignVertical', 'AppName' (Healthy_Food), 'BackgroundColor', 'BackgroundImage', 'BigDefaultText', 'BlocksToolkit', 'CloseScreenAnimation', 'Default', 'DefaultFileScope', and 'HighContrast'. Below the Components panel, there is a 'Media' section with an 'Upload File...' button. The bottom of the smartphone screen shows standard Android navigation buttons (back, home, recent apps).

A close-up screenshot of a section of the MIT App Inventor 'Properties' panel. It displays several fields: 'Title', 'TitleVisible' (with a checked checkbox), 'TutorialURL', and 'VersionCode' (with value '1'). The 'Title' field contains the Arabic text 'الصفحة الرئيسة' (Home Page) and is highlighted by a red circle labeled '3'.

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

المكونات الأكثر استخدامًا في واجهة تصميم تطبيقات الهواتف الذكية جدول يوضح المكونات الأكثر استخدامًا في واجهة تصميم تطبيقات الهواتف الذكية. إنشاء تطبيق الغذاء الصحي في مطور التطبيقات MIT اكتب اسم الصفحة الرئيسة (Home) ليكون عنوانًا للشاشة الأولى (Screen1)، والتي ستكون هي الشاشة الرئيسة للتطبيق. لتغيير عنوان الشاشة: اضغط على Screen1 (الشاشة الأولى) من قسم Components (المكونات). 1 مرر الشريط الجانبي للأسفل في قسم Properties (الخصائص)، 2 وفي حقل Title (العنوان)، اكتب كلمة الصفحة الرئيسة (Home). 3 وزارة التعليم Ministry of Education 2025 - 1447 --- VISUAL CONTEXT --- **TABLE**: المكونات الأكثر استخدامًا في واجهة تصميم تطبيقات الهواتف الذكية Description: A table listing common user interface components used in smartphone app design, detailing their names, associated icons, and functions. Table Structure: Headers: المكون | الأيقونة | الوصف Rows: Row 1: زر الأمر (Button) | Button | القيام بمهمة محددة عند ضغطه. Row 2: صورة (Image) | Image | مكون خاص يعرض الصور. Row 3: أداة التسمية (Label) | Label | تعرض نصًا يتم تخصيصه في خاصية حقل النص (Text). Row 4: الاختيار من القائمة (ListPicker) | ListPicker | يتم الضغط عليه لعرض عدة خيارات نصية للاختيار من بينها. Context: This table provides a quick reference for developers to understand the basic building blocks of a mobile application interface. **FIGURE**: Untitled Description: A screenshot of the MIT App Inventor development environment. It displays a 'Viewer' panel showing a smartphone screen with 'Screen1' at the top, a 'Components' panel (highlighted with a red circle labeled '1') listing 'Screen1', and a 'Properties' panel (highlighted with a red circle labeled '2') displaying various properties for 'Screen1'. The properties visible include 'AboutScreen', 'AccentColor', 'AlignHorizontal', 'AlignVertical', 'AppName' (Healthy_Food), 'BackgroundColor', 'BackgroundImage', 'BigDefaultText', 'BlocksToolkit', 'CloseScreenAnimation', 'Default', 'DefaultFileScope', and 'HighContrast'. Below the Components panel, there is a 'Media' section with an 'Upload File...' button. The bottom of the smartphone screen shows standard Android navigation buttons (back, home, recent apps). Context: This figure illustrates the main layout of the MIT App Inventor, showing where to find components and their properties, as referenced in the app creation instructions. **FIGURE**: Untitled Description: A close-up screenshot of a section of the MIT App Inventor 'Properties' panel. It displays several fields: 'Title', 'TitleVisible' (with a checked checkbox), 'TutorialURL', and 'VersionCode' (with value '1'). The 'Title' field contains the Arabic text 'الصفحة الرئيسة' (Home Page) and is highlighted by a red circle labeled '3'. Context: This figure specifically illustrates the 'Title' property field within the App Inventor's Properties panel, demonstrating where to input the screen title as per the instructions.

✅ حلول أسئلة الكتاب الرسمية

عدد الأسئلة: 4

سؤال مربع-1: ما هو وصف المكون "زر الأمر (Button)"؟

الإجابة: القيام بمهمة محددة عند ضغطه.

خطوات الحل:

  1. **الشرح:** لنفهم هذا السؤال، نحتاج إلى معرفة ما هو المكون "زر الأمر" في سياق البرمجة أو تصميم الواجهات. هذا المكون هو عنصر مرئي في الواجهة، وعادة ما يكون على شكل مستطيل أو مربع يحتوي على نص. الفكرة هنا هي أن وظيفة هذا الزر ليست مجرد عرض شيء ما، بل هي تنفيذ إجراء أو أمر. عندما يرى المستخدم هذا الزر ويضغط عليه (بالماوس أو باللمس)، فإنه يتوقع أن يحدث شيء محدد. إذن، وصف هذا المكون يركز على الفعل الذي يقوم به عند التفاعل معه، وهو القيام بمهمة أو تنفيذ أمر معين بمجرد الضغط عليه.

سؤال مربع-2: ما هو وصف المكون "صورة (Image)"؟

الإجابة: مكون خاص يعرض الصور.

خطوات الحل:

  1. **الشرح:** لننظر إلى المكون المسمى "صورة". من اسمه، يمكننا الاستنتاج أن وظيفته الأساسية مرتبطة بالصور. في تصميم الواجهات أو التطبيقات، توجد مكونات مختلفة لكل غرض. بعض المكونات للنص، وبعضها للأزرار، وبعضها لحقول الإدخال. المكون "صورة" مخصص لغرض محدد جدًا. الفكرة هنا هي أن هذا المكون لا يعرض نصوصًا أو ينفذ أوامر عند الضغط، بل دوره الرئيسي هو عرض ملفات الصور (مثل .jpg أو .png) للمستخدم. لذلك، وصفه يركز على كونه أداة أو حاوية مخصصة لعرض المحتوى المرئي على شكل صور.

سؤال مربع-3: ما هو وصف المكون "أداة التسمية (Label)"؟

الإجابة: تعرض نصًا يتم تخصيصه في خاصية حقل النص (Text).

خطوات الحل:

  1. **الشرح:** كلمة "تسمية" تشير إلى شيء يستخدم لتسمية أو تعريف عنصر آخر. في هذا السياق، المكون "أداة التسمية" هو عنصر في الواجهة. دوره ليس تفاعليًا مثل الزر (لا ينفذ أمرًا عند الضغط)، وليس لعرض صور معقدة. بدلاً من ذلك، وظيفته أبسط وهي عرض معلومات نصية. الفكرة المهمة هنا هي أن النص الذي يعرضه هذا المكون ليس ثابتًا بالضرورة أو مخفيًا في الكود. عادةً، يوجد له خاصية أو إعداد (غالبًا ما تسمى "Text" أو "النص") حيث يمكن للمصمم أو المبرمج كتابة النص الذي يريد عرضه. لذلك، وصفه يركز على كونه يعرض نصًا، وهذا النص يمكن تخصيصه وتغييره بسهولة من خلال حقل مخصص له.

سؤال مربع-4: ما هو وصف المكون "الاختيار من القائمة (ListPicker)"؟

الإجابة: يتم الضغط عليه لعرض عدة خيارات نصية للاختيار من بينها.

خطوات الحل:

  1. **الشرح:** لنفكر في كلمة "الاختيار من القائمة". هذا يشير إلى موقف حيث يوجد لدينا عدة خيارات، والمستخدم يحتاج إلى اختيار واحد منها. المكون "ListPicker" يجسد هذه الفكرة في واجهة المستخدم. عادة، يظهر للمستخدم على شكل زر أو حقل. عندما يريد المستخدم رؤية الخيارات المتاحة، عليه الضغط على هذا المكون. بعد الضغط، تظهر قائمة منسدلة أو نافذة تحتوي على عدة خيارات مكتوبة كنص (مثل أسماء، أو إعدادات). دور المستخدم هنا هو اختيار خيار واحد من هذه القائمة النصية المعروضة. لذلك، وصف هذا المكون يلخص هذه العملية: الضغط عليه أولاً لعرض القائمة، ثم الاختيار من بين الخيارات النصية المعروضة.