Kotlin Android Fundamentals 10.1: الأنماط والمظاهر

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

مقدمة حول التصميم

يركّز التركيز في هذه السلسلة من الدروس التطبيقية على الترميز من أحد أهم جوانب تطوير Android، وتصميم التطبيقات. تتمثل الجوانب الواضحة لتصميم التطبيق في طرق العرض والنصوص والأزرار، ومكان عرضها على الشاشة، بالإضافة إلى الألوان والخطوط التي تستخدمها. تُعدّ تلميحات للمستخدم حول الإجراءات التي يجب اتخاذها كخطوة تالية من الجوانب الأساسية للتصميم. ويجب أن يتمكّن المستخدمون من إخبارهم بنظرة سريعة عن طبيعة المحتوى الذي يهمّهم، والاطّلاع على العوامل المهمة، والإجراءات التي يمكنهم اتخاذها.

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

هناك مستوى آخر من التصميم، وهو إنشاء تدفقات مترابطة للمستخدمين، أو حالات الاستخدام، التي تتيح للمستخدمين إنجاز المهام. ويُطلق على هذا الشكل من التصميم اسم تصميم تجربة المستخدم (UXD)، ويتخصص بعض المصممين فيه.

إذا لم يكن لديك حق الوصول إلى مصمّم، إليك بعض النصائح للبدء:

  • تحديد حالات الاستخدام. اكتب ما يجب على المستخدمين إنجازه باستخدام تطبيقك، وكيفية ذلك.
  • تنفيذ تصميم. لا تُرفق بمسودتك الأولى، وتجعلها "&جيدة بما يكفي"؛ لأنك ستغيّرها بعد أن ترى كيفية تفاعل المستخدمين الحقيقيين معها.
  • إرسال ملاحظات ابحث عن أي شخص يمكنك التحدث معه لاختبار تطبيقك، مثل العائلة أو الأصدقاء أو حتى الأشخاص الذين قابلتهم للتو في مجموعة مطوّري برامج Google. اطلب منهم استخدام تطبيقك لتنفيذ حالة استخدام أثناء المشاهدة وتدوين الملاحظات التفصيلية.
  • تحسين بفضل هذه المعلومات، يمكنك تحسين التطبيق ثم اختباره مرة أخرى.

في ما يلي بعض الأسئلة الأخرى التي يجب طرحها على نفسك عند تصميم تجربة تطبيق رائعة. لقد تعلمت أساليب التعامل مع هذه المشاكل في الدروس التطبيقية السابقة للترميز:

  • هل يفقد التطبيق حالته عندما يُدير المستخدم جهازه؟
  • ماذا يحدث عندما يفتح المستخدم التطبيق؟ هل يظهر للمستخدم مؤشر سريان التحميل، أو هل البيانات جاهزة في ذاكرة تخزين مؤقت بلا اتصال بالإنترنت؟
  • هل تم ترميز التطبيق بطريقة فعّالة وتضمن أن التطبيق يستجيب دائمًا للمس المستخدم؟
  • هل يتفاعل التطبيق مع أنظمة الخلفية بطريقة لا تؤدي مطلقًا إلى عرض بيانات غريبة أو غير صحيحة أو قديمة للمستخدم؟

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

  • يتفاعل العديد من المستخدمين مع أنظمة الكمبيوتر بطرق مختلفة. فقد يعاني العديد من المستخدمين من عمى الألوان، بينما قد لا تعمل الألوان المتباينة من مستخدم لآخر. يواجه العديد من المستخدمين عجز في الرؤية، من الحاجة إلى نظارات القراءة وصولاً إلى فقدان البصر.
  • لا يمكن لبعض المستخدمين استخدام الشاشات التي تعمل باللمس، كما أنهم يتفاعلون عبر أجهزة الإدخال الأخرى مثل الأزرار.

يُعدّ التصميم الجيد هو أهم طريقة لتشجيع المستخدمين على استخدام تطبيقك.

هذه الدروس التطبيقية حول الترميز قصيرة جدًا لكي تُطلعك على كل ما يتعلق بالتصميم المتوافق مع Android، ولكنها ستساعدك في بدء الدورة التدريبية بطريقة جيدة، ويمكنك مواصلة التعلّم والتطوير بنفسك.

ما يجب معرفته

ويجب أن تكون على دراية بما يلي:

  • كيفية إنشاء تطبيقات تتضمّن أنشطة وأجزاء والتنقّل بين الأجزاء التي تمرِّر البيانات
  • استخدام الملفات الشخصية وعروض المجموعات لوضع واجهة مستخدم (UI)، بما في ذلك RecyclerView
  • كيفية استخدام"عناصر البنية"، بما في ذلك ViewModel، مع البنية الموصى بها لإنشاء تطبيق منظّم بشكل جيد وفعّال
  • ربط البيانات والكوروتينات وكيفية التعامل مع النقرات
  • كيفية الاتصال بالإنترنت وبيانات ذاكرة التخزين المؤقت محليًا باستخدام قاعدة بيانات Room
  • كيفية ضبط مواقع الملف الشخصي
  • كيفية استخراج الموارد واستخدامها من ملفات موارد XML

ما ستتعرَّف عليه

  • أساسيات نظام التصميم في Android
  • كيفية استخدام السمات والأنماط والمظاهر لتخصيص تطبيقك

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

  • تحسين تصميم تطبيق إجراء المبتدئين باستخدام سمات الملف الشخصي والأنماط والمظاهر

يعتمد تطبيق G-G-finder للمبتدئين على كل ما تعلمته حتى الآن في هذه الدورة التدريبية.

يستخدم التطبيق ConstraintLayout لوضع ثلاث شاشات. شاشتان ليستا سوى ملفات تنسيق ستستخدمها لاستكشاف الألوان والنصوص على Android.

أمّا الشاشة الثالثة، فهي عبارة عن أداة للبحث عن ملفات GDG. مجموعات GDG أو "مجموعات مطوّري برامج Google" هي منتديات مطوّري البرامج التي تركّز على تقنيات Google، بما في ذلك Android. تستضيف مجموعات GDG حول العالم لقاءات ومؤتمرات وأغاني دراسية وغير ذلك من الأحداث.

بينما تعمل على تطوير هذا التطبيق، فإنك تعمل على القائمة الحقيقية لمجموعات GDG. تستخدم شاشة الباحث موقع الجهاز لفرز مجموعات GDG حسب المسافة.

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

تعرض لقطات الشاشة أدناه كيفية تغيير تطبيقك من البداية إلى نهاية هذا الدرس التطبيقي حول الترميز.

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

عرض السمات

  • استخدِم سمات الملف الشخصي لضبط السمات صراحةً لكل ملف شخصي. (لا يمكن استخدام سمات العرض، تمامًا كما هي الأنماط).
  • يمكنك استخدام كل موقع يمكن ضبطه من خلال الأنماط أو المظاهر.

استخدم للتصميمات المخصصة أو لمرة واحدة مثل الهوامش أو المساحة المتروكة أو القيود.

Styles

  • استخدِم نمطًا لإنشاء مجموعة من معلومات الأنماط القابلة لإعادة الاستخدام، مثل حجم الخط أو ألوانه.
  • مناسب للإعلان عن مجموعات صغيرة من التصميمات الشائعة المستخدمة في تطبيقك.

يمكنك تطبيق نمط على عدة طرق عرض، بحيث يتم إلغاء النمط التلقائي. على سبيل المثال، استخدم نمطًا لإنشاء عناوين ذات أنماط محددة أو مجموعة من الأزرار.

النمط التلقائي

  • وهذا هو النمط التلقائي الذي يوفّره نظام Android.

التصميمات

  • استخدِم مظهرًا لتحديد ألوان تطبيقك بالكامل.
  • استخدِم مظهرًا لضبط الخط التلقائي للتطبيق بالكامل.
  • تسري على جميع طرق العرض، مثل طرق عرض النصوص أو أزرار الاختيار.
  • ويجب استخدامها لضبط المواقع التي يمكنك تطبيقها باستمرار على التطبيق بالكامل.

مظهر النص

  • للتصميم باستخدام سمات نصية فقط، مثل fontFamily.

عندما يضبط Android طريقة عرض، يُطبق مزيج من المظاهر والأنماط والسمات، والتي يمكنك تخصيصها. تحل السمات دائمًا محل أي عنصر محدد في نمط أو مظهر. وتستبدل الأنماط دائمًا أي عنصر محدّد في المظهر.

تعرض لقطات الشاشة أدناه تطبيق GDG-finder ذي المظهر الفاتح (يسار) ومظهر داكن (على اليمين)، بالإضافة إلى خط مُخصَّص وأحجام عناوين. ويمكن تنفيذ ذلك بطرق متعددة، وستتعرّف على بعضها في هذا الدرس التطبيقي حول الترميز.

في هذه المهمة، يمكنك استخدام السمات لنمط العناوين لنص في تنسيق التطبيق.

  1. نزِّل تطبيق بدء استخدام GDG-finder.
  2. ملاحظة: تحتوي الشاشة الرئيسية على الكثير من النصوص ذات التنسيق الموحّد، ما يجعل من الصعب معرفة موضوع الصفحة وما هو مهم.
  3. افتح ملف التنسيق home_fragment.xml.
  4. لاحِظ أن التنسيق يستخدم ConstraintLayout لتحديد موضع العناصر داخل ScrollView.
  5. لاحظ أنه بالنسبة إلى كل ملف شخصي، يتم تعيين سمات حد القيد والهوامش في الملف الشخصي، نظرًا لأنه يتم تخصيص هذه السمات لكل عرض وشاشة.
  6. في طريقة عرض النص title، أضِف السمة textSize لتغيير حجم النص إلى 24sp.

    كتذكير، يشير sp إلى وحدات البكسل غير المرتبطة بالمقياس، والتي يتم قياسها حسب كل من كثافة البكسل وتفضيل حجم الخط الذي يحدّده المستخدم في إعدادات الجهاز. يحدّد نظام التشغيل Android حجم النص الذي يجب أن يظهر على الشاشة عند رسم النص. استخدام sp دائمًا لأحجام النص.
<TextView
       android:id="@+id/title"
...

android:textSize="24sp"
  1. اضبُط textColor من عرض النص title على اللون الرمادي الغامق، عن طريق ضبطه على قيمة ARGB بقيمة #FF555555.
<TextView
       android:id="@+id/title"
...

android:textColor="#FF555555"
  1. لفتح علامة التبويب معاينة في "استوديو Android"، اختَر عرض &gt؛ أداة Windows &gt؛ معاينة، أو انقر على زر المعاينة الرأسي على الحافة اليسرى من "محرر التنسيق". في المعاينة، تأكّد من أنّ العنوان بلون رمادي وأكبر مما كان عليه من قبل، كما هو موضّح أدناه.

  1. عدِّل نمط الترجمة للحصول على لون العنوان نفسه، باستخدام خط أصغر، وهو 18sp. (الإصدار الأولي التلقائي هو FF، غير شفاف. ويمكنك حذف قيمة ألفا إذا لم تغيرها.)
<TextView
       android:id="@+id/subtitle"
...
android:textSize="18sp"
android:textColor="#555555"

  1. وفي هذا الدرس التطبيقي حول الترميز، يهدف التطبيق إلى تصميم التطبيق بحيث يكون مميّزًا بعض الشيء مع الحفاظ على مظهر احترافي، ولكن يمكنك تصميم التطبيق بالطريقة التي تريدها. جرِّب السمات التالية لعرض النص subtitle. استخدم علامة التبويب معاينة لمعرفة كيفية تغير مظهر تطبيقك. ثم أزِل هذه السمات.
<TextView
       android:id="@+id/subtitle"
       ...
       android:textAllCaps="true"
       android:textStyle="bold"
       android:background="#ff9999"
  1. لا تنسَ التراجع عن سمات textAllCaps وtextStyle وbackground من طريقة العرض subtitle قبل المتابعة.
  2. شغِّل تطبيقك، ومن المفترض أن يظهر لك بشكل أفضل.

عند استخدام الخطوط مع تطبيقك، يمكنك شحن ملفات الخطوط الضرورية كجزء من حزمة APK. وعلى الرغم من بساطة هذا الحل، لا يُنصح به عادةً، لأن ذلك يجعل تطبيقك يستغرق وقتًا أطول للتنزيل والتثبيت.

يتيح نظام التشغيل Android للتطبيقات تنزيل الخطوط في وقت التشغيل باستخدام واجهة برمجة التطبيقات القابلة للتنزيل للخطوط. إذا كان تطبيقك يستخدم الخط نفسه الذي يستخدمه تطبيق آخر على الجهاز، ينزّل نظام التشغيل Android الخط مرة واحدة فقط، ما يؤدي إلى توفير مساحة التخزين على الجهاز.

في هذه المَهمّة، يمكنك استخدام الخطوط القابلة للتنزيل لتحديد خط كل عرض في تطبيقك يستخدم المظهر.

الخطوة 1: تطبيق خط قابل للتنزيل

  1. افتح home_fragment.xml في علامة التبويب تصميم.
  2. في جزء شجرة المكوّنات، اختَر عرض النص title.
  3. في جزء السمات، ابحث عن السمة fontFamily. يمكنك العثور عليه في قسم جميع السمات، أو يمكنك البحث عنه فقط.
  4. انقر على سهم القائمة المنسدلة.
  5. انتقِل إلى مزيد من الخطوط واختَره. ستفتح نافذة الموارد.

  1. في نافذة الموارد، ابحث عن lobster، أو lo فقط.
  2. في النتائج، اختَر الكركن الثاني.
  3. على يسار الصفحة، انقر على زر الاختيار إنشاء خط قابل للتنزيل تحت اسم الخط. انقر على حسنًا.
  4. افتح ملف بيان Android.
  5. بالقرب من أسفل البيان، ابحث عن العلامة <meta-data> الجديدة مع ضبط السمتَين name وresource على "preloaded_fonts". توجِّه هذه العلامة "خدمات Google Play" إلى أن هذا التطبيق يريد استخدام الخطوط التي تم تنزيلها. عند تشغيل تطبيقك وطلب خط "الكنستر" الثاني، ينزّل مقدّم الخط الخط من الإنترنت، إذا لم يكن الخط متاحًا على الجهاز.
<meta-data android:name="preloaded_fonts" android:resource="@array/preloaded_fonts"/>
  1. في مجلد res/values، ابحث عن الملف preloaded_fonts.xml الذي يحدّد المصفوفة التي تعرض جميع الخطوط القابلة للتنزيل لهذا التطبيق.
  2. وبالمثل، يحتوي ملف res/fonts/lobster_two.xml على معلومات حول الخط.
  3. افتح home_fragment.xml ولاحظ في الرمز وعايِن أنه يتم تطبيق خط "الكركن الثاني" على title TextView، وبالتالي يتم تطبيقه على العنوان.

  1. افتح res/values/styles.xml وافحص مظهر AppTheme التلقائي الذي تم إنشاؤه للمشروع. تظهر الصورة حاليًا على النحو الموضّح أدناه. لتطبيق خط "الكركن 2" الجديد على كل النص، ستحتاج إلى تعديل هذا المظهر.
  2. في العلامة <style>، لنلاحظ السمة parent. يمكن أن تحدد كل علامة نمط نمطًا رئيسيًا وتكتسب جميع سمات العنصر الرئيسي. ويحدّد الرمز Theme التي تحدّدها مكتبات Android. مظهر MaterialComponents يحدِّد كل شيء، بدءًا من آلية عمل الأزرار وصولاً إلى كيفية رسم أشرطة الأدوات يحتوي المظهر على إعدادات تلقائية معقولة، لذا يمكنك تخصيص الأجزاء التي تريدها فقط. يستخدم التطبيق الإصدار Light من هذا المظهر بدون شريط الإجراءات (NoActionBar)، كما هو موضّح في لقطة الشاشة أعلاه.
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
   <!-- Customize your theme here. -->
   <item name="colorPrimary">@color/colorPrimary</item>
   <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
   <item name="colorAccent">@color/colorAccent</item>
</style>
  1. ضمن النمط AppTheme، اضبط مجموعة الخطوط على lobster_two. يجب ضبط كل من android:fontFamily وfontFamily، لأن المظهر الرئيسي يستخدم كليهما. يمكنك الاطّلاع على home_fragment.xml في علامة التبويب تصميم لمعاينة التغييرات.
<style name="AppTheme"  
...    
        <item name="android:fontFamily">@font/lobster_two</item>
        <item name="fontFamily">@font/lobster_two</item>
  1. شغِّل التطبيق مرة أخرى. يتم تطبيق الخط الجديد على كل النص. افتح لائحة التنقل وانتقل إلى الشاشات الأخرى، وسترى أن الخط قد تم تطبيقه هناك أيضًا.

الخطوة 2: تطبيق المظهر على العنوان

  1. في home_fragment.xml، ابحث عن طريقة عرض النص title التي تتضمن سمة الخط lobster_two. حذف السمة fontFamily وتشغيل التطبيق لأنّ المظهر يضبط مجموعة الخطوط نفسها، ليس هناك أي تغيير.
  2. يجب إعادة سمة fontFamily مختلفة إلى عرض النص title:
    app:fontFamily="serif-monospace"
    يجب التأكّد من أنّها متوفّرة في مساحة app.
<TextView
       android:id="@+id/title"
       ...
       app:fontFamily="serif-monospace"
  1. شغِّل التطبيق وسترون أن السمة المحلية في الملف الشخصي تلغي المظهر.
  1. إزالة السمة fontFamily من عرض النص title

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

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

الخطوة 1: إنشاء نمط

  1. فتح res/values/styles.xml
  2. داخل العلامة <resources>، حدِّد نمطًا جديدًا باستخدام العلامة <style> على النحو الموضّح أدناه.
<style name="TextAppearance.Title" parent="TextAppearance.MaterialComponents.Headline6">
</style>

من المهم التفكير في أسماء الأنماط كدلالية عند تسميتها. اختَر اسم نمط استنادًا إلى الغرض من استخدام النمط، وليس استنادًا إلى الخصائص التي يؤثر عليها النمط. على سبيل المثال، يمكنك تسمية هذا النمط Title، وليس مثل LargeFontInGrey. سيتم استخدام هذا النمط من خلال أي عنوان في أي مكان في تطبيقك. وكاصطلاح، يُطلق على أنماط TextAppearance اسم TextAppearance.Name، وبالتالي يكون الاسم في هذه الحالة TextAppearance.Title.

يحتوي النمط على أصل، تمامًا مثل المظهر الرئيسي. ولكن هذه المرة، بدلاً من تمديد مظهر، يمتد النمط إلى النمط TextAppearance.MaterialComponents.Headline6. هذا النمط هو نمط النص التلقائي للمظهر MaterialComponents، لذلك من خلال تمديده، يتم تعديل النمط التلقائي بدلاً من البدء من البداية.

  1. داخل النمط الجديد، حدّد عنصرين. في عنصر واحد، اضبط textSize على 24sp. وفي السلعة الأخرى، اضبط textColor على اللون الرمادي الداكن نفسه الذي تم استخدامه من قبل.
 <item name="android:textSize">24sp</item>
 <item name="android:textColor">#555555</item>
  1. حدد نمطًا آخر للعناوين الفرعية. يمكنك تسميته TextAppearance.Subtitle.
  2. بما أن الفرق الوحيد من TextAppearance.Title سيكون في حجم النص، اجعل هذا النمط ثانويًا لـ TextAppearance.Title.
  3. داخل النمط Subtitle، اضبط حجم النص على 18sp. إليك النمط المكتمل:
<style name="TextAppearance.Subtitle" parent="TextAppearance.Title" >
   <item name="android:textSize">18sp</item>
</style>

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

  1. في home_fragment.xml، أضِف TextAppearance.نمط واحد (Title) في طريقة عرض النص title حذف السمتَين textSize وtextColor

    تلغي المظاهر أي نمط تم ضبطه على TextAppearance. (يوضّح الرسم البياني الهرمي في بداية الدرس التطبيقي كيفية تطبيق النمط.) استخدِم السمة textAppearance لتطبيق النمط على أنه TextAppearance بحيث يلغي الخط الذي تم ضبطه في Theme ما تم ضبطه هنا.
<TextView
       android:id="@+id/title"
       android:textAppearance="@style/TextAppearance.Title"
  1. يمكنك أيضًا إضافة النمط TextAppearance.Subtitle إلى طريقة عرض النص subtitle، وحذف السمتَين textSize وtextColor. عليك تطبيق هذا النمط على شكل textAppearance أيضًا، حتى يلغي الخط الذي تم ضبطه في المظهر ما ضبطته هنا.
<TextView
       android:id="@+id/subtitle"
       android:textAppearance="@style/TextAppearance.Subtitle"
  1. شغِّل التطبيق وقد تم تصميم النص بشكل منتظم.

مشروع "استوديو Android": GDGFinderStyles.

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

  • حدّد الأنماط في ملف مورد styles.xml باستخدام علامات <style> و<item>.
<style name="TextAppearance.Subtitle" parent="TextAppearance.Title" >
   <item name="android:textSize">18sp</item>
</style>

يتيح استخدام الخطوط القابلة للتنزيل الخطوط المتاحة للمستخدمين بدون زيادة حجم حزمة APK. لإضافة خط قابل للتنزيل لأحد الملفات الشخصية:

  1. اختَر طريقة العرض في علامة تبويب التصميم، واختَر مزيد من الخطوط من القائمة المنسدلة للسمة fontFamily.
  2. في مربع حوار الموارد، ابحث عن خط وحدد زر الاختيار إنشاء خط قابل للتنزيل.
  3. تحقَّق من أنّ بيان Android يتضمن علامة بيانات وصفية للخطوط التي تم تحميلها مسبقًا.

عندما يطلب التطبيق خطًا لأول مرة، ولا يكون الخط متاحًا، ينزّله مقدّم الخط من الإنترنت.

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

مراجع أخرى:

يسرد هذا القسم المهام الدراسية المحتملة للطلاب الذين يعملون من خلال هذا الدرس التطبيقي حول الترميز في إطار دورة تدريبية يُديرها معلِّم. يجب أن ينفِّذ المعلّم ما يلي:

  • يمكنك تخصيص واجب منزلي إذا لزم الأمر.
  • التواصل مع الطلاب بشأن كيفية إرسال الواجبات المنزلية
  • وضع درجات للواجبات المنزلية.

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

إذا كنت تستخدم هذا الدرس التطبيقي بنفسك، يمكنك استخدام هذه الواجبات المنزلية لاختبار معلوماتك.

الإجابة عن هذه الأسئلة

السؤال 1

ما العلامة التي يتم استخدامها لتحديد المظاهر؟

<style>

<theme>

<meta-tag>

<styling>

السؤال 2

أي مما يلي لا يُعتبر استخدامًا جيدًا للأنماط؟

▢ حدِّد قيود الملف الشخصي.

▢ حدِّد لون خلفية العناوين.

▢ توحيد حجم الخط عبر طرق العرض.

▢ تحديد لون النص لمجموعة من طرق العرض

السؤال 3

ما الفرق بين المظاهر والأنماط؟

▢تنطبق المظاهر على التطبيق بالكامل، بينما يمكنك تطبيق الأنماط على ملفات شخصية محدّدة.

▢ لا يمكن أن تكتسب المظاهر من مظاهر أخرى، لكن يمكن أن تكتسب أنماطًا من أنماط أخرى.

▢ لا يمكن أن تكتسب الأنماط من أنماط أخرى، ولكن يمكن أن تكتسب المظاهر من مظاهر أخرى.

▢ يوفّر نظام Android المظاهر، بينما يحدّد مطوّر البرامج الأنماط.

السؤال 4

إذا كانت TextView في تطبيقك تحتوي على Theme ضبط حجم الخط على 12sp ونمط محدّد يتم ضبطه على 14sp وسمة fontSize على 16sp، ما حجم الخط المعروض على الشاشة؟

12sp

14sp

16sp

18sp

بدء الدرس التالي: 10.2: التصميم المتعدد الأبعاد وتعتيم الشاشة والألوان

وللحصول على روابط إلى دروس تطبيقية أخرى حول الترميز في هذه الدورة التدريبية، يُرجى الاطّلاع على الصفحة المقصودة لتطبيق الدروس التطبيقية حول الترميز Kotlin Fundamentals.