ফন্ট নিয়ে কাজ করা

আপনার Compose অ্যাপে কীভাবে ফন্ট সেট করবেন তা এই পৃষ্ঠায় বর্ণনা করা হয়েছে।

ফন্ট সেট করুন

Text-এ fontFamily প্যারামিটার আছে যা কম্পোজেবলে ব্যবহৃত ফন্ট সেট করার অনুমতি দেয়। ডিফল্ট হিসেবে, serif, sans-serif, monospace ও cursive ফন্ট ফ্যামিলি অন্তর্ভুক্ত করা হয়:

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

শব্দগুলি

res/font ফোল্ডারে সংজ্ঞায়িত কাস্টম ফন্ট ও টাইপফেসের সাথে কাজ করতে আপনি fontFamily অ্যাট্রিবিউট ব্যবহার করতে পারবেন:

ডেভেলপমেন্ট এমভায়রনমেন্টে res > font ফোল্ডারের গ্রাফিক্যাল বর্ণনা

এই উদাহরণে দেখানো হয়েছে যে কীভাবে আপনি সেইসব ফন্ট ফাইলের উপর ভিত্তি করে এবং Font ফাংশন ব্যবহার করে fontFamily সংজ্ঞায়িত করবেন:

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

আপনি এই 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)
}

শব্দগুলি

আপনার সম্পূর্ণ অ্যাপে কীভাবে টাইপোগ্রাফি সেট করবেন তা জানতে, Compose-এ কাস্টম ডিজাইন সিস্টেম দেখুন।

ডাউনলোড করা যাবে এমন ফন্ট

Compose 1.2.0 থেকে শুরু করে, আপনি Compose অ্যাপে ডাউনলোড করা যাবে এমন ফন্ট API ব্যবহার করে অ্যাসিঙ্ক্রোনাসভাবে Google Fonts ডাউনলোড করতে এবং আপনার অ্যাপে সেগুলি ব্যবহার করতে পারবেন।

কাস্টম প্রদানকারীর মাধ্যমে দেওয়া ডাউনলোড করা যাবে এমন ফন্টের জন্য সহায়তা বর্তমানে উপলভ্য নেই।

প্রোগ্রাম্যাটিক্যালি ডাউনলোড করা যায় এমন ফন্ট ব্যবহার করা

আপনার অ্যাপের মধ্যে থেকে প্রোগ্রাম্যাটিক্যালি কোনও ফন্ট ডাউনলোড করতে, এইসব ধাপ অনুসরণ করুন:

  1. নির্ভরতা যোগ করুন:

    গ্ৰুভি

    dependencies {
        ...
        implementation "androidx.compose.ui:ui-text-google-fonts:1.12.1"
    }

    Kotlin

    dependencies {
        ...
        implementation("androidx.compose.ui:ui-text-google-fonts:1.12.1")
    }
  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
    )
    প্রোভাইডার যেসব প্যারামিটার পায় সেগুলি হল:
    • 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)
    )
    আপনি ফন্টের অন্যান্য প্যারামিটার যেমন, ওয়েট ও স্টাইলের জন্য যথাক্রমে 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
        )
    )
  4. আপনার টেক্সট কম্পোজেবল ফাংশনে ব্যবহার করার জন্য FontFamily কনফিগার করুন:

Text(
    fontFamily = fontFamily, text = "Hello World!"
)

এছাড়াও, আপনার 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/*...*/
    ),
    /*...*/
)

এরপর, আপনার অ্যাপের থিমে টাইপোগ্রাফি সেট করুন:

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

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

আপনি এইভাবে দুটি ওয়েটের জন্য আপনার ফন্টের ডিফল্ট সেট করতে পারেন:

// ...
 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)
)

আপনি সঠিক ইমপোর্ট যোগ করছেন কিনা তা নিশ্চিত করুন।

FontFamily-কে এইভাবে সংজ্ঞায়িত করলে, দুটি চেইন সহ FontFamily তৈরি হয়, প্রতিটি ওয়েটের জন্য একটি করে। লোডিং মেকানিজম প্রথমে অনলাইন ফন্ট এবং তারপরে আপনার লোকাল R.font রিসোর্স ফোল্ডারে থাকা ফন্ট সমাধান করার চেষ্টা করবে।

আপনার প্রয়োগ ডিবাগ করুন

ফন্ট সঠিকভাবে ডাউনলোড হচ্ছে কিনা তা যাচাই করতে, আপনি একটি ডিবাগ কোরুটিন হ্যান্ডলার সংজ্ঞায়িত করতে পারেন। অ্যাসিঙ্ক্রোনাসভাবে ফন্ট লোড না হলে কী করতে হবে, আপনার হ্যান্ডেল সেই আচরণ প্রদান করে।

CoroutineExceptionHandler তৈরি করে শুরু করুন:

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

রিজলভার যাতে নতুন হ্যান্ডলার ব্যবহার করে তার জন্য এটি createFontFamilyResolver মেথডে পাস করুন:

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

এছাড়াও, আপনি isAvailableOnDevice API ব্যবহার করে দেখতে পারেন যে পরিষেবা প্রদানকারী উপলভ্য আছে কিনা এবং সার্টিফিকেট সঠিকভাবে কনফিগার করা হয়েছে কিনা। এটি করতে, আপনি isAvailableOnDevice মেথড কল করতে পারেন যা প্রদানকারী ভুলভাবে কনফিগার করা থাকলে মিথ্যা রিটার্ন করে।

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

Caveats

Android-এ নতুন ফন্ট উপলভ্য করতে Google Fonts-এর কয়েক মাস সময় লাগে। fonts.google.com-এ ফন্ট যোগ করা এবং ডাউনলোড করা যাবে এমন ফন্ট API-এর মাধ্যমে (ভিউ সিস্টেম বা কম্পোজে) সেটি উপলভ্য হওয়ার মধ্যে সময়ের ব্যবধান থাকে। নতুন যোগ করা ফন্ট আপনার অ্যাপে লোড নাও হতে পারে, সেক্ষেত্রে IllegalStateException দেখানো হবে। অন্যান্য ধরনের ফন্ট লোডিং সংক্রান্ত সমস্যার থেকে এই সমস্যাটি শনাক্ত করতে ডেভেলপারদের সাহায্য করার জন্য, আমরা কম্পোজে ব্যতিক্রমের জন্য বর্ণনামূলক মেসেজিং যোগ করেছি এখানে পরিবর্তন সহ। আপনি কোনও সমস্যা দেখতে পেলে, ইস্যু ট্র্যাকার ব্যবহার করে সেটি জানান।

ভেরিয়েবেল ফন্ট ব্যবহার করুন

ভেরিয়েবেল ফন্ট হল এমন একটি ফন্ট ফর্ম্যাট যা একটি ফন্ট ফাইলকে বিভিন্ন স্টাইল ধারণ করার অনুমতি দেয়। পরিবর্তনশীল ফন্টের সাহায্যে, আপনি নিজের পছন্দের স্টাইল তৈরি করতে অক্ষ (বা প্যারামিটার) পরিবর্তন করতে পারেন। এইসব অক্ষ স্ট্যান্ডার্ড হতে পারে, যেমন ওজন, প্রস্থ, স্ল্যান্ট এবং ইটালিক অথবা কাস্টম, যা বিভিন্ন ফন্ট জুড়ে আলাদা হয়।

বিভিন্ন অক্ষের মান সহ একই ভেরিয়েবল ফন্টের পাঁচটি কনফিগারেশন।
ছবি ১. একই ভেরিয়েবল ফন্ট ব্যবহার করে টেক্সট যা বিভিন্ন অক্ষের মান দিয়ে কাস্টমাইজ করা হয়েছে।

রেগুলার ফন্ট ফাইলের পরিবর্তে ভেরিয়েবল ফন্ট ব্যবহার করলে, একাধিক ফন্ট ফাইলের পরিবর্তে আপনার কাছে একটিই ফন্ট ফাইল থাকবে।

ভেরিয়েবল ফন্ট সম্পর্কে আরও জানতে, Google Fonts Knowledge, উপলভ্য ভেরিয়েবল ফন্টের সম্পূর্ণ ক্যাটালগ এবং প্রতিটি ফন্টের জন্য কাজ করে এমন অক্ষের সারণী দেখুন।

আপনার Compose অ্যাপে কীভাবে ভেরিয়েবল ফন্ট প্রয়োগ করবেন তা এই ডকুমেন্ট থেকে জানতে পারবেন।

ভেরিয়েবেল ফন্ট লোড করা

  1. আপনি যে ভেরিয়েবল ফন্ট ব্যবহার করতে চান সেটি ডাউনলোড করুন (যেমন Roboto Flex) এবং আপনার অ্যাপের app/res/font ফোল্ডারে সেটি রাখুন। দেখে নিন যে .আপনি যে ttf ফাইল যোগ করেছেন সেটি হল ফন্টের ভেরিয়েবেল ফন্ট ভার্সন এবং আপনার ফন্ট ফাইলের নাম সব ছোট হাতের অক্ষরে লেখা এবং এতে কোনও বিশেষ অক্ষর নেই।

  2. ভেরিয়েবল ফন্ট লোড করতে, res/font/ ডিরেক্টরিতে রাখা ফন্ট ব্যবহার করে FontFamily সংজ্ঞায়িত করুন:

    // 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),
                )
            )
        )

    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
    }

  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
    }

  5. FontFamily ব্যবহার করতে Material Design 3 টাইপোগ্রাফি কনফিগার করুন:

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

    এই স্যাম্পেল displayLarge মেটেরিয়াল ৩ টাইপোগ্রাফি ব্যবহার করে, যার আলাদা ডিফল্ট ফন্ট সেটিংস এবং সাজেস্ট করা ব্যবহার আছে। যেমন, ছোট, গুরুত্বপূর্ণ টেক্সটের জন্য আপনার displayLarge ব্যবহার করা উচিত, কারণ এটি স্ক্রিনের সবচেয়ে বড় টেক্সট।

    Material 3-এর মাধ্যমে, আপনার টাইপোগ্রাফি কাস্টমাইজ করতে TextStyle এবং fontFamily-এর ডিফল্ট ভ্যালু পরিবর্তন করতে পারবেন। উপরের স্নিপেটে, আপনি প্রতিটি ফন্ট ফ্যামিলির জন্য ফন্ট সেটিংস কাস্টমাইজ করতে TextStyle-এর ইনস্ট্যান্স কনফিগার করেন।

  6. এখন আপনি টাইপোগ্রাফি নির্ধারণ করেছেন, এটি M3 MaterialTheme-এ পাস করুন:

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

  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
                    )
                }
            }
        }
    }

    প্রতিটি Text কম্পোজেবল তার মেটেরিয়াল থিমের স্টাইলের মাধ্যমে কনফিগার করা হয় এবং এতে একটি ভিন্ন পরিবর্তনশীল ফন্ট কনফিগারেশন থাকে। আপনি MaterialTheme.typography ব্যবহার করে M3 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())
    }

    এই ফাংশনগুলি নিম্নলিখিত কাজ করে:

    • তারা যে ভ্যালু গ্রহণ করতে পারে তার জন্য গার্ডরেল নির্ধারণ করুন। ভেরিয়েবেল ফন্ট ক্যাটালগ-এ আপনি দেখতে পাবেন যে 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
    }

    লক্ষ্য করুন যে ছোট হাতের অ্যাসেন্ডারের উচ্চতা এখন বাড়ানো হয়েছে এবং অন্যান্য টেক্সট আরও চওড়া:

কাস্টম অক্ষ সেট সহ পরিবর্তনশীল ফন্টের জন্য বিভিন্ন কনফিগারেশন দেখানো তিনটি ভিন্ন টেক্সট— কিছুতে উচ্চতর ছোট হাতের অ্যাসেন্ডার রয়েছে এবং আগের চেয়ে চওড়া।
ছবি ৩. ভেরিয়েবেল ফন্টে সেট করা কাস্টম অক্ষ দেখানো টেক্সট।

অতিরিক্ত রিসোর্স

আরও তথ্যের জন্য, ভেরিয়েবল ফন্ট সম্পর্কে নিম্নলিখিত ব্লগ পোস্ট দেখুন: