إضافة خط كمورد XML

تجربة ميزة "الكتابة"
‫Jetpack Compose هي مجموعة أدوات واجهة المستخدم المُقترَحة لنظام التشغيل Android. تعرَّف على كيفية استخدام النص في ميزة "الإنشاء".

يقدّم نظام التشغيل Android 8.0 (المستوى 26 من واجهة برمجة التطبيقات) الخطوط بتنسيق XML، وهي ميزة تسمح لك باستخدام الخطوط كموارد. يمكنك إضافة ملف font في مجلد res/font/ لتجميع الخطوط كموارد. ويتم تجميع هذه الخطوط في ملف R وتتوفّر تلقائيًا في "استوديو Android". يمكنك الوصول إلى موارد الخط باستخدام نوع المورد font. على سبيل المثال، للوصول إلى مورد خط، استخدِم @font/myfont أو R.font.myfont.

لاستخدام ميزة الخطوط في ملف XML على الأجهزة التي تعمل بالإصدار 4.1 من نظام التشغيل Android (المستوى 16 من واجهة برمجة التطبيقات) والإصدارات الأحدث، يمكنك استخدام الإصدار 26.0 من Support Library. للحصول على مزيد من المعلومات حول استخدام "مكتبة الدعم"، يُرجى الاطّلاع على قسم استخدام مكتبة الدعم.

لإضافة خطوط كموارد، اتّبِع الخطوات التالية في Android Studio:

  1. انقر بزر الماوس الأيمن على المجلد res وانتقِل إلى جديد > دليل موارد Android. تظهر نافذة دليل الموارد الجديد.
  2. في قائمة نوع المورد، اختَر font (خط)، ثم انقر على OK (حسنًا).

    ملاحظة: يجب أن يكون اسم دليل الموارد هو font.

    إضافة دليل موارد الخطوط

    الشكل 1. إضافة دليل موارد الخطوط

  3. أضِف ملفات الخطوط في مجلد font.

    تؤدي بنية المجلد أدناه إلى إنشاء R.font.dancing_script وR.font.lobster و R.font.typo_graphica.

    إضافة ملفات الخطوط في دليل الموارد

    الشكل 2: جارٍ إضافة ملفات الخطوط في دليل res/font.

  4. انقر مرّتين على ملف خط لعرض معاينة لخطوط الملف في المحرِّر. معاينة ملف الخط

    الشكل 3: جارٍ معاينة ملف الخط.

إنشاء مجموعة خطوط

مجموعة الخطوط عبارة عن مجموعة من ملفات الخطوط إلى جانب تفاصيل النمط والوزن. في Android، يمكنك إنشاء عائلة خطوط جديدة كمورد XML والوصول إليها كوحدة واحدة، بدلاً من الإشارة إلى كل نمط ووزن كموارد منفصلة. وبذلك تسمح للنظام باختيار الخط الصحيح استنادًا إلى نمط النص الذي تستخدمه.

لإنشاء مجموعة خطوط، اتّبِع الخطوات التالية في Android Studio:

  1. انقر بزر الماوس الأيمن على مجلد font واختَر جديد > ملف موارد الخط. تظهر نافذة ملف مورد جديد.
  2. أدخِل اسم الملف، ثم انقر على حسنًا. يتم فتح ملف XML الجديد لمصدر الخط في المحرِّر.
  3. احط كل ملف خط ونمط وسمة وزن بعنصر <font>. يوضّح ملف XML التالي كيفية إضافة سمات ذات صلة بالخط في ملف XML الخاص بمصدر الخط:
    <?xml version="1.0" encoding="utf-8"?>
    <font-family xmlns:android="http://schemas.android.com/apk/res/android">
        <font
            android:fontStyle="normal"
            android:fontWeight="400"
            android:font="@font/lobster_regular" />
        <font
            android:fontStyle="italic"
            android:fontWeight="400"
            android:font="@font/lobster_italic" />
    </font-family>
    

استخدام الخطوط في تنسيقات XML

استخدِم خطوطك، سواء كانت ملف خط واحدًا أو خطًا من مجموعة خطوط، في عناصر TextView أو في الأنماط باستخدام سمة fontFamily.

ملاحظة: عند استخدام مجموعة خطوط، يتم تفعيل TextView تلقائيًا حسب الحاجة لاستخدامملفات الخطوط من تلك المجموعة.

إضافة خطوط إلى TextView

لضبط خط لعنصر TextView، نفِّذ أحد الإجراءين التاليين:

  • في ملف XML الخاص بالتنسيق، اضبط السمة fontFamily على ملف الخط الذي تريد الوصول إليه.
    <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:fontFamily="@font/lobster"/>
    
  • افتح نافذة الخصائص لضبط الخط لملف TextView.
    1. اختَر عرضًا لفتح نافذة الخصائص.

      ملاحظة: لا تتوفّر نافذة الخصائص إلا عند فتح محرِّر التصميم. انقر على علامة التبويب التصميم في أسفل النافذة.

    2. وسِّع السمة textAppearance، ثم اختَر الخط من قائمة fontFamily.
    3. تحديد الخط من الخصائص

      الشكل 4. اختيار الخط من نافذة الخصائص

تتيح لك معاينة تنسيق "استوديو Android" التي تظهر في اللوحة بأقصى اليسار في الشكل 5 معاينة الخط المحدّد في TextView.

معاينة الخطوط في معاينة التنسيق

الشكل 5: معاينة الخطوط في معاينة التنسيق

إضافة خطوط إلى نمط

افتح ملف styles.xml واضبط السمة fontFamily لملف الخط الذي تريد الوصول إليه.

  • <style name="customfontstyle" parent="@android:style/TextAppearance.Small">
        <item name="android:fontFamily">@font/lobster</item>
    </style>
    
  • استخدام الخطوط آليًا

    لاسترداد الخطوط آليًا، يمكنك استدعاء الإجراء getFont(int) وتقديم معرّف المورد للخط الذي تريد استرداده. تُعرِض هذه الطريقة عنصرًا من نوع Typeface. على الرغم من أنّ النظام يختار أفضل نمط لك من معلومات الخطوط، يمكنك استخدام الأسلوب setTypeface(android.graphics.Typeface, int) لضبط الخط باستخدام أنماط محدّدة.

    ملاحظة: سيتولى TextView تنفيذ ذلك نيابةً عنك.

    Kotlin

    val typeface = resources.getFont(R.font.myfont)
    textView.typeface = typeface
    

    Java

    Typeface typeface = getResources().getFont(R.font.myfont);
    textView.setTypeface(typeface);
    

    استخدام "مكتبة الدعم"

    تتوافق مكتبة Support Library 26.0 مع الخطوط بتنسيق XML على الأجهزة التي تعمل بالإصدار 4.1 من نظام التشغيل Android (المستوى 16 من واجهة برمجة التطبيقات) والإصدارات الأحدث.

    ملاحظة: عند تعريف مجموعات الخطوط بتنسيق XML من خلال "مكتبة الدعم"، استخدِم مساحة الاسم التطبيق لضمان تحميل الخطوط.

    <?xml version="1.0" encoding="utf-8"?>
    <font-family xmlns:app="http://schemas.android.com/apk/res-auto">
        <font app:fontStyle="normal" app:fontWeight="400" app:font="@font/myfont-Regular"/>
        <font app:fontStyle="italic" app:fontWeight="400" app:font="@font/myfont-Italic" />
    </font-family>
    

    لاسترداد الخطوط آليًا، يمكنك استدعاء الطريقة ResourceCompat.getFont(Context, int) وتقديم مثال على Context ومعرّف المورد.

    Kotlin

    val typeface = ResourcesCompat.getFont(context, R.font.myfont)
    

    Java

    Typeface typeface = ResourcesCompat.getFont(context, R.font.myfont);