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

--- SECTION: واجهة تصميم التطبيق - لقطة الشاشة العلوية --- Visit_SA_App AlMasmak Add Screen Remove Screen Publish to Gallery Palette Search Components User Interface Layout HorizontalArrangement HorizontalScrollArrangement TableArrangement VerticalArrangement VerticalScrollArrangement Media Drawing and Animation Maps Charts Sensors Social Storage Connectivity LEGO® MINDSTORMS® Experimental Extension Viewer Display hidden components in Viewer Phone size (505,320) Discover Saudi Arabia 9:48 Components AlMasmak discover_label VerticalArrangement1 Properties Designer Blocks VerticalArrangement1 AlignHorizontal Left : 1 AlignVertical Top : 1 BackgroundColor Custom... Height Fill parent... Width Fill parent... Image None Visible Rename Delete Media welcome-screen.png riyadh_nav-img.png jeddah_nav-img.png --- SECTION: واجهة تصميم التطبيق - لقطة الشاشة السفلية --- Visit_SA_App AlMasmak Add Screen Remove Screen Publish to Gallery Palette Search Components User Interface Button CheckBox DatePicker Image Label ListView Notifier PasswordTextBox Slider Spinner Switch TextBox TimePicker WebViewer Layout Media Viewer Display hidden components in Viewer Phone size (505,320) Discover Saudi Arabia 9:48 Al Masmak Components AlMasmak discover_label VerticalArrangement1 title_label Properties Designer Blocks title_label BackgroundColor None FontBold FontItalic FontSize 18.0 FontTypeface default HTMLFormat HasMargins Height Automatic Width Automatic Text Al Masmak TextAlignment left : 0 TextColor White Visible Media welcome-screen.png riyadh_nav-img.png jeddah_nav-img.png --- SECTION: شكل 3.27 --- شكل 3.27: إضافة العناصر إلى الشاشة الثالثة وزارة التعليم Ministry of Education 2025 - 1447 144 --- VISUAL CONTEXT --- **FIGURE**: واجهة تصميم التطبيق - لقطة الشاشة العلوية Description: لقطة شاشة لواجهة تصميم تطبيق (شبيهة بـ App Inventor) تعرض لوحات 'Palette' و 'Viewer' و 'Components' و 'Properties'. يتم تحديد المكون 'VerticalArrangement' في لوحتي 'Palette' و 'Components'. يعرض لوح 'Properties' خصائصه مثل 'Height' و 'Width' المعينتين على 'Fill parent'. تشير الأرقام الزرقاء إلى: 1. المكون 'VerticalArrangement' في لوحة 'Palette' وشجرة 'Components'. 2. خاصية 'BackgroundColor'. 3. خاصية 'Height' بقيمة 'Fill parent'. 4. خاصية 'Width' بقيمة 'Fill parent'. Key Values: Phone size (505,320), Left : 1, Top : 1, Height: Fill parent, Width: Fill parent Context: توضح الخطوات الأولية لإضافة مكون تخطيط (VerticalArrangement) إلى شاشة التطبيق وتكوين خصائصه الأساسية. **FIGURE**: واجهة تصميم التطبيق - لقطة الشاشة السفلية Description: لقطة شاشة لواجهة تصميم تطبيق، مشابهة للأولى، ولكن تم تحديد مكون 'Label' الآن في لوحتي 'Palette' و 'Components'. يظهر تسمية جديدة 'Al Masmak' على شاشة الهاتف. يعرض لوح 'Properties' خصائص 'title_label' بما في ذلك 'FontSize' (18.0)، و 'Text' ('Al Masmak')، و 'TextColor' ('White'). تشير الأرقام الزرقاء إلى: 5. 'title_label' في شجرة 'Components'. 6. خاصية 'BackgroundColor' (مربعات الاختيار 'None'). 7. خاصية 'FontSize' بقيمة '18.0'. 8. خاصية 'Text' بقيمة 'Al Masmak'. 9. خاصية 'TextColor' بقيمة 'White'. Key Values: Phone size (505,320), FontSize: 18.0, Text: Al Masmak, TextColor: White Context: يوضح إضافة مكون 'Label'، وتعيين نصه، وحجم الخط، ولونه، وملاحظة التغيير على شاشة التطبيق.