Tetap teratur dengan koleksi
Simpan dan kategorikan konten berdasarkan preferensi Anda.
Anda dapat menata gaya bagian teks untuk meningkatkan keterbacaan, meningkatkan pengalaman pengguna
yang positif, dan mendorong kreativitas yang lebih besar melalui penggunaan warna dan font.
Kompatibilitas versi
Implementasi ini mengharuskan minSDK project Anda ditetapkan ke API level 21 atau
yang lebih tinggi.
Dependensi
Memberi gaya pada bagian teks
Kode berikut menampilkan string "Hello World" menggunakan warna biru untuk "H", merah
untuk "W", dan hitam untuk teks lainnya. Untuk menetapkan gaya yang berbeda dalam
satu composable Text, gunakan kode berikut:
Memberi gaya pada bagian teks dengan SpanStyle, konfigurasi yang memungkinkan
gaya tingkat karakter.
Hasil
Gambar 1. Baris teks dengan beberapa gaya.
Koleksi yang berisi panduan ini
Panduan ini adalah bagian dari koleksi Panduan Cepat pilihan yang membahas
sasaran pengembangan Android yang lebih luas:
Teks tampilan
Teks adalah bagian utama dari setiap UI. Cari tahu berbagai cara
untuk menyajikan teks di aplikasi Anda guna memberikan pengalaman pengguna yang menyenangkan.
Konten dan contoh kode di halaman ini tunduk kepada lisensi yang dijelaskan dalam Lisensi Konten. Java dan OpenJDK adalah merek dagang atau merek dagang terdaftar dari Oracle dan/atau afiliasinya.
Terakhir diperbarui pada 2025-02-22 UTC.
[null,null,["Terakhir diperbarui pada 2025-02-22 UTC."],[],[],null,["# Style parts of text\n\n\u003cbr /\u003e\n\nYou can style parts of text to improve readability, increase positive user\nexperience, and encourage greater creativity through use of colors and fonts.\n\nVersion compatibility\n---------------------\n\nThis implementation requires that your project minSDK be set to API level 21 or\nhigher.\n\n### Dependencies\n\n### Kotlin\n\n\u003cbr /\u003e\n\n```kotlin\n implementation(platform(\"androidx.compose:compose-bom:2025.08.00\"))\n \n```\n\n\u003cbr /\u003e\n\n### Groovy\n\n\u003cbr /\u003e\n\n```groovy\n implementation platform('androidx.compose:compose-bom:2025.08.00')\n \n```\n\n\u003cbr /\u003e\n\nStyle parts of text\n-------------------\n\nThe following code displays the string \"Hello World\" using blue for the \"H\", red\nfor the \"W\", and black for the rest of the text. To set different styles within\na single [`Text`](/reference/kotlin/androidx/compose/material/package-summary#Text(androidx.compose.ui.text.AnnotatedString,androidx.compose.ui.Modifier,androidx.compose.ui.graphics.Color,androidx.compose.ui.unit.TextUnit,androidx.compose.ui.text.font.FontStyle,androidx.compose.ui.text.font.FontWeight,androidx.compose.ui.text.font.FontFamily,androidx.compose.ui.unit.TextUnit,androidx.compose.ui.text.style.TextDecoration,androidx.compose.ui.text.style.TextAlign,androidx.compose.ui.unit.TextUnit,androidx.compose.ui.text.style.TextOverflow,kotlin.Boolean,kotlin.Int,kotlin.Int,kotlin.collections.Map,kotlin.Function1,androidx.compose.ui.text.TextStyle)) composable, use the following code:\n\n\n```kotlin\n@Composable\nfun MultipleStylesInText() {\n Text(\n buildAnnotatedString {\n withStyle(style = SpanStyle(color = Color.Blue)) {\n append(\"H\")\n }\n append(\"ello \")\n\n withStyle(style = SpanStyle(fontWeight = FontWeight.Bold, color = Color.Red)) {\n append(\"W\")\n }\n append(\"orld\")\n }\n )\n}https://github.com/android/snippets/blob/dd30aee903e8c247786c064faab1a9ca8d10b46e/compose/snippets/src/main/java/com/example/compose/snippets/text/TextSnippets.kt#L233-L248\n```\n\n\u003cbr /\u003e\n\n### Key points about the code\n\n- Uses [`buildAnnotatedString`](/reference/kotlin/androidx/compose/ui/text/package-summary#buildAnnotatedString(kotlin.Function1)) that returns an [`AnnotatedString`](/reference/kotlin/androidx/compose/ui/text/AnnotatedString) string to set different styles within text.\n- Styles part of text with [`SpanStyle`](/reference/kotlin/androidx/compose/ui/text/SpanStyle), a configuration that allows character-level styling.\n\nResults\n-------\n\n**Figure 1.** A line of text with multiple styles.\n\nCollections that contain this guide\n-----------------------------------\n\nThis guide is part of these curated Quick Guide collections that cover\nbroader Android development goals: \n\n### Display text\n\nText is a central piece of any UI. Find out different ways you can present text in your app to provide a delightful user experience. \n[Quick guide collection](/develop/ui/compose/quick-guides/collections/display-text) \n\nHave questions or feedback\n--------------------------\n\nGo to our frequently asked questions page and learn about quick guides or reach out and let us know your thoughts. \n[Go to FAQ](/quick-guides/faq) [Leave feedback](https://issuetracker.google.com/issues/new?component=1573691&template=1993320)"]]