🧱 استخدام المكونات الأساسية في MIT App Inventor
.png)
في هذا الدرس، سنتعرف على بعض المكونات الأساسية (Components) التي تُعتبر حجر الأساس لأي تطبيق يتم تطويره بواسطة MIT App Inventor. سنتعلم كيف نستخدم هذه العناصر ونخصصها لواجهة المستخدم.
🔘 1. الأزرار (Buttons)
- من لوحة المكونات، اسحب Button إلى شاشة التصميم.
- من خصائص الزر، يمكنك تغيير:
- Text: النص الظاهر على الزر (مثلاً "أرسل").
- FontSize: حجم الخط.
- BackgroundColor: لون الخلفية.
- يمكنك أيضًا التحكم بما يحدث عند الضغط عليه من خلال واجهة Blocks.
🖼️ 2. الصور (Images)
- من قائمة User Interface، اسحب مكون Image.
- من خاصية Picture، انقر على "Upload File" واختر صورة من حاسوبك.
- يمكنك ضبط حجم الصورة من خاصيتي Width و Height.
✏️ 3. مربعات النصوص (TextBox)
مربعات النصوص تتيح للمستخدم إدخال البيانات (مثل الاسم أو رقم الهاتف).
- اسحب TextBox إلى الشاشة.
- يمكنك تعيين نص افتراضي من خاصية Hint (مثلاً "اكتب اسمك").
- لاستخدام النص داخل Blocks، استخدم الكتلة:
TextBox1.Text
📋 4. القوائم المنسدلة (ListPicker)
مكون ListPicker يسمح لك بإنشاء قائمة خيارات يختار منها المستخدم.
- اسحب ListPicker إلى الشاشة.
- من واجهة Blocks، يمكنك تحديد العناصر كما يلي:
set ListPicker1.Elements to make a list ("خيار 1", "خيار 2", "خيار 3") - عند اختيار عنصر، يمكنك تنفيذ أكشن معين باستخدام
when ListPicker1.AfterPicking.
🧪 تجربة مصغرة
جرّب دمج زر، صورة، ومربع نص في تطبيق واحد بسيط. اجعل التطبيق يعرض الصورة ويطبع اسم المستخدم بعد إدخاله والضغط على الزر.
📘 في المقالة القادمة، سننتقل إلى مستوى أكثر تفاعلاً حيث سنتعلم كيفية التحكم في الأحداث مثل الضغط، السحب، أو إدخال البيانات.
➡️ المقالة الخامسة: التحكم في الأحداث
📚 سلسلة تعلم MIT App Inventor:
- 🔹 المقالة 1: مقدمة حول MIT App Inventor
- 🔹 المقالة 2: التسجيل والدخول إلى المنصة
- 🔹 المقالة 3: إنشاء أول تطبيق بسيط
- 🔹 المقالة 4: استخدام المكونات الأساسية
- 🔹 المقالة 5: التحكم في الأحداث
- 🔹 المقالة 6: تخزين البيانات بـ TinyDB
- 🔹 المقالة 7: استخدام المستشعرات
- 🔹 المقالة 8: استخدام GPS والخريطة
- 🔹 المقالة 9: تصدير التطبيق واختباره
- 🔹 المقالة 10: مشروع تطبيقي نهائي