Vermeiden Sie gefälschte Schriftarten in Android

Ich bin kürzlich auf das Problem von falschem fettem und kursivem Text gestoßen, wenn ich die Schriftfamilie in der Android-Entwicklung verwendet habe.

In diesem Artikel möchte ich über dieses Problem und seine Lösung sprechen.

Erstellen einer Schriftfamilie

Ab API 26 wurde es möglich, Schriftarten in Familien zu kombinieren.

Eine Schriftfamilie ist eine Sammlung von Schriftdateien mit ihrem Stil und Gewicht.

Sie können eine neue Schriftfamilie als XML-Ressource erstellen und als einzelnes Element bezeichnen, anstatt jeden Stil und jede Gewichtung als separate Ressourcen zu bezeichnen.

Auf diese Weise kann das System die richtige Schriftart basierend auf dem Textstil auswählen, den Sie verwenden möchten.

Beispieldatei:

<?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 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/lobster_regular" />
    <font
        app:fontStyle="italic"
        app:fontWeight="400"
        app:font="@font/lobster_italic" />
</font-family>

Das Attribut fontStylebestimmt den Stil der Schriftart - regulär ( normal) oder kursiv ( italic).

Im Gegenzug fontWeightlegt - das Gewicht fest, auch bekannt als das Gewicht der Schriftart.

Und natürlich fontwird die Schriftart festgelegt, die für das angegebene fontWeightund verwendet wird fontStyle.

Schriftgewicht

Dieser Standard stammt aus der Webentwicklung. Der Wert wird in Schritten von 100 von 100 bis 900 eingestellt.

Die folgende Tabelle entspricht gebräuchlichen Namen für die Sättigung:

, , — 400, — 700.

.

, Android , .

, .

Lobster Two :

, , . , - .

, lobster_two.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/lobster_two_normal" />
    <font
        app:fontStyle="italic"
        app:fontWeight="400"
        app:font="@font/lobster_two_italic" />
    <font
        app:fontStyle="normal"
        app:fontWeight="700"
        app:font="@font/lobster_two_bold" />
    <font
        app:fontStyle="italic"
        app:fontWeight="700"
        app:font="@font/lobster_two_bold_italic" />
</font-family>

, lobster_two_incomplete.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/lobster_two_normal" />
</font-family>

.

lobster_two_incomplete.xml, lobster_two.xml, .

, , .

// 
val typeFace = resources.getFont(R.font.lobster_two)
textView.setTypeface(typeFace, Typeface.BOLD)

//  
textView.typeface = resources.getFont(R.font.lobster_two_bold)

//  
val typeFace = resources.getFont(R.font.lobster_two_incomplete)
textView.setTypeface(typeFace, Typeface.BOLD)

//  
val typeFace = resources.getFont(R.font.lobster_two_normal)
textView.setTypeface(typeFace, Typeface.BOLD)

xml

// 
<TextView
          ...
          android:fontFamily="@font/lobster_two"
          android:textStyle="bold|italic"/>

//  
<TextView
          ...
          android:fontFamily="@font/lobster_two_bold_italic"/>

//  
<TextView
          ...
          android:fontFamily="@font/lobster_two_incomplete"
          android:textStyle="bold|italic"/>

// 
<TextView
          ...
          android:fontFamily="@font/lobster_two"
          android:textStyle="bold"/>

//  
<TextView
          ...
          android:fontFamily="@font/lobster_two_bold"/>

//  
<TextView
          ...
          android:fontFamily="@font/lobster_two_normal"
          android:textStyle="bold"/>