फ़ॉन्ट के साथ काम करें

इस पेज पर, Compose ऐप्लिकेशन में फ़ॉन्ट सेट करने का तरीका बताया गया है.

फ़ॉन्ट सेट करें

Text में fontFamily पैरामीटर है, जो इसमें इस्तेमाल किए जाने वाले फ़ॉन्ट को सेट करने की अनुमति देता है कंपोज़ेबल. डिफ़ॉल्ट रूप से, सेरिफ़, सैन्स-सेरिफ़, मोनोस्पेस, और कर्सिव फ़ॉन्ट फ़ैमिली शामिल होती हैं:

@Composable
fun DifferentFonts() {
    Column {
        Text("Hello World", fontFamily = FontFamily.Serif)
        Text("Hello World", fontFamily = FontFamily.SansSerif)
    }
}
TextSnippets.kt

शब्द

res/font फ़ोल्डर में तय किए गए कस्टम फ़ॉन्ट और टाइपफ़ेस के साथ काम करने के लिए, fontFamily एट्रिब्यूट का इस्तेमाल किया जा सकता है:

रिज़ॉल्यूशन का ग्राफ़िकल इलस्ट्रेशन > डेवलपमेंट एनवायरमेंट में फ़ॉन्ट फ़ोल्डर

इस उदाहरण में बताया गया है कि उन फ़ॉन्ट के आधार पर fontFamily को कैसे परिभाषित किया जाएगा फ़ाइलें ढूंढने और Font फ़ंक्शन का इस्तेमाल करने के लिए:

val firaSansFamily = FontFamily(
    Font(R.font.firasans_light, FontWeight.Light),
    Font(R.font.firasans_regular, FontWeight.Normal),
    Font(R.font.firasans_italic, FontWeight.Normal, FontStyle.Italic),
    Font(R.font.firasans_medium, FontWeight.Medium),
    Font(R.font.firasans_bold, FontWeight.Bold)
)
TextSnippets.kt

इस fontFamily को अपने Text कॉम्पोज़ेबल में पास किया जा सकता है. क्योंकि एक fontFamily में अलग-अलग वज़न शामिल किए जा सकते हैं. आप fontWeight को मैन्युअल तरीके से अपने टेक्स्ट के लिए सही वज़न चुनें:

Column {
    Text(text = "text", fontFamily = firaSansFamily, fontWeight = FontWeight.Light)
    Text(text = "text", fontFamily = firaSansFamily, fontWeight = FontWeight.Normal)
    Text(
        text = "text",
        fontFamily = firaSansFamily,
        fontWeight = FontWeight.Normal,
        fontStyle = FontStyle.Italic
    )
    Text(text = "text", fontFamily = firaSansFamily, fontWeight = FontWeight.Medium)
    Text(text = "text", fontFamily = firaSansFamily, fontWeight = FontWeight.Bold)
}
TextSnippets.kt

शब्द

अपने पूरे ऐप्लिकेशन में टाइपोग्राफ़ी को सेट करने का तरीका जानने के लिए, Compose में अपनी पसंद के मुताबिक डिज़ाइन सिस्टम बनाना लेख पढ़ें.

ऐसे फ़ॉन्ट जिन्हें डाउनलोड किया जा सकता है

Compose में शुरू हो रहा है 1.2.0 आप डाउनलोड करने योग्य Font API का इस्तेमाल करके, Compose ऐप्लिकेशन में Google फ़ॉन्ट एसिंक्रोनस रूप से इस्तेमाल करें और अपने ऐप्लिकेशन में उनका इस्तेमाल करें.

फ़िलहाल, कस्टम फ़ॉन्ट उपलब्ध कराने वाली कंपनियों के डाउनलोड किए जा सकने वाले फ़ॉन्ट इस्तेमाल करने की सुविधा उपलब्ध नहीं है.

प्रोग्राम के हिसाब से, डाउनलोड किए जा सकने वाले फ़ॉन्ट इस्तेमाल करना

अपने ऐप्लिकेशन में प्रोग्राम के हिसाब से फ़ॉन्ट डाउनलोड करने के लिए, यह तरीका अपनाएं:

  1. डिपेंडेंसी जोड़ें:
    GroovyKotlin
    dependencies {
    ...
    implementation "androidx.compose.ui:ui-text-google-fonts:1.7.8"
}
    dependencies {
    ...
    implementation("androidx.compose.ui:ui-text-google-fonts:1.7.8")
}
  2. Google Fonts के क्रेडेंशियल का इस्तेमाल करके, GoogleFont.Provider को शुरू करें: 
    val provider = GoogleFont.Provider(
    providerAuthority = "com.google.android.gms.fonts",
    providerPackage = "com.google.android.gms",
    certificates = R.array.com_google_android_gms_fonts_certs
)
    TextDownloadableFontsSnippets.kt
     सेवा देने वाली कंपनी को ये पैरामीटर मिलते हैं:
    • Google Fonts के लिए फ़ॉन्ट देने वाली कंपनी.
    • फ़ॉन्ट उपलब्ध कराने वाली कंपनी की पहचान की पुष्टि करने के लिए, फ़ॉन्ट उपलब्ध कराने वाली कंपनी का पैकेज.
    • सर्टिफ़िकेट की पहचान की पुष्टि करने के लिए, हैश के सेट की सूची कंपनी. Google Fonts की सेवा देने वाली कंपनी के लिए ज़रूरी हैश, Jetchat के सैंपल ऐप्लिकेशन में font_certs.xml फ़ाइल में मिल सकते हैं.
  3. FontFamily को परिभाषित करें: 
    // ...
 import androidx.compose.ui.text.googlefonts.GoogleFont
 import androidx.compose.ui.text.font.FontFamily
 import androidx.compose.ui.text.googlefonts.Font
 // ...

val fontName = GoogleFont("Lobster Two")

val fontFamily = FontFamily(
    Font(googleFont = fontName, fontProvider = provider)
)
    TextDownloadableFontsSnippets.kt
     साथ ही, फ़ॉन्ट के वज़न और स्टाइल जैसे अन्य पैरामीटर से जुड़ी क्वेरी भी की जा सकती है FontWeight और FontStyle क्रमश: 
    // ...
 import androidx.compose.ui.text.googlefonts.GoogleFont
 import androidx.compose.ui.text.font.FontFamily
 import androidx.compose.ui.text.googlefonts.Font
 // ...

val fontName = GoogleFont("Lobster Two")

val fontFamily = FontFamily(
    Font(
        googleFont = fontName,
        fontProvider = provider,
        weight = FontWeight.Bold,
        style = FontStyle.Italic
    )
)
    TextDownloadableFontsSnippets.kt
  4. अपने टेक्स्ट कॉम्पोज़ेबल फ़ंक्शन में इस्तेमाल किए जाने वाले FontFamily को कॉन्फ़िगर करें:

Text(
    fontFamily = fontFamily, text = "Hello World!"
)
TextDownloadableFontsSnippets.kt

आप यह भी परिभाषित कर सकते हैं कि टाइपोग्राफ़ी का इस्तेमाल आपका FontFamily:

val MyTypography = Typography(
    bodyMedium = TextStyle(
        fontFamily = fontFamily, fontWeight = FontWeight.Normal, fontSize = 12.sp/*...*/
    ),
    bodyLarge = TextStyle(
        fontFamily = fontFamily,
        fontWeight = FontWeight.Bold,
        letterSpacing = 2.sp,
        /*...*/
    ),
    headlineMedium = TextStyle(
        fontFamily = fontFamily, fontWeight = FontWeight.SemiBold/*...*/
    ),
    /*...*/
)
TextDownloadableFontsSnippets.kt

इसके बाद, अपने ऐप्लिकेशन की थीम के मुताबिक टाइपोग्राफ़ी सेट करें:

MyAppTheme(
    typography = MyTypography
)/*...*/
TextDownloadableFontsSnippets.kt

ऐसे ऐप्लिकेशन के उदाहरण के लिए जो Compose में डाउनलोड किए जा सकने वाले फ़ॉन्ट इस्तेमाल कर रहा है Material3 के साथ मिलकर, Jetchat का सैंपल ऐप्लिकेशन देखें.

फ़ॉलबैक फ़ॉन्ट जोड़ना

अगर फ़ॉन्ट सही तरीके से डाउनलोड नहीं होता है, तो आपके पास अपने फ़ॉन्ट के लिए फ़ॉलबैक की चेन तय करने का विकल्प होता है. उदाहरण के लिए, अगर आपने डाउनलोड किया जा सकने वाला फ़ॉन्ट इस तरह से तय किया है:

// ...
 import androidx.compose.ui.text.googlefonts.Font
 // ...

val fontName = GoogleFont("Lobster Two")

val fontFamily = FontFamily(
    Font(googleFont = fontName, fontProvider = provider),
    Font(googleFont = fontName, fontProvider = provider, weight = FontWeight.Bold)
)
TextDownloadableFontsSnippets.kt

इस तरह के दोनों वेट के लिए, अपने फ़ॉन्ट की डिफ़ॉल्ट सेटिंग तय की जा सकती है:

// ...
 import androidx.compose.ui.text.font.Font
 import androidx.compose.ui.text.googlefonts.Font
 // ...

val fontName = GoogleFont("Lobster Two")

val fontFamily = FontFamily(
    Font(googleFont = fontName, fontProvider = provider),
    Font(resId = R.font.my_font_regular),
    Font(googleFont = fontName, fontProvider = provider, weight = FontWeight.Bold),
    Font(resId = R.font.my_font_regular_bold, weight = FontWeight.Bold)
)
TextDownloadableFontsSnippets.kt

पक्का करें कि आपने सही इंपोर्ट जोड़े हों.

FontFamily को इस तरह से तय करने पर, एक FontFamily बनता है जिसमें दो चेन होती हैं, एक हर वज़न के लिए. लोड करने का तरीका पहले ऑनलाइन फ़ॉन्ट को रिज़ॉल्व करने की कोशिश करेगा, और फिर आपके लोकल R.font रिसॉर्स फ़ोल्डर में मौजूद फ़ॉन्ट.

लागू करने की प्रोसेस को डीबग करना

फ़ॉन्ट सही तरीके से डाउनलोड हो रहा है या नहीं, इसकी पुष्टि करने के लिए, डीबग कोरुटाइन हैंडलर तय किया जा सकता है. आपके हैंडल से यह जानकारी मिलती है कि मुमकिन है कि समस्या होने पर क्या करना चाहिए फ़ॉन्ट एसिंक्रोनस रूप से लोड नहीं हो रहा है.

CoroutineExceptionHandler बनाकर शुरू करें:

val handler = CoroutineExceptionHandler { _, throwable ->
    // process the Throwable
    Log.e(TAG, "There has been an issue: ", throwable)
}
TextDownloadableFontsSnippets.kt

इसे createFontFamilyResolver के तरीके में पास करें, ताकि रिज़ॉल्वर नए हैंडलर का इस्तेमाल कर सके:

CompositionLocalProvider(
    LocalFontFamilyResolver provides createFontFamilyResolver(LocalContext.current, handler)
) {
    Column {
        Text(
            text = "Hello World!", style = MaterialTheme.typography.bodyMedium
        )
    }
}
TextDownloadableFontsSnippets.kt

Google आपके यूआरएल पैरामीटर को कैसे इस्तेमाल करेगा, यह तय करने के लिए isAvailableOnDevice सेवा देने वाली कंपनी से मिला एपीआई, ताकि यह जांच की जा सके कि सेवा देने वाली कंपनी उपलब्ध है या नहीं और सर्टिफ़िकेट सही तरीके से कॉन्फ़िगर किया गया है. ऐसा करने के लिए, isAvailableOnDevice तरीके को कॉल करें जो गलत जानकारी देता है अगर प्रोवाइडर को गलत तरीके से कॉन्फ़िगर किया गया है.

val context = LocalContext.current
LaunchedEffect(Unit) {
    if (provider.isAvailableOnDevice(context)) {
        Log.d(TAG, "Success!")
    }
}
TextDownloadableFontsSnippets.kt

सीमाएं

Google Fonts को Android पर नए फ़ॉन्ट उपलब्ध कराने में कई महीने लगते हैं. fonts.google.com में किसी फ़ॉन्ट को जोड़ने और उसे डाउनलोड किए जा सकने वाले फ़ॉन्ट एपीआई (View सिस्टम या Compose में) के ज़रिए उपलब्ध कराने में समय लगता है. हो सकता है कि आपके ऐप्लिकेशन में, हाल ही में जोड़े गए फ़ॉन्ट IllegalStateException के साथ लोड न हों. फ़ॉन्ट लोड होने की दूसरी तरह की गड़बड़ियों के मुकाबले, इस गड़बड़ी को पहचानने में डेवलपर की मदद करने के लिए, हमने इन बदलावों के साथ, कंपोज़ में अपवाद के तौर पर जानकारी देने वाला मैसेज जोड़ा है यहां पढ़ें. अगर आपको कोई समस्या मिलती है, तो समस्या का इस्तेमाल करके उसकी शिकायत करें ट्रैकर देखें.

वैरिएबल फ़ॉन्ट इस्तेमाल करना

वैरिएबल फ़ॉन्ट, एक ऐसा फ़ॉन्ट फ़ॉर्मैट है जिसमें एक फ़ॉन्ट फ़ाइल में अलग-अलग स्टाइल हो सकती हैं. वैरिएबल फ़ॉन्ट की मदद से, ऐक्सिस (या पैरामीटर) में बदलाव करके, ये जनरेट किए जा सकते हैं आपके पसंदीदा स्टाइल को चुनें. ये ऐक्सिस स्टैंडर्ड हो सकते हैं, जैसे कि वेट, चौड़ाई, स्लैंट, और इटैलिक या कस्टम, जो वैरिएबल फ़ॉन्ट के हिसाब से अलग-अलग होते हैं.

अलग-अलग ऐक्सिस वैल्यू वाले एक ही वैरिएबल फ़ॉन्ट के पांच कॉन्फ़िगरेशन.
पहली इमेज. अलग-अलग ऐक्सिस वैल्यू के साथ कस्टमाइज़ किए गए एक ही वैरिएबल फ़ॉन्ट का इस्तेमाल करने वाला टेक्स्ट.

सामान्य फ़ॉन्ट फ़ाइलों के बजाय वैरिएबल फ़ॉन्ट का इस्तेमाल करने पर, आपके पास एक से ज़्यादा के बजाय सिर्फ़ एक फ़ॉन्ट फ़ाइल होती है.

वैरिएबल फ़ॉन्ट के बारे में ज़्यादा जानने के लिए, Google Fonts के बारे में जानकारी देखें. साथ ही, उपलब्ध वैरिएबल फ़ॉन्ट का पूरा कैटलॉग और हर फ़ॉन्ट के लिए काम करने वाले ऐक्सिस की टेबल देखें.

इस दस्तावेज़ में, Compose ऐप्लिकेशन में वैरिएबल फ़ॉन्ट लागू करने का तरीका बताया गया है.

वैरिएबल फ़ॉन्ट लोड करें

  1. वह वैरिएबल फ़ॉन्ट डाउनलोड करें जिसका इस्तेमाल करना है. उदाहरण के लिए, Roboto Flex. इसके बाद, उसे अपने ऐप्लिकेशन के app/res/font फ़ोल्डर में डालें. पक्का करें कि .ttf अभी तक किसी भी व्यक्ति ने चेक इन नहीं किया है आप जो फ़ाइल जोड़ेंगे, वह फ़ॉन्ट का वैरिएबल फ़ॉन्ट वर्शन है और आपकी फ़ॉन्ट फ़ाइल पूरी तरह से लोअरकेस में है और उसमें कोई खास वर्ण नहीं हैं.

  2. वैरिएबल फ़ॉन्ट लोड करने के लिए, FontFamily res/font/ डायरेक्ट्री:

    // In Typography.kt
@OptIn(ExperimentalTextApi::class)
val displayLargeFontFamily =
    FontFamily(
        Font(
            R.font.robotoflex_variable,
            variationSettings = FontVariation.Settings(
                FontVariation.weight(950),
                FontVariation.width(30f),
                FontVariation.slant(-6f),
            )
        )
    )
    VariableFontsSnippets.kt

    FontVariation API की मदद से, स्टैंडर्ड फ़ॉन्ट ऐक्सिस को कॉन्फ़िगर किया जा सकता है, जैसे कि वज़न, चौड़ाई, और स्लैंट. ये स्टैंडर्ड ऐक्सिस हैं, जो किसी भी वैरिएबल फ़ॉन्ट के साथ उपलब्ध होते हैं. आपके पास कस्टम कॉन्फ़िगरेशन के लिए, अलग-अलग कॉन्फ़िगरेशन बनाने का विकल्प है फ़ॉन्ट का इस्तेमाल कहां किया जाएगा.

  3. वैरिएबल फ़ॉन्ट सिर्फ़ Android वर्शन O और उसके बाद के वर्शन के लिए उपलब्ध हैं. इसलिए, नियम तय करें और सही फ़ॉलबैक को कॉन्फ़िगर करें:

    // In Typography.kt
val default = FontFamily(
    /*
    * This can be any font that makes sense
    */
    Font(
        R.font.robotoflex_static_regular
    )
)
@OptIn(ExperimentalTextApi::class)
val displayLargeFontFamily = if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) {
    FontFamily(
        Font(
            R.font.robotoflex_variable,
            variationSettings = FontVariation.Settings(
                FontVariation.weight(950),
                FontVariation.width(30f),
                FontVariation.slant(-6f),
            )
        )
    )
} else {
    default
}
    VariableFontsSnippets.kt

  4. आसानी से फिर से इस्तेमाल करने के लिए, सेटिंग को कॉन्स्टेंट के सेट में निकालें और फ़ॉन्ट की सेटिंग को इन कॉन्स्टेंट से बदलें:

    // VariableFontDimension.kt
object DisplayLargeVFConfig {
    const val WEIGHT = 950
    const val WIDTH = 30f
    const val SLANT = -6f
    const val ASCENDER_HEIGHT = 800f
    const val COUNTER_WIDTH = 500
}

@OptIn(ExperimentalTextApi::class)
val displayLargeFontFamily = if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) {
    FontFamily(
        Font(
            R.font.robotoflex_variable,
            variationSettings = FontVariation.Settings(
                FontVariation.weight(DisplayLargeVFConfig.WEIGHT),
                FontVariation.width(DisplayLargeVFConfig.WIDTH),
                FontVariation.slant(DisplayLargeVFConfig.SLANT),
            )
        )
    )
} else {
    default
}
    VariableFontsSnippets.kt

  5. FontFamily का इस्तेमाल करने के लिए, मटीरियल डिज़ाइन 3 टाइपोग्राफ़ी को कॉन्फ़िगर करें:

    // Type.kt
val Typography = Typography(
    displayLarge = TextStyle(
        fontFamily = displayLargeFontFamily,
        fontSize = 50.sp,
        lineHeight = 64.sp,
        letterSpacing = 0.sp,
        /***/
    )
)
    VariableFontsSnippets.kt

    इस सैंपल में displayLarge Material 3 टाइपोग्राफ़ी का इस्तेमाल किया गया है. इसमें फ़ॉन्ट की अलग-अलग डिफ़ॉल्ट सेटिंग और इस्तेमाल के सुझाव मौजूद हैं. उदाहरण के लिए, आपको displayLarge का इस्तेमाल, कम शब्दों वाले अहम टेक्स्ट के लिए करना चाहिए, क्योंकि यह स्क्रीन पर सबसे बड़ा टेक्स्ट होता है.

    मटीरियल 3 का इस्तेमाल करके, TextStyle की डिफ़ॉल्ट वैल्यू और अपनी टाइपोग्राफ़ी को पसंद के मुताबिक बनाने के लिए, fontFamily. ऊपर दिए गए स्निपेट में, हर फ़ॉन्ट फ़ैमिली के लिए फ़ॉन्ट सेटिंग को पसंद के मुताबिक बनाने के लिए, TextStyle के इंस्टेंस कॉन्फ़िगर किए गए हैं.

  6. टाइपोग्राफ़ी तय करने के बाद, उसे M3 MaterialTheme में पास करें:

    MaterialTheme(
    colorScheme = MaterialTheme.colorScheme,
    typography = Typography,
    content = content
)
    VariableFontsSnippets.kt

  7. आखिर में, किसी Text कंपोज़ेबल का इस्तेमाल करें और बताए गए किसी एक टेंप्लेट के लिए स्टाइल तय करें टाइपोग्राफ़ी के स्टाइल, MaterialTheme.typography.displayLarge:

    @Composable
@Preview
fun CardDetails() {
    MyCustomTheme {
        Card(
            shape = RoundedCornerShape(8.dp),
            elevation = CardDefaults.cardElevation(defaultElevation = 4.dp),
            modifier = Modifier
                .fillMaxWidth()
                .padding(16.dp)
        ) {
            Column(
                modifier = Modifier.padding(16.dp)
            ) {
                Text(
                    text = "Compose",
                    style = MaterialTheme.typography.displayLarge,
                    modifier = Modifier.padding(bottom = 8.dp),
                    maxLines = 1
                )
                Text(
                    text = "Beautiful UIs on Android",
                    style = MaterialTheme.typography.headlineMedium,
                    modifier = Modifier.padding(bottom = 8.dp),
                    maxLines = 2
                )
                Text(
                    text = "Jetpack Compose is Android’s recommended modern toolkit for building native UI. It simplifies and accelerates UI development on Android. Quickly bring your app to life with less code, powerful tools, and intuitive Kotlin APIs.",
                    style = MaterialTheme.typography.bodyLarge,
                    modifier = Modifier.padding(bottom = 8.dp),
                    maxLines = 3
                )
            }
        }
    }
}
    VariableFontsSnippets.kt

    हर Text कॉम्पोज़ेबल को उसकी Material थीम की स्टाइल के हिसाब से कॉन्फ़िगर किया जाता है. साथ ही, इसमें अलग-अलग वैरिएबल फ़ॉन्ट कॉन्फ़िगरेशन होता है. इस्तेमाल करने के लिए M3 को दी गई टाइपोग्राफ़ी वापस पाने के लिए MaterialTheme.typography MaterialTheme कंपोज़ेबल.

तीन अलग-अलग टेक्स्ट, जिनमें अलग-अलग फ़ॉन्ट कॉन्फ़िगरेशन दिखाए गए हैं.
दूसरी इमेज. वैरिएबल फ़ॉन्ट को तीन अलग-अलग कॉन्फ़िगरेशन में लागू किया गया है.

पसंद के मुताबिक बनाए गए ऐक्सिस का इस्तेमाल करें

फ़ॉन्ट में पसंद के मुताबिक ऐक्सिस भी बनाए जा सकते हैं. इनकी जानकारी, फ़ॉन्ट फ़ाइल में ही दी जाती है. उदाहरण के लिए, Roboto Flex फ़ॉन्ट में एसेंडर ऊंचाई ("YTAS") ऐक्सिस है, जो यह लोअरकेस एसेंडर की ऊंचाई को अडजस्ट करता है, जबकि काउंटर की चौड़ाई ("XTRA") को अडजस्ट करता है हर अक्षर की चौड़ाई अडजस्ट करता है.

FontVariation सेटिंग की मदद से, इन ऐक्सिस की वैल्यू बदली जा सकती है.

आप जिन कस्टम ऐक्सिस को फ़ॉन्ट के लिए कॉन्फ़िगर कर सकते हैं उनके बारे में ज़्यादा जानने के लिए, हर फ़ॉन्ट के लिए, इस्तेमाल किए जा सकने वाले ऐक्सिस की टेबल.

  1. कस्टम ऐक्सिस का इस्तेमाल करने के लिए, कस्टम ascenderHeight और counterWidth ऐक्सिस के लिए फ़ंक्शन तय करें:

    fun ascenderHeight(ascenderHeight: Float): FontVariation.Setting {
    require(ascenderHeight in 649f..854f) { "'Ascender Height' must be in 649f..854f" }
    return FontVariation.Setting("YTAS", ascenderHeight)
}

fun counterWidth(counterWidth: Int): FontVariation.Setting {
    require(counterWidth in 323..603) { "'Counter width' must be in 323..603" }
    return FontVariation.Setting("XTRA", counterWidth.toFloat())
}
    VariableFontsSnippets.kt

    ये फ़ंक्शन ये काम करते हैं:

    • वे वैल्यू तय करें जिन्हें स्वीकार किया जा सकता है. जैसा कि यहां जाकर देखा जा सकता है: वैरिएबल फ़ॉन्ट कैटलॉग, ascenderHeight (YTAS) में कम से कम वैल्यू 649f और ज़्यादा से ज़्यादा 854f की होनी चाहिए.
    • फ़ॉन्ट की सेटिंग पर वापस जाएं, ताकि कॉन्फ़िगरेशन को फ़ॉन्ट में जोड़ा जा सके. तय सीमा में FontVariation.Setting() तरीके से, ऐक्सिस का नाम (YTAS, XTRA) है हार्डकोड किया जाता है और यह मान को पैरामीटर के रूप में लेता है.

  2. फ़ॉन्ट कॉन्फ़िगरेशन के साथ ऐक्सिस का इस्तेमाल करके, अतिरिक्त पैरामीटर पास करें लोड किया गया हर Font:

    @OptIn(ExperimentalTextApi::class)
val displayLargeFontFamily = if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) {
    FontFamily(
        Font(
            R.font.robotoflex_variable,
            variationSettings = FontVariation.Settings(
                FontVariation.weight(DisplayLargeVFConfig.WEIGHT),
                FontVariation.width(DisplayLargeVFConfig.WIDTH),
                FontVariation.slant(DisplayLargeVFConfig.SLANT),
                ascenderHeight(DisplayLargeVFConfig.ASCENDER_HEIGHT),
                counterWidth(DisplayLargeVFConfig.COUNTER_WIDTH)
            )
        )
    )
} else {
    default
}
    VariableFontsSnippets.kt

    ध्यान दें कि अब छोटे अक्षरों के एसेंडर की ऊंचाई बढ़ गई है और बाकी टेक्स्ट चौड़ा हो गया है:

तीन अलग-अलग टेक्स्ट जो वैरिएबल फ़ॉन्ट के लिए अलग-अलग कॉन्फ़िगरेशन दिखाते हैं. इनमें कस्टम ऐक्सिस सेट किए गए हैं. कुछ टेक्स्ट में, लोअरकेस के एसेंडर हैं और वे पहले से ज़्यादा चौड़े हैं.
तीसरी इमेज. वैरिएबल फ़ॉन्ट पर सेट किए गए कस्टम ऐक्स दिखाने वाला टेक्स्ट.

अन्य संसाधन

ज़्यादा जानकारी के लिए, वैरिएबल फ़ॉन्ट के बारे में यह ब्लॉग पोस्ट देखें:

फ़िलहाल कोई सुझाव नहीं है.

अपने Google खाते में करने की कोशिश करें.