Jetpack Compose Academy · Lekcja

AnnotatedString: formatowany tekst mieszany

Stylizuj fragmenty w jednym bloku Text

Lekcja 4 z 413 kroki

AnnotatedString: formatowany tekst mieszany to bezpłatna lekcja Jetpack Compose Academy na CoddyKit. To lekcja 4 z 4. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej Jetpack Compose Academy, a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs Jetpack Compose Academy zawiera 4 lekcji w sumie.

Jeden tekst, wiele stylów

Czasami jedno słowo w zdaniu powinno się wyróżniać. AnnotatedString pozwala stylizować fragmenty tekstu wewnątrz pojedynczego komponentu Text.

Dlaczego nie dwa komponenty Text

Możesz rozdzielić słowa na osobne komponenty Text, ale ich zawijanie wyglądałoby niezgrabnie. AnnotatedString zachowuje całość jako jeden płynnie i naturalnie zawijany wiersz.

Tworzenie za pomocą buildAnnotatedString

Twórz tekst sformatowany za pomocą konstruktora buildAnnotatedString. W jego wnętrzu dodajesz zwykły tekst i stylizowane fragmenty w wybranej kolejności.

val s = buildAnnotatedString {
    append("Hello ")
}

Dodawanie zwykłego tekstu

Użyj append, aby dodać zwykłe znaki. Wywołania są dodawane kolejno, więc wynikowy tekst dokładnie odpowiada kolejności, w jakiej go tworzysz.

append("Welcome, ")
append("friend")

Stylizowanie fragmentu

Umieść część tekstu w withStyle i przekaż do niego SpanStyle. Wszystko, co zostanie dodane wewnątrz tego bloku, otrzyma ten styl.

withStyle(SpanStyle(fontWeight = FontWeight.Bold)) {
    append("important")
}

Opcje SpanStyle

Za pomocą SpanStyle można ustawić kolor, fontWeight, fontStyle, fontSize i wiele innych właściwości, dzięki czemu każdy fragment może wyglądać zupełnie inaczej niż sąsiednie.

SpanStyle(color = Color.Blue,
          fontWeight = FontWeight.Bold)

Wyświetlanie w Text

Przekaż gotowy AnnotatedString bezpośrednio do Text, tak jak zwykły tekst. Compose narysuje każdy stylizowany fragment we właściwym miejscu.

Text(text = annotatedGreeting)

Łączenie pogrubienia i koloru

Możesz swobodnie łączyć fragmenty: na przykład pogrubione czerwone słowo ze zwykłym zdaniem. Każdy blok withStyle wpływa tylko na tekst dodany wewnątrz niego. 🙂

ParagraphStyle dla bloków

W przypadku zmian dotyczących całych wierszy, takich jak wyrównanie lub odstępy, użyj ParagraphStyle zamiast SpanStyle. Stylizuje on całe akapity, a nie pojedyncze słowa.

Oznaczanie klikalnych słów

Możesz dołączyć LinkAnnotation, aby część tekstu stała się klikalna — idealnie nadaje się to do linków umieszczonych w tekście lub wiersza z warunkami korzystania z usługi.

Tekst sformatowany, jeden element

AnnotatedString pozwala umieścić różne style, linki i wyróżnienia w jednym komponencie Text. Dzięki niemu tworzysz naturalne i wyraziste treści.

Szybki sprawdzian

Chcesz pogrubić jedno słowo w zwykłym zdaniu wyświetlanym w jednym komponencie Text. Czego użyjesz?

Podsumowanie

Utworzyłeś sformatowany tekst za pomocą buildAnnotatedString, stylizując fragmenty przez withStyle i SpanStyle. Jeden komponent Text może teraz jednocześnie zawierać wiele różnych stylów. 🎉

Bezpłatny start

Ucz się Kotlin dzięki korepetycjom AI — za darmo

Pisz i uruchamiaj kod w przeglądarce, otrzymuj natychmiastową pomoc od korepetytora AI dostępnego 24/7 i kontynuuj naukę w sieci lub w aplikacji.

Kursy
30
Lekcje
120

Często zadawane pytania

Czy lekcja „AnnotatedString: formatowany tekst mieszany” jest bezpłatna?

Tak — pełny tekst „AnnotatedString: formatowany tekst mieszany” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu Jetpack Compose Academy, przejdź na CoddyKit PRO. Kurs Jetpack Compose Academy zawiera 4 lekcji w sumie.

Co nauczysz się w „AnnotatedString: formatowany tekst mieszany”?

Stylizuj fragmenty w jednym bloku Text Ćwiczysz Jetpack Compose Academy z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.

Czy potrzebuję doświadczenia, aby zacząć Jetpack Compose Academy?

Nie wymagamy żadnego doświadczenia. Jetpack Compose Academy w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 4 z 4.

Ile czasu zajmuje lekcja „AnnotatedString: formatowany tekst mieszany”?

Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.

Czy mogę pisać i uruchamiać kod w tej lekcji Jetpack Compose Academy?

Tak. Każda lekcja Jetpack Compose Academy zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.

Wszystkie lekcje w tym kursie

  1. Composable Text
  2. Rozmiar, grubość i styl czcionki
  3. Kolor, wyrównanie i przepełnienie
  4. AnnotatedString: formatowany tekst mieszany
← Powrót do Jetpack Compose Academy