برمجة التطبيق | الوحدة الثالثة | الدرس الثالث
برمجة التطبيق هو عنوان الدرس الثالث من الوحدة الثالثة التي تحمل اسم “تطبيقات الهواتف الذكية” في الفصل الدراسي الأول من مقرر “تقنية رقمية 3”.
ستتعرف في هذا الموضوع على كيفية استكمال إنشاء التطبيق الذكي وإضافة المزيد من القوائم، والتمييز بين المتغيرات المحلية والعامة، واستخدامها، بالإضافة إلى استخدام الجملة الشرطية if then (إذا عندما)، ونشر التطبيق باستخدام ملف APK.
لذا قم بقراءة نواتج التعلُّم بعناية، ثم أعد قراءتها وتأكَّد من تحصيل كافة محتوياتها بعد انتهائك من دراسة الموضوع.
نواتج التعلُّم
- إضافة القوائم في التطبيق الذكي.
- التمييز بين المتغيرات المحلية والمتغيرات العامة.
- استخدام الجملة الشرطية if then (إذا عندما).
- نشر التطبيق باستخدام الملف APK.
هيا لنبدأ!
مقدمة – برمجة التطبيق
في الموضوع السابق، لقد قمنا بتصميم شاشتين في التطبيق الخاص بك، الشاشة الرئيسة مع زر يفتح شاشة جديدة عند الضغط عليه.
كما أنشأت شاشة أخرى (شاشة النصائح) تتضمن صورة ونص على شكل تسميات.
ستضيف في هذا الدرس زرًا آخر باسم الأطعمة الصحية (Healthy Foods) في التطبيق الذي أنشأته في الدرس السابق.
إنشاء قائمة
ما المقصود بالقوائم؟
هي نوع من تراكيب البيانات تستخدم لإنشاء وإدارة مجموعات مختلفة من القيم أو العناصر.
أداة منتقي القائمة (List Picker)
لتضمين قائمة في مطور التطبيقات، هناك خطوتان:
- إضافة مكون منتقي القائمة (List Picker).
- إعطاء وظيفة للمكون (Component) عن طريق برمجتها.
ستستخدم هذا الزر في تطبيقك لكي تنشئ قائمة بأصناف الأطعمة.
إضافة قائمة منتقي القائمة (List Picker):
- بدّل شاشة العرض Screen1 (الشاشة الأولى) إلى وضع Designer (المصمم).
- من لوحة User Interface (واجهة المستخدم)، اسحب وأفلت زر القائمة ListPicker (منتقي القائمة) إلى شاشة العرض (مساحة العمل).
- اضغط على Rename (إعادة تسمية).
- اكتب اسمًا لأداة منتقي القائمة وليكن Foods (الأطعمة).
- اضغط على OK (موافق).
- من قسم Properties (الخصائص)، في حقل Text (النص)، اكتب “أطعمة صحية”.
- حدِّد FontBold (الخط الغامق) لجعل النص غامقًا.
لقد صممت القائمة وعليك أن تخصص وظائفها.
لإنشاء قائمة بالعناصر:
- بدّل شاشة العرض Screen1 (الشاشة الأولى) إلى وضع Blocks (اللبنات)، وتأكَّد من تحديد زر القائمة Foods (الأطعمة).
- من لوحة Blocks (اللبنات) اضغط على لبنة (Lists) القوائم.
- اضغط على لبنة make a list (إنشاء قائمة)، ثم اسحبها وأفلتها داخل منطقة البرمجة.
- سيكون الظاهر في المقطع البرمجي فقط فراغين.
- اضغط إشارة “make a list” لإضافة المزيد من العناصر في القائمة.
- اضغط على item (عنصر).
- ثم اسحب العنصر وأفلته تحت لبنة list (قائمة).
- أنشئ 6 عناصر للقائمة.
لإضافة نص لعناصر القائمة:
- من لوحة Blocks (اللبنات) اضغط على قسم لبنات Text (النص).
- اضغط على لبنة A text string “ “ (سلسلة نصية ” “) ثم اسحبها وأفلتها بجوار كل فراغ تحت لبنة make a list (إنشاء قائمة).
- اضغط داخل لبنة A text string “ “ (سلسلة نصية ” “) لكتابة النص.
- اكتب اسم كل أصناف الطعام.
بإمكانك مراجعة محتوى موضوع “برمجة التطبيق” من بدايته وحتى نهاية هذا القسم، من خلال الرابط التالي:
استخدام المتغيرات
ما المقصود بالمتغير؟
موقع تخزين يحتوي على قيمة يمكن أن تتغير أثناء تنفيذ التطبيق.
يمكن استخدام المتغيرات لتخزين مجموعة واسعة من أنواع البيانات بما في ذلك الأرقام أو النصوص أو القوائم.
يمكن تهيئة المتغير بقيمة أولية وتحديثها أثناء تنفيذ التطبيق واستخدامها في العبارات الشرطية للتحكم في سلوك التطبيق.
شروط تسمية المتغيرات:
- يتكون من حروف انجليزية (A…Z) وأرقام والرمز (…)ولا يحتوي على فراغ أو أي رمز آخر.
- لا يبدأ برقم.
- لا يتجاوز (255) حرف.
- لا يكون محجوزًا للغة البرمجة.
هناك نوعان من المتغيرات:
- المتغيرات المحلية Local Variable
هي المتغيرات التي لا يمكن استخدامها إلا داخل لبنة محددة، وتستخدم اللبنة الاتية لإنشاء المتغير المحلي:
في المثال الآتي تم إنشاء متغير محلي اسمه “a” وقيمته 10
- المتغيرات العامة Global Variable
المتغيرات التي يمكن استخدامها أو تغيير قيمتها في أي جزء من التطبيق، وتستخدم اللبنة الآتية لتعريف المتغير العام:
حتى تتمكن من استخدام القائمة الخاصة بك، يجب تعيينها إلى متغير عام.
لتعيين متغير القائمة:
- من لوحة Blocks (اللبنات) اضغط على قسم لبنات variables (المتغيرات).
- لإنشاء متغيِّر عام اضغط على لبنة initialize global name to (تهيئة الاسم العام إلى) ثم اسحبها وأفلتها داخل منطقة البرمجة.
- اضغط داخل الاسم ثم اكتب “Foods” كإسم للمتغيِّر.
- اربط المتغيِّر Foods بالقائمة التي أضفتها سابقًا.
برمجة قائمة الطعام في مطور التطبيقات MIT
عليك أن تنشئ متغيرًا جديدًا وتعيين قيمة محددة له من القائمة لكي تتم عملية اختيار قائمة الأصناف.
ستبرمج الآن قائمة الأطعمة التي أنشأتها، وذلك باستخدام الأوامر الآتية حيث سيتم تفعيل القائمة وتصبح جاهزة للاستخدام.
لعرض القائمة:
- من لوحة Blocks (اللبنات)، اضغط على زر القائمة Foods.
- اضغط على لبنة when Foods.BeforePicking do (عندما تكون الأطعمة.قبل الاختيار) واسحبها وأفلتها في منطقة البرمجة.
- اضغط على لبنة set Foods.Elements to (عين عناصر.الأطعمة إلى) قم اسحبها وأفلتها في لبنة when Foods.BeforePicking to (عندما تكون الأطعمة.قبل الاختيار).
- في لوحة Blocks (اللبنات)، اضغط على قسم Variables (المتغيرات).
- اضغط على لبنة get (احصل على)، واسحبها وأفلتها إلى اللبنة set FoodsElements to (عين عناصر الأطعمة) إلى داخل اللبنة when Foods.BeforePicking do (عندما تكون الأطعمة.قبل الاختيار).
- اضغط على السهم الموجود في لبنة get (احصل على) وحدد global Foods.
عندما تفتح التطبيق في هذه المرحلة على هاتفك الذكي، سترى ما يأتي:
إنشاء شاشة جديدة
بحيث عند اختيار أي عنصر من القائمة “Meat_Filsh”، على سبيل المثال “اللحوم والأسماك” سيتم فتح شاشة جديدة لهذا العنصر.
ستحتوي شاشة اللحوم والأسماك على (meat and fish) على الأدوات الآتية:
- Labels (التسميات).
- Image (الصورة).
ستحتوي هذه الشاشة أيضًا على صورة، سترى في هذه الخطوات كيفية إضافة صورة إلى الشاشة:
لإضافة صورة إلى الشاشة:
- اسحب وأفلت أداة Image (صورة) من لوحة User Interface (واجهة المستخدم) إلى شاشة العرض.
- من Properties (الخصائص) اضغط Picture (صورة) ثم اضغط Upload File (رفع ملف) لتحميل الصورة من الحاسب الخاص بك.
- اضغط Choose File (اختر ملف).
- ستظهر نافذة open (فتح)، اختر الصورة التي تريد إضافتها من الحاسب الخاص بك.
- ثم اضغط Open (فتح).
- ثم اضغط OK (موافق).
- ثم أدرج الصورة.
- من Properties (الخصائص)، حدد Height (الارتفاع) إلى 30percent.
- من Properties (الخصائص)، حدد Width (العرض) إلى 50percent.
بإمكانك مراجعة محتوى موضوع “برمجة التطبيق” بدايةً من عنوان “استخدام المتغيرات” وحتى هذه النقطة، من خلال الرابط التالي:
الآن بعد أن أنشأت شاشة اللحوم والأسماك (Meat and fish)، تحتاج إلى برمجة القائمة لفتح هذه الشاشة عند الضغط على القائمة.
لعرض عنصر من القائمة:
- اختر Screen1 (الشاشة الأولى).
- من لوحة Blocks (اللبنات) اضغط على زر Foods.
- اضغط على لبنة when Foods.AfterPicking do (عندما تكون الأطعمة.بعد الاختيار)، ثم اسحبها وأفلتها داخل منطقة البرمجة.
- من لوحة Blocks (اللبنات)، اضغط قسم لبنات Variables (المتغيرات).
- اضغط لبنة set to (اضبط إلى)، ثم اسحبها وأفلتها داخل لبنة when Foods.AfterPicking do (عندما تكون الأطعمة.بعد الاختيار).
- من لوحة Blocks (اللبنات)، اضغط على زر Foods.
- اضغط على لبنة Elements (عناصر.الأطعمة) ثم اسحبها وأفلتها داخل لبنة when Foods.AfterPicking do (عندما تكون الأطعمة.بعد الاختيار) بجوار اضبط إلى (set to).
- اضغط على السهم بجوار set to (اضبط إلى)، واختر global selection (الاختيار العام).
- اضغط على السهم بجوار Elements (العناصر) واختر Selection (الاختيار).
سيتم تشغيل هذا الحدث بعد اختيار عنصر من القائمة، يُرجع منتقي القائمة (ListPicker) نتائجه والخصائص التي تم ملؤها فيه.
الاختيار
يتم استخدام الجملة الشرطية If then (إذا عندما) لبرمجة عنصر القائمة بحيث يفتح الشاشة المرتبطة به عند الضغط عليه.
إذا ضغطت صنف “اللحوم والأسماك” فيجب فتح الصفحة المقابلة له.
لإضافة تركيب If الشرطي:
- من لوحة Blocks (اللبنات) اضغط على قسم لبنات Control (التحكم).
- اضغط على لبنة if then (إذا)، واسحبها وأفلتها داخل المنطقة البرمجية.
- اضغط على لبنة Logic (المنطقية).
- اسحب وأفلت لبنة = بجانب لبنة if.
- اضغط على لبنة Variables (المتغيرات).
- اسحب وأفلت لبنة get (احصل على) إلى الجزء الأيسر من اللبنة=، واختر global selection (الاختيار العام).
- اضغط على لبنة Text (النص).
- اسحب وأفلت لبنة Text (النص) إلى الجزء الأيمن من اللبنة=.
- اكتب “اللحوم والأسماك” (Meat and Fish).
افتح شاشة جديدة
عند الضغط على عنصر في القائمة، يجب فتح الشاشة المقابلة. على سبيل المثال، إذا ضغطت على خيار اللحوم والأسماك فيجب فتح شاشة اللحوم والأسماك (meat and fish) في التطبيق.
لفتح شاشة جديدة:
- اضغط على قسم لبنات Control (التحكم).
- اسحب وأفلت لبنة open another screen screenName (افتح شاشة أخرى screenName).
- حدد “Meat_Fish”.
- ضع اللبنة الجديدة بجوار لبنة then (ثم).
- اربط لبنة if then (إذا عندما) بلبنة when Foods.AfterPicking do (عندما تكون الأطعمة.بعد الاختيار).
إنشاء قائمة فرعية
تتضمن قائمة الحبوب أصنافًا فرعية، وهذا يعني أنه عند الضغط على قائمة الحبوب الرئيسة يجب فتح قائمة فرعية لتعرض الآتي:
عليك برمجة قائمة جديدة لهذه الأصناف وتعيينها إلى متغير Foods.
ستوضع القائمة داخل لبنة if حيث ستظهر هذه الخيارات عند الضغط على قائمة الحبوب.
لذلك، سيكون الرمز النهائي للقائمة عند الضغط على زر الأطعمة الصحية كما يأتي:
بإمكانك مراجعة محتوى موضوع “برمجة التطبيق” بدايةً من عنوان “عرض عنصر من القائمة” وحتى نهاية هذا القسم، من خلال الرابط التالي:
النشر والتسويق
مجموعة حزمة أندرويد (Android Package Kit)
ما المقصود بحزمة APK الخاصة بالأندرويد؟
هي تنسيق ملف الحزمة الذي يستخدمه نظام التشغيل أندرويد لتوزيع تطبيقات الجوال وتثبيتها مثلما يحدث مع أجهزة الحاسب بنظام ويندوز التي تستخدم الملفات بامتداد .exe
لتثبيت البرامج، يقوم ملف APK بنفس الوظيفة مع نظام أندرويد عندما تحمل APK عبر الإنترنت فأنت في الواقع تحصل على التطبيق.
إذا أصبح تطبيقك جاهز يمكنك إنشاء ملف APK لكي تشاركه مع زملائك.
لمعرفة المزيد من المعلومات عن حزمة تطبيق أندرويد (APK)، قم بالاطّلاع على الرابط التالي:
حزمة تطبيق أندرويد – ويكيبيديا
لفتح شاشة جديدة:
- اضغط على Build (بناء).
- اختر Android App.(apk) (تطبيق أندرويد.(apk)).
- يظهر Progress Bar (شريط التقدم).
- وعند اكتمال الشريط يمكِنك اختيار إما حفظ الملف على جهاز الحاسب الخاص بك.
- أو تقديم رمز الاستجابة السريع QR.
بإمكانك مراجعة محتوى موضوع “برمجة التطبيق” بدايةً من عنوان “النشر والتسويق” وحتى نهاية الموضوع، من خلال الرابط التالي:
اختبر تحصيلك لمحتوى الموضوع من خلال الرابط التالي:
الواجب الإلكتروني
إلى هنا يكون قد انتهى موضوع “برمجة التطبيق“، لا تنسوا مراجعة نواتج التعلُّم أعلى المقال، وانتظرونا في الموضوع القادم!