‫Android Kotlin Fundamentals 01.4: تعلَّم كيف تساعد نفسك

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

مقدمة

في هذا الدرس العملي، ستتعرّف على الموارد المفيدة لمطوّري تطبيقات Android بلغة Kotlin، بما في ذلك النماذج والمستندات ومقاطع الفيديو والتطبيقات النموذجية.

ما يجب معرفته

  • سير العمل الأساسي في "استوديو Android"
  • كيفية استخدام "محرِّر التصميم" في "استوديو Android"

أهداف الدورة التعليمية

  • أماكن العثور على معلومات ومراجع للمطوّرين في Kotlin وAndroid
  • كيفية تغيير رمز مشغّل التطبيقات في أحد التطبيقات
  • كيفية طلب المساعدة عند إنشاء تطبيقات Android باستخدام Kotlin

الإجراءات التي ستنفذّها

  • استكشِف بعض المراجع المتاحة لمطوّري تطبيقات Android بلغة Kotlin من جميع المستويات.
  • نزِّل تطبيقًا نموذجيًا على Android مكتوبًا بلغة Kotlin واستكشِفه.
  • تغيير رمز مشغّل تطبيق

في هذا الدرس التطبيقي حول الترميز، ستتعرّف على النماذج والعيّنات والمستندات والموارد الأخرى المتاحة لمطوّري تطبيقات Android بلغة Kotlin.

في البداية، يمكنك إنشاء تطبيق بسيط من نموذج "استوديو Android" وتعديل التطبيق، ثم تنزيل تطبيق Android Sunflower التجريبي واستكشافه. يمكنك استبدال رمز مشغّل التطبيق التجريبي (زهرة عباد الشمس) بأصل صورة قصاصة فنية متوفّر في "استوديو Android" (وجه مبتسم).

يوفّر "استوديو Android" نماذج لتصميمات التطبيقات والأنشطة الشائعة والمقترَحة. توفّر لك النماذج المضمّنة الوقت، وتساعدك في اتّباع أفضل ممارسات التصميم.

يتضمّن كل نموذج نشاطًا أساسيًا وواجهة مستخدم. لقد سبق لك استخدام قالب "نشاط فارغ" في هذه الدورة التدريبية. يحتوي نموذج "النشاط الأساسي" على المزيد من الميزات ويتضمّن ميزات التطبيقات المقترَحة، مثل قائمة الخيارات التي تظهر في شريط التطبيق على الأجهزة التي تعمل بنظام التشغيل Android.

الخطوة 1: استكشاف بنية "النشاط الأساسي"

  1. في "استوديو Android"، أنشئ مشروعًا.
  2. في مربّع الحوار اختيار مشروعك، اختَر نموذج "نشاط أساسي"، ثم انقر على التالي.
  3. في مربّع الحوار ضبط إعدادات مشروعك، يمكنك تسمية التطبيق بالاسم الذي تريده. اختَر Kotlin للغة، ثم ضَع علامة في مربّع الاختيار استخدام عناصر AndroidX. انقر على إنهاء.
  4. أنشئ التطبيق وشغِّله على محاكي أو جهاز يعمل بنظام التشغيل Android.
  5. حدِّد الأجزاء المحدّدة في الشكل والجدول أدناه. ابحث عن المكافئات على شاشة جهازك أو المحاكي. افحص رمز Kotlin وملفات XML المقابلة الموضّحة في الجدول.

سيساعدك التعرّف على رمز المصدر Kotlin وملفات XML في توسيع نموذج "النشاط الأساسي" وتخصيصه لتلبية احتياجاتك.

بنية نموذج "النشاط الأساسي"

#

وصف واجهة المستخدم

مرجع الرمز

1

شريط الحالة الذي يوفّره نظام التشغيل Android ويتحكّم فيه

لا يظهر في رمز النموذج، ولكن يمكنك الوصول إلى شريط الحالة من نشاطك. على سبيل المثال، يمكنك إضافة رمز في MainActivity.kt من أجل إخفاء شريط الحالة، إذا لزم الأمر.

2

يوفّر شريط التطبيق، المعروف أيضًا باسم شريط الإجراءات، بنية مرئية وعناصر مرئية موحّدة وخيارات للتنقّل.

في activity_main.xml، ابحث عن شريط الأدوات

داخل العنصر AppBarLayout. لتحقيق التوافق مع الأنظمة القديمة، يتضمّن AppBarLayout في النموذج Toolbar له الوظيفة نفسها التي يؤديها ActionBar.

لتغيير مظهر شريط التطبيق، غيِّر سمات شريط الأدوات. للاطّلاع على دروس تعليمية حول شريط التطبيقات، يُرجى الانتقال إلى إضافة شريط التطبيقات.

3

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

في AndroidManifest.xml، ابحث عن

android:label="@string/app_name".

حدِّد السلسلة app_name في strings.xml.

4

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

في MainActivity.kt،

تنفِّذ الطريقة onOptionsItemSelected() ما يحدث عندما يختار المستخدم أحد عناصر القائمة.

للاطّلاع على عناصر قائمة الخيارات، افتح res/menu/menu_main.xml

. يتم تحديد عنصر القائمة الإعدادات فقط في هذا النموذج.

5

CoordinatorLayout ViewGroup هو تصميم يوفّر آليات لتفاعل عناصر واجهة المستخدم. تنتقل واجهة مستخدم تطبيقك إلى داخل الملف content_main.xml، الذي يتم تضمينه في ViewGroup.

في activity_main.xml، ابحث عن التعليمات include layout. لم يتم تحديد أي طرق عرض في هذا التصميم، بل يتضمّن التصميم التصميم content_main، حيث يتم تحديد طرق عرض التطبيق. يتم الاحتفاظ بطرق العرض الخاصة بالنظام بشكل منفصل عن طرق العرض الفريدة لتطبيقك.

6

يستخدم النموذج TextView لعرض "Hello World". عليك استبدال TextView بعناصر واجهة مستخدم تطبيقك.

يظهر عرض النص "Hello World" في الملف content_main.xml. يجب تحديد جميع عناصر واجهة المستخدم في تطبيقك في هذا الملف.

7

زر الإجراء العائم (FAB)

في activity_main.xml، ابحث عن العنصر FloatingActionButton. يتم تعريف زر الإجراء العائم على أنّه عنصر في واجهة المستخدم يستخدِم رمزًا من فن قصاصات. يتضمّن MainActivity.kt رمزًا زائفًا في onCreate() يضبط أداة معالجة onClick() لزر الإجراء العائم.

الخطوة 2: تخصيص التطبيق الذي ينتجه النموذج

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

  1. تغيير اسم التطبيق الذي يعرضه شريط التطبيق لتنفيذ ذلك، غيِّر مورد السلسلة app_name في الملف res > values > strings.xml إلى ما يلي:
<string name="app_name">New Application</string>
  1. غيِّر لون شريط التطبيق (Toolbar) في res > layout > activity_main.xml من خلال تغيير السمة android:background إلى "?attr/colorPrimaryDark". تضبط هذه القيمة لون شريط التطبيق على لون أساسي أغمق يتطابق مع شريط الحالة:
android:background="?attr/colorPrimaryDark"
  1. شغِّل التطبيق. سيظهر اسم التطبيق الجديد في شريط الحالة، وسيكون لون خلفية شريط التطبيق أغمق ويتطابق مع لون شريط الحالة. عند النقر على زر الإجراء العائم، يظهر شريط معلومات سريع، كما هو موضّح في الرقم 1 في لقطة الشاشة أدناه.
  2. تغيير نص شريط المعلومات لإجراء ذلك، افتح MainActivity وابحث عن الرمز الأوّلي في onCreate() الذي يضبط أداة معالجة onClick() للزر. غيِّر "Replace with your own action" إلى رمز آخر. على سبيل المثال:
fab.setOnClickListener { view ->
   Snackbar.make(view, "This FAB needs an action!", Snackbar.LENGTH_LONG)
       .setAction("Action", null).show()
}
  1. يستخدم زر الإجراء العائم لون التمييز في التطبيق، لذا إحدى طرق تغيير لون زر الإجراء العائم هي تغيير لون التمييز. لتغيير لون التمييز، افتح الملف res > values > colors.xml وغيِّر السمة colorAccent، كما هو موضّح أدناه. (للحصول على مساعدة في اختيار الألوان، يمكنك الاطّلاع على نظام الألوان في التصميم المتعدد الأبعاد).
<color name="colorAccent">#1DE9B6</color>
  1. شغِّل التطبيق. سيستخدم الزر العائم الجديد اللون الجديد، وسيتم تغيير نص شريط المعلومات.

الخطوة 3: استكشاف كيفية إضافة أنشطة باستخدام النماذج

بالنسبة إلى نماذج التطبيقات في هذه الدورة التدريبية حتى الآن، استخدمت القالبَين "نشاط فارغ" و"نشاط أساسي" لبدء مشاريع جديدة. يمكنك أيضًا استخدام نماذج الأنشطة عند إنشاء أنشطة بعد إنشاء مشروعك.

  1. أنشئ مشروع تطبيق أو اختَر مشروعًا حاليًا.
  2. في لوحة المشروع > Android، انقر بزر الماوس الأيمن على المجلد java.
  3. اختَر جديد > النشاط > معرض الصور.
  4. أضِف نشاطًا إلى التطبيق من خلال اختيار أحد نماذج Activity. على سبيل المثال، اختَر نشاط لوحة التنقّل لإضافة Activity يتضمّن لوحة تنقّل.
  5. لعرض النشاط في أداة تعديل التنسيق، انقر مرّتين على ملف تنسيق النشاط (على سبيل المثال activity_main2.xml). استخدِم علامة التبويب التصميم وعلامة التبويب النص للتبديل بين معاينة تنسيق النشاط ورمز التنسيق.

توفّر مستودعات عيّنات Google على GitHub عيّنات لتعليمات برمجية بلغة Kotlin لنظام التشغيل Android يمكنك دراستها ونسخها ودمجها في مشاريعك.

الخطوة 1: تنزيل عيّنة من تعليمات Kotlin البرمجية لتطبيق Android وتشغيلها

  1. في المتصفّح، انتقِل إلى github.com/googlesamples.
  2. بالنسبة إلى اللغة، اختَر Kotlin.
  3. اختَر تطبيقًا نموذجيًا معدَّلاً حديثًا لنظام Android مكتوبًا بلغة Kotlin ونزِّل رمز مشروع التطبيق. في هذا المثال، نزِّل ملف zip لتطبيق android-sunflower الذي يعرض بعض مكوّنات Android Jetpack.
  4. في "استوديو Android"، افتح مشروع android-sunflower-master.
  5. قبول أي تحديثات يقترحها Android Studio، ثم تشغيل التطبيق على محاكي أو جهاز يعمل بنظام التشغيل Android

الخطوة 2: استكشاف عيّنة تعليمات برمجية لتطبيق Android بلغة Kotlin

بعد فتح تطبيق Sunflower التجريبي لنظام التشغيل Android في "استوديو Android"، تعرَّف على التطبيق واستكشِف ملفات مشروعه.

  1. للحصول على معلومات حول ما يعرضه التطبيق النموذجي، يُرجى الانتقال إلى ملف README الخاص بالتطبيق في GitHub. للاطّلاع على هذا المثال، راجِع ملف Android Sunflower README.
  2. في "استوديو Android"، افتح أحد ملفات أنشطة Kotlin في التطبيق، مثل GardenActivity.kt.
  3. في GardenActivity.kt، ابحث عن فئة أو نوع أو إجراء غير مألوف لديك واطّلِع عليه في مستندات Android Developers. على سبيل المثال، لمعرفة المزيد عن طريقة setContentView()، ابحث في developer.android.com عن setContentView().

الخطوة 3: تغيير رمز مشغّل التطبيق

في هذه الخطوة، ستغيّر رمز مشغّل تطبيق Android Sunflower التجريبي. ستضيف صورة قصاصة فنية وتستخدمها لاستبدال رمز مشغّل تطبيق Android Sunflower الحالي.

رموز مشغّل التطبيقات

يبدأ كل تطبيق تنشئه باستخدام "استوديو Android" برمز تلقائي لمشغّل التطبيقات يمثّل التطبيق. ويُطلق على رموز مشغّل التطبيقات أحيانًا اسم رموز التطبيقات أو رموز المنتجات.

إذا نشرت تطبيقًا على Google Play، سيظهر رمز مشغّل التطبيق في بطاقة بيانات التطبيق ونتائج البحث في "متجر Google Play".

بعد تثبيت تطبيق على جهاز يعمل بنظام التشغيل Android، يظهر رمز مشغّل التطبيقات على الشاشة الرئيسية للجهاز وفي أماكن أخرى على الجهاز. على سبيل المثال، يظهر رمز مشغّل تطبيق Android Sunflower في نافذة البحث عن التطبيقات على الجهاز، كما هو موضّح بالرقم 1 في لقطة الشاشة أدناه. يتم استخدام رمز مشغّل التطبيقات التلقائي، الموضّح بالرقم 2 أدناه، في البداية لجميع مشاريع التطبيقات التي تنشئها في "استوديو Android".

تغيير رمز مشغّل التطبيقات

تتيح لك عملية تغيير رمز المشغّل التعرّف على ميزات مواد عرض الصور في "استوديو Android".

في Android Studio، إليك كيفية تغيير رمز مشغّل تطبيق Android Sunflower:

  1. في لوحة المشروع > Android، انقر بزر الماوس الأيمن (أو Control+انقر) على المجلد res. انقر على جديد > مادة عرض صورة. يظهر مربّع الحوار ضبط مادة عرض الصورة.

انقر على علامة التبويب &quot;الطبقة الأمامية&quot; لرمز المشغّل.

  1. في حقل نوع الرمز، اختَر رموز مشغّل التطبيقات (متكيّفة وقديمة) إذا لم يكن هذا الخيار محدّدًا من قبل. انقر على علامة التبويب الطبقة الأمامية.
  2. بالنسبة إلى نوع مادة العرض، اختَر صور قصاصات فنية، كما هو موضّح بالرقم 1 في لقطة الشاشة أدناه.

  3. انقر على رمز الروبوت في حقل الصور المتحركة، كما هو موضّح بالرقم 2 في لقطة الشاشة أعلاه. يظهر مربّع الحوار اختيار الرمز الذي يعرض مجموعة رموز التصميم المتعدد الأبعاد.
  4. تصفَّح مربّع الحوار اختيار الرمز أو ابحث عن رمز باسمه. اختَر رمزًا، مثل رمز المزاج لاقتراح مزاج جيد. انقر على حسنًا.

  1. في مربّع الحوار ضبط عنصر الصورة، انقر على علامة التبويب طبقة الخلفية. بالنسبة إلى نوع مادة العرض، اختَر اللون. انقر على شريحة اللون واختَر لونًا لاستخدامه كطبقة خلفية للرمز.
  2. انقر على علامة التبويب الإصدار القديم وراجِع الإعدادات التلقائية. أكِّد أنّك تريد إنشاء رموز قديمة ودائرية ورموز "متجر Google Play". بعد ذلك، انقر على التالي.
  3. يظهر مربّع الحوار تأكيد مسار الرمز، الذي يعرض المكان الذي تتم فيه إضافة ملفات الرموز واستبدالها. انقر على إنهاء.
  4. تشغيل التطبيق على محاكي AVD أو جهاز يعمل بنظام التشغيل Android

يضيف Android Studio تلقائيًا صور مشغّل التطبيق إلى أدلة mipmap لكثافات الشاشة المختلفة. يستخدم تطبيق Sunflower على Android الآن رمز قصاصة فنية جديدًا كرمز تشغيل.

  1. تشغيل التطبيق مرة أخرى تأكَّد من ظهور رمز المشغّل الجديد في شاشة "البحث في التطبيقات".

الخطوة 1: استكشاف مستندات Android الرسمية

استكشِف بعضًا من مواقع مستندات Android الأكثر فائدة وتعرَّف على المحتوى المتوفّر فيها:

  1. انتقِل إلى developer.android.com. تحرص Google على تحديث مستندات مطوّري Android الرسمية هذه باستمرار.
  2. انتقِل إلى developer.android.com/design/‎. يقدّم هذا الموقع الإلكتروني إرشادات لتصميم مظهر ووظائف تطبيقات Android عالية الجودة.
  3. انتقِل إلى material.io، وهو موقع إلكتروني حول Material Design. ‫Material Design هي فلسفة تصميم مفاهيمية توضّح كيف يجب أن تبدو جميع التطبيقات، وليس تطبيقات Android فقط، وكيف يجب أن تعمل على الأجهزة الجوّالة. انتقِل إلى الروابط لمعرفة المزيد عن Material Design. على سبيل المثال، للتعرّف على استخدام الألوان، انقر على علامة التبويب تصميم، ثم اختَر اللون.
  4. انتقِل إلى developer.android.com/docs/‎ للعثور على معلومات حول واجهات برمجة التطبيقات والمستندات المرجعية والبرامج التعليمية وأدلة الأدوات وعيّنات الرموز البرمجية.
  5. انتقِل إلى developer.android.com/distribute/‎ للعثور على معلومات حول نشر تطبيق على Google Play. ‫Google Play هو نظام توزيع رقمي من Google للتطبيقات التي تم تطويرها باستخدام حزمة تطوير البرامج (SDK) لنظام التشغيل Android. استخدِم Google Play Console لتوسيع قاعدة المستخدمين وبدء تحقيق الربح.
  1. يمكنك استكشاف قناة "مطوّرو تطبيقات Android" على YouTube، وهي مصدر رائع للبرامج التعليمية والنصائح.
  2. يمكنك الانتقال إلى مدوّنة Android الرسمية، حيث ينشر فريق Android الأخبار والنصائح.
  3. أدخِل سؤالاً في "بحث Google"، وسيجمع محرّك بحث Google النتائج ذات الصلة من مصادر مختلفة. على سبيل المثال، استخدِم "بحث Google" لطرح السؤال "ما هو إصدار نظام التشغيل Android الأكثر رواجًا في الهند؟". يمكنك حتى إدخال رسائل الخطأ في "بحث Google".

الخطوة 3: البحث على Stack Overflow

‫Stack Overflow هو منتدى يضمّ مبرمجين يساعدون بعضهم البعض. إذا واجهت مشكلة، من المحتمل أن يكون أحد المستخدمين قد نشر إجابة عنها.

  1. انتقِل إلى Stack Overflow.
  2. في مربّع البحث، أدخِل سؤالاً، مثل "كيف يمكنني إعداد واستخدام تصحيح أخطاء ADB عبر شبكة Wi-Fi؟" يمكنك البحث على Stack Overflow بدون تسجيل، ولكن إذا أردت نشر سؤال جديد أو الإجابة عن سؤال، عليك التسجيل.
  3. في مربّع البحث، أدخِل [android]. تشير الأقواس [] إلى أنّك تريد البحث عن مشاركات تم وضع علامة عليها للإشارة إلى أنّها تتضمّن معلومات عن Android.
  4. يمكنك الجمع بين العلامات وعبارات البحث لجعل بحثك أكثر تحديدًا. جرِّب عمليات البحث التالية:
  • [android] and [layout]
  • [android] "hello world"

الخطوة 4: استخدام مدير حزمة تطوير البرامج (SDK) لتثبيت المستندات المتوفّرة بلا إنترنت

عند تثبيت "استوديو Android"، يتم تثبيت المكوّنات الأساسية لحزمة تطوير البرامج (SDK) لنظام التشغيل Android معه. لتثبيت المكتبات والوثائق الأخرى المتاحة، استخدِم "أداة إدارة حزمة SDK".

لاستكشاف "أداة إدارة حزمة SDK" وتنزيل مستندات حزمة SDK، اتّبِع الخطوات التالية:

  1. في "استوديو Android"، اختَر الأدوات > مدير حزمة تطوير البرامج (SDK). يتم فتح "أداة إدارة حزمة تطوير البرامج (SDK)".
  2. في العمود الأيمن من "أداة إدارة حزمة تطوير البرامج (SDK)"، اختَر حزمة تطوير البرامج (SDK) لنظام التشغيل Android (1 في لقطة الشاشة أدناه).
  3. دوِّن المسار في الحقل موقع حزمة تطوير البرامج (SDK) لنظام التشغيل Android (2 في لقطة الشاشة أدناه). ستستخدم هذا المسار لاحقًا للعثور على أي شيء تثبّته.
  4. في "مدير حزمة تطوير البرامج (SDK)"، انقر على علامة التبويب منصات حزمة تطوير البرامج (SDK). من هنا، يمكنك تثبيت المزيد من إصدارات نظام التشغيل Android.
  5. انقر على علامة التبويب أدوات حزمة تطوير البرامج (SDK). يمكنك من هنا تثبيت أدوات المطوّرين في حزمة تطوير البرامج (SDK) غير المثبَّتة تلقائيًا. يمكنك أيضًا تثبيت إصدار بلا إنترنت من مستندات مطوّري تطبيقات Android.
  6. انقر على علامة التبويب مواقع إلكترونية لتحديث حزمة تطوير البرامج (SDK). يتحقّق Android Studio من المواقع الإلكترونية المُدرَجة والمحدّدة بانتظام لمعرفة ما إذا كانت هناك تحديثات.
  7. ارجع إلى علامة التبويب أدوات حزمة تطوير البرامج (SDK) وضع علامة في مربّع الاختيار مستندات حزمة تطوير البرامج (SDK) لنظام التشغيل Android، إذا لم يكن محدّدًا من قبل. انقر على تطبيق.

    سيظهر مربّع حوار تأكيد يعرض مقدار مساحة القرص التي يتطلّبها التنزيل. انقر على حسنًا.
  8. عند اكتمال التثبيت، انقر على إنهاء.

للعثور على المستندات التي ثبّتها، اتّبِع الخطوات التالية:

  1. على جهاز الكمبيوتر، انتقِل إلى الدليل Android/sdk/. (للعثور على مسار الدليل، اطّلِع على حقل موقع حزمة تطوير البرامج (SDK) لنظام التشغيل Android، الموضّح بالرقم 2 في لقطة الشاشة أعلاه).
  2. افتح مجلد docs/.
  3. ابحث عن ملف index.html وافتحه في متصفّح.
  • يمكنك الاطّلاع على مستندات مطوّري تطبيقات Android الرسمية على developer.android.com.
  • ‫Material Design هي فلسفة تصميم مفاهيمية تحدّد كيفية ظهور التطبيقات وعملها على الأجهزة الجوّالة. لا يقتصر استخدام Material Design على تطبيقات Android فقط. يمكنك الاطّلاع على إرشادات Material Design على material.io.
  • يوفّر "استوديو Android" نماذج لتصميمات التطبيقات والأنشطة الشائعة والمقترَحة. تقدّم هذه النماذج رمزًا برمجيًا صالحًا لحالات الاستخدام الشائعة.
  • عند إنشاء مشروع، يمكنك اختيار نموذج لنشاطك الأول.
  • أثناء تطوير تطبيقك، يمكنك إنشاء أنشطة ومكوّنات أخرى للتطبيق من النماذج المضمّنة.
  • يحتوي Google Samples على عيّنات من التعليمات البرمجية يمكنك دراستها ونسخها ودمجها في مشاريعك.

دورة Udacity التدريبية:

مستندات "استوديو Android":

مستندات مطوّري تطبيقات Android:

عيّنات التعليمات البرمجية:

فيديوهات:

مراجع أخرى:

ابدأ الدرس التالي: ‫2.1: التنسيق الخطي باستخدام "أداة تخطيط واجهة المستخدم"

للحصول على روابط تؤدي إلى دروس تطبيقية أخرى في هذه الدورة التدريبية، اطّلِع على الصفحة المقصودة الخاصة بالدروس التطبيقية حول أساسيات Android Kotlin.