הוספת גופן כמשאב XML

אפשר לנסות את הדרך של כתיבת הודעה
‫Jetpack Compose היא ערכת הכלים המומלצת לבניית ממשק משתמש ב-Android. איך משתמשים בטקסט בכתיבה.

ב-Android 8.0 (רמת API‏ 26) הושקה תכונה חדשה שנקראת 'גופנים ב-XML'. התכונה הזו מאפשרת להשתמש בגופנים כמשאבים. אפשר להוסיף את הקובץ font בתיקייה res/font/ כדי לארוז גופנים כמשאבים. הגופנים האלה עוברים קומפילציה בקובץ R וזמינים באופן אוטומטי ב-Android Studio. אפשר לגשת למשאבי הגופן באמצעות font סוג המשאב. לדוגמה, כדי לגשת למשאב של גופן, משתמשים ב-@font/myfont או ב-R.font.myfont.

כדי להשתמש בתכונה 'גופנים ב-XML' במכשירים עם Android מגרסה 4.1‏ (רמת API 16) ואילך, צריך להשתמש בספריית התמיכה 26.0. מידע נוסף על השימוש בספריית התמיכה זמין בקטע שימוש בספריית התמיכה.

כדי להוסיף גופנים כמשאבים, מבצעים את השלבים הבאים ב-Android Studio:

  1. לוחצים לחיצה ימנית על התיקייה res ועוברים אל New > Android resource directory (חדש > ספריית משאבים של Android). החלון New Resource Directory מופיע.
  2. ברשימה סוג המשאב, בוחרים באפשרות גופן ואז לוחצים על אישור.

    הערה: שם ספריית המשאבים חייב להיות 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 ובוחרים באפשרות New > Font resource file (חדש > קובץ משאב של גופן). יופיע החלון New Resource File (קובץ משאבים חדש).
  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"/>
  • פותחים את החלון Properties (מאפיינים) כדי להגדיר את הגופן של התג TextView.
    1. בוחרים תצוגה מפורטת כדי לפתוח את החלון מאפיינים.

      הערה: החלון מאפיינים זמין רק כשעורך העיצוב פתוח. בתחתית החלון, לוחצים על הכרטיסייה עיצוב.

    2. מרחיבים את המאפיין textAppearance ואז בוחרים את הגופן מהרשימה fontFamily.
    3. בחירת הגופן מתוך &#39;מאפיינים&#39;

      איור 4. בחירת הגופן בחלון מאפיינים.

בתצוגה המקדימה של הפריסה ב-Android Studio, שמוצגת בחלונית השמאלית ביותר באיור 5, אפשר לראות תצוגה מקדימה של ערכת הגופנים שמוגדרת ב-TextView.

תצוגה מקדימה של גופנים בתצוגה מקדימה של פריסה

איור 5. תצוגה מקדימה של גופנים בתצוגה מקדימה של פריסה.

הוספת גופנים לסגנון

פותחים את קובץ styles.xml ומגדירים את מאפיין fontFamily לקובץ הגופן שרוצים לגשת אליו.

  • <style name="customfontstyle" parent="@android:style/TextAppearance.Small">
        <item name="android:fontFamily">@font/lobster</item>
    </style>
  • שימוש בגופנים באופן פרוגרמטי

    כדי לאחזר גופנים באופן פרוגרמטי, צריך להפעיל את ה-method‏ 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);

    שימוש בספריית התמיכה

    ‫ספריית התמיכה 26.0 תומכת בגופנים ב-XML במכשירים עם Android מגרסה 4.1 (רמת API‏ 16) ואילך.

    הערה: כשמצהירים על משפחות גופנים בפריסת XML דרך ספריית התמיכה, צריך להשתמש במרחב השמות app כדי לוודא שהגופנים נטענים.

    <?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>

    כדי לאחזר גופנים באופן פרוגרמטי, צריך להפעיל את method‏ ResourceCompat.getFont(Context, int) ולספק מופע של Context ואת מזהה המשאב.

    Kotlin

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

    Java

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