इस पेज पर, Compose ऐप्लिकेशन में फ़ॉन्ट सेट करने का तरीका बताया गया है.
फ़ॉन्ट सेट करें
Text
में fontFamily
पैरामीटर है, जो इसमें इस्तेमाल किए जाने वाले फ़ॉन्ट को सेट करने की अनुमति देता है
कंपोज़ेबल. डिफ़ॉल्ट रूप से, सेरिफ़, San-Serif, monospace, और कर्सिव फ़ॉन्ट फ़ैमिली
शामिल हैं:
@Composable fun DifferentFonts() { Column { Text("Hello World", fontFamily = FontFamily.Serif) Text("Hello World", fontFamily = FontFamily.SansSerif) } }
पसंद के मुताबिक फ़ॉन्ट और टाइपफ़ेस के साथ काम करने के लिए, fontFamily
एट्रिब्यूट का इस्तेमाल किया जा सकता है
res/font
फ़ोल्डर में परिभाषित किया गया है:
इस उदाहरण में बताया गया है कि उन फ़ॉन्ट के आधार पर 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) )
आपके पास इस 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 आप डाउनलोड किए जा सकने वाले Font API का इस्तेमाल करके, Compose ऐप्लिकेशन में जाकर Google फ़ॉन्ट एसिंक्रोनस रूप से इस्तेमाल करें और अपने ऐप्लिकेशन में उनका इस्तेमाल करें.
पसंद के मुताबिक बनाए गए फ़ॉन्ट डाउनलोड करने की सुविधा फ़िलहाल उपलब्ध नहीं है.
प्रोग्राम के हिसाब से, डाउनलोड किए जा सकने वाले फ़ॉन्ट का इस्तेमाल करना
अपने ऐप्लिकेशन के अंदर से प्रोग्राम के हिसाब से फ़ॉन्ट डाउनलोड करने के लिए, यह तरीका अपनाएं:
- डिपेंडेंसी जोड़ें:
ग्रूवी
dependencies { ... implementation "androidx.compose.ui:ui-text-google-fonts:1.6.8" }
Kotlin
dependencies { ... implementation("androidx.compose.ui:ui-text-google-fonts:1.6.8") }
- शुरू करें
GoogleFont.Provider
Google फ़ॉन्ट के लिए क्रेडेंशियल के साथ: सेवा देने वाली कंपनी को ये पैरामीटर मिलते हैं: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 देने वाली कंपनी के लिए ज़रूरी हैश खोजे जा सकते हैं
font_certs.xml
फ़ाइल में JetChat का सैंपल ऐप्लिकेशन.
- परिभाषित करें
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 ) )
FontFamily
को इसे कॉन्फ़िगर करें आपके टेक्स्ट कंपोज़ेबल फ़ंक्शन में इस्तेमाल किया गया है:
Text( fontFamily = fontFamily, text = "Hello World!" )
![](https://developer.android.com/static/develop/ui/compose/images/text-dl-fontfamily.png?authuser=19&hl=hi)
आप यह भी परिभाषित कर सकते हैं कि
टाइपोग्राफ़ी का इस्तेमाल
आपका FontFamily
:
val MyTypography = Typography( labelMedium = TextStyle( fontFamily = fontFamily, fontWeight = FontWeight.Normal, fontSize = 12.sp/*...*/ ), labelLarge = TextStyle( fontFamily = fontFamily, fontWeight = FontWeight.Bold, letterSpacing = 2.sp, /*...*/ ), displayMedium = 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 ) } }
Google आपके यूआरएल पैरामीटर को कैसे इस्तेमाल करेगा, यह तय करने के लिए
isAvailableOnDevice
सेवा देने वाली कंपनी से मिला एपीआई, ताकि यह जांच की जा सके कि सेवा देने वाली कंपनी उपलब्ध है या नहीं और सर्टिफ़िकेट
सही तरीके से कॉन्फ़िगर किया गया है. ऐसा करने के लिए, isAvailableOnDevice
तरीके को कॉल करें
जो गलत जानकारी देता है अगर प्रोवाइडर को गलत तरीके से कॉन्फ़िगर किया गया है.
val context = LocalContext.current LaunchedEffect(Unit) { if (provider.isAvailableOnDevice(context)) { Log.d(TAG, "Success!") } }
सीमाएं
Google Fonts को Android पर नए फ़ॉन्ट उपलब्ध कराने में कई महीने लगते हैं.
फ़ॉन्ट को जोड़े जाने के बीच समय
fonts.google.com पर और जब यह उपलब्ध हो, तब
डाउनलोड करने लायक फ़ॉन्ट एपीआई (व्यू सिस्टम में या लिखें में). नया
जोड़े गए फ़ॉन्ट आपके ऐप्लिकेशन में
IllegalStateException
.
फ़ॉन्ट लोड होने की दूसरी तरह की गड़बड़ियों के मुकाबले, इस गड़बड़ी को पहचानने में डेवलपर की मदद करने के लिए,
हमने इन बदलावों के साथ, कंपोज़ में अपवाद के तौर पर जानकारी देने वाला मैसेज जोड़ा है
यहां पढ़ें.
अगर आपको कोई समस्या मिलती है, तो समस्या का इस्तेमाल करके उसकी शिकायत करें
ट्रैकर देखें.
वैरिएबल फ़ॉन्ट इस्तेमाल करना
वैरिएबल फ़ॉन्ट एक ऐसा फ़ॉन्ट फ़ॉर्मैट होता है जिसकी मदद से, एक फ़ॉन्ट फ़ाइल में शैलियां. वैरिएबल फ़ॉन्ट की मदद से, ऐक्सिस (या पैरामीटर) में बदलाव करके, ये जनरेट किए जा सकते हैं आपके पसंदीदा स्टाइल को चुनें. ये ऐक्सिस, स्टैंडर्ड साइज़ के हो सकते हैं. जैसे, वज़न, चौड़ाई, तिरछा, और इटैलिक या कस्टम, जो वैरिएबल फ़ॉन्ट में अलग-अलग होता है.
![ऐक्सिस की अलग-अलग वैल्यू के साथ, एक ही वैरिएबल फ़ॉन्ट के पांच कॉन्फ़िगरेशन.](https://developer.android.com/static/develop/ui/compose/images/text/vf-configs.png?authuser=19&hl=hi)
सामान्य फ़ॉन्ट फ़ाइलों के बजाय वैरिएबल फ़ॉन्ट का इस्तेमाल करने पर, आपको सिर्फ़ एक फ़ॉन्ट इस्तेमाल करने की अनुमति मिलती है फ़ॉन्ट फ़ाइल का उपयोग करें.
वैरिएबल फ़ॉन्ट के बारे में ज़्यादा जानने के लिए, Google Fonts देखें नॉलेज, यानी पूरा कैटलॉग वैरिएबल फ़ॉन्ट और हर एक के लिए काम करने वाले ऐक्सिस की टेबल फ़ॉन्ट.
इस दस्तावेज़ में, Compose ऐप्लिकेशन में वैरिएबल फ़ॉन्ट लागू करने का तरीका बताया गया है.
वैरिएबल फ़ॉन्ट लोड करें
वह वैरिएबल फ़ॉन्ट डाउनलोड करें जिसका आपको इस्तेमाल करना है (उदाहरण के लिए Roboto Flex) और इसे अपने ऐप्लिकेशन के
app/res/font
फ़ोल्डर में डालें. पक्का करें कि .ttf
अभी तक किसी भी व्यक्ति ने चेक इन नहीं किया है आप जो फ़ाइल जोड़ेंगे, वह फ़ॉन्ट का वैरिएबल फ़ॉन्ट वर्शन है और आपकी फ़ॉन्ट फ़ाइल पूरी तरह से लोअरकेस में है और उसमें कोई खास वर्ण नहीं हैं.वैरिएबल फ़ॉन्ट लोड करने के लिए,
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), ) ) )
FontVariation
API की मदद से, स्टैंडर्ड फ़ॉन्ट ऐक्सिस को कॉन्फ़िगर किया जा सकता है, जैसे कि वज़न, चौड़ाई, और स्लैंट. ये स्टैंडर्ड ऐक्सिस हैं जिन्हें किसी भी वैरिएबल फ़ॉन्ट के साथ उपलब्ध है. आपके पास कस्टम कॉन्फ़िगरेशन के लिए, अलग-अलग कॉन्फ़िगरेशन बनाने का विकल्प है फ़ॉन्ट का इस्तेमाल कहां किया जाएगा.वैरिएबल फ़ॉन्ट सिर्फ़ 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 }
आसानी से दोबारा इस्तेमाल करने के लिए, सेटिंग को कॉन्सटेंट के सेट में एक्सट्रैक्ट करें और इन कॉन्सटेंट की फ़ॉन्ट सेटिंग:
// 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 }
FontFamily
का इस्तेमाल करने के लिए, मटीरियल डिज़ाइन 3 टाइपोग्राफ़ी को कॉन्फ़िगर करें:// Type.kt val Typography = Typography( displayLarge = TextStyle( fontFamily = displayLargeFontFamily, fontSize = 50.sp, lineHeight = 64.sp, letterSpacing = 0.sp, /***/ ) )
इस सैंपल में
displayLarge
मटीरियल 3 टाइपोग्राफ़ी का इस्तेमाल किया गया है, जो अलग है डिफ़ॉल्ट फ़ॉन्ट सेटिंग और सुझाए गए इस्तेमाल. उदाहरण के लिए, आपको छोटे और ज़रूरी टेक्स्ट के लिए,displayLarge
. ऐसा इसलिए, क्योंकि यह स्क्रीन पर मौजूद सबसे बड़ा टेक्स्ट होता है.मटीरियल 3 का इस्तेमाल करके,
TextStyle
की डिफ़ॉल्ट वैल्यू और अपनी टाइपोग्राफ़ी को पसंद के मुताबिक बनाने के लिए,fontFamily
. ऊपर दिए गए स्निपेट में, हर फ़ॉन्ट फ़ैमिली की फ़ॉन्ट सेटिंग को पसंद के मुताबिक बनाने के लिए,TextStyle
के इंस्टेंस.आपने अपनी टाइपोग्राफ़ी तय कर ली है, इसलिए अब उसे M3
MaterialTheme
को पास करें:MaterialTheme( colorScheme = MaterialTheme.colorScheme, typography = Typography, content = content )
आखिर में, किसी
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
कंपोज़ेबल को उसकी मटीरियल थीम की स्टाइल के हिसाब से कॉन्फ़िगर किया जाता है और में एक भिन्न वैरिएबल फ़ॉन्ट कॉन्फ़िगरेशन मौजूद है. Google Analytics 4 पर माइग्रेट करने के लिए, M3 को दी गई टाइपोग्राफ़ी वापस पाने के लिएMaterialTheme.typography
MaterialTheme
कंपोज़ेबल.
![तीन अलग-अलग टेक्स्ट, सभी अलग-अलग फ़ॉन्ट कॉन्फ़िगरेशन दिखाते हैं.](https://developer.android.com/static/develop/ui/compose/images/text/vf-standard-axes.png?authuser=19&hl=hi)
पसंद के मुताबिक बनाए गए ऐक्सिस का इस्तेमाल करें
फ़ॉन्ट में पसंद के मुताबिक ऐक्सिस भी बनाए जा सकते हैं. इनके बारे में फ़ॉन्ट फ़ाइल में बताया जाता है.
उदाहरण के लिए, Roboto Flex फ़ॉन्ट का एसेंडर ऊंचाई ("YTAS"
) ऐक्सिस है, जो
यह लोअरकेस एसेंडर की ऊंचाई को अडजस्ट करता है, जबकि काउंटर की चौड़ाई ("XTRA"
) को अडजस्ट करता है
हर अक्षर की चौड़ाई अडजस्ट करता है.
FontVariation
सेटिंग की मदद से, इन ऐक्सिस की वैल्यू बदली जा सकती है.
आप जिन कस्टम ऐक्सिस को फ़ॉन्ट के लिए कॉन्फ़िगर कर सकते हैं उनके बारे में ज़्यादा जानने के लिए, हर फ़ॉन्ट के लिए, इस्तेमाल किए जा सकने वाले ऐक्सिस की टेबल.
कस्टम ऐक्सिस का इस्तेमाल करने के लिए, कस्टम
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
) है हार्डकोड किया जाता है और यह मान को पैरामीटर के रूप में लेता है.
- उन वैल्यू के लिए सीमाएं तय करें जिन्हें वे स्वीकार कर सकते हैं. जैसा कि यहां जाकर देखा जा सकता है:
वैरिएबल फ़ॉन्ट कैटलॉग,
फ़ॉन्ट कॉन्फ़िगरेशन के साथ ऐक्सिस का इस्तेमाल करके, अतिरिक्त पैरामीटर पास करें लोड किया गया हर
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 }
ध्यान दें कि लोअरकेस एसेंडर की ऊंचाई अब बढ़ गई है और अन्य टेक्स्ट ज़्यादा चौड़ा है:
![तीन अलग-अलग टेक्स्ट जो वैरिएबल फ़ॉन्ट के लिए अलग-अलग कॉन्फ़िगरेशन दिखाते हैं. इनमें कस्टम ऐक्सिस सेट होते हैं. कुछ टेक्स्ट में, लोअरकेस के एसेंडर हैं और वे पहले से ज़्यादा चौड़े हैं.](https://developer.android.com/static/develop/ui/compose/images/text/vf-custom-axes.png?authuser=19&hl=hi)
अन्य संसाधन
ज़्यादा जानकारी के लिए, वैरिएबल फ़ॉन्ट के बारे में जानकारी देने वाला यह ब्लॉग पोस्ट देखें:
आपके लिए सुझाव
- ध्यान दें: JavaScript बंद होने पर लिंक टेक्स्ट दिखता है
- Compose में संसाधन
- टेक्स्ट की स्टाइल करना
- Compose में मटीरियल डिज़ाइन 2