Tekstin tyylittely
Fontit, koko, paksuus ja väri.
Tekstin tyylittely on ilmainen Android Academy-oppitunti CoddyKitissä. Tämä on oppitunti 1/4. Voit lukea tästä oppimispolusta kokonaan mitkä tahansa 3 oppituntia ilmaiseksi — sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä käytännön harjoittelun sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. Oppitunti kuuluu Android Academy-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. Android Academy-kurssilla on yhteensä 4 oppituntia.
Miksi tekstiä muotoillaan?
Jetpack Composessa Text-composable näyttää sanat näytöllä. Oletusarvoisesti sen ulkoasu on yksinkertainen, mutta voit muuttaa sen kokoa, väriä ja leikkausta.
Muotoilu helpottaa sovelluksesi käyttöä. Otsikon tulisi näyttää suuremmalta ja lihavoidummalta kuin leipätekstin.
Muotoilet Text-komponentin välittämällä sille lisäparametreja.
Text("Hello Compose")Tekstin suurentaminen
fontSize-parametri määrittää tekstin koon. Koot ilmoitetaan sp-yksiköissä, jotka skaalautuvat käyttäjän fonttiasetusten mukaan.
Käytä sp-yksikköä lisäämällä numeron perään .sp, esimerkiksi 24.sp.
Text(
text = "Big Title",
fontSize = 24.sp
)Lihavuus ja leikkaus
fontWeight-parametrilla voit tehdä tekstistä paksumpaa tai ohuempaa. Yleisin arvo on FontWeight.Bold.
Muita vaihtoehtoja ovat FontWeight.Light, FontWeight.Normal ja FontWeight.SemiBold.
Text(
text = "Important",
fontWeight = FontWeight.Bold
)Kursivoitu teksti
fontStyle-parametrilla voit kallistaa tekstiä. Aseta sen arvoksi FontStyle.Italic, jos haluat kursivoidun ulkoasun.
Kursivointia käytetään usein lainauksissa tai korostuksissa.
Text(
text = "A quote",
fontStyle = FontStyle.Italic
)Tekstin värittäminen
color-parametri muuttaa tekstin väriä. Voit antaa sille Color-arvon, kuten Color.Red tai Color.Blue.
Valitse värit niin, että kontrasti on riittävä ja teksti säilyy helposti luettavana.
Text(
text = "Warning",
color = Color.Red
)Tekstin tasaaminen
textAlign-parametrilla voit sijoittaa tekstin sen käytettävissä olevaan tilaan. Yleisiä arvoja ovat TextAlign.Center, TextAlign.Start ja TextAlign.End.
Keskitys toimii parhaiten, kun Text täyttää koko leveyden.
Text(
text = "Centered",
textAlign = TextAlign.Center
)Merkkivälistys
letterSpacing-parametri lisää merkkien väliin tilaa. Myös siinä käytetään sp-yksikköä.
Pieni lisävälistys voi tehdä otsikoista ilmavamman ja nykyaikaisemman näköisiä.
Text(
text = "SPACED",
letterSpacing = 2.sp
)Tyylien yhdistäminen
Voit käyttää useita parametreja samanaikaisesti. Lihavoitu, suuri ja sininen otsikko syntyy yhdellä Text-kutsulla ja useilla arvoilla.
Compose lukee jokaisen parametrin ja soveltaa niitä kaikkia yhdessä.
Text(
text = "Welcome",
fontSize = 28.sp,
fontWeight = FontWeight.Bold,
color = Color.Blue
)TextStylen käyttäminen
Useiden erillisten parametrien sijaan voit koota ne TextStyle-objektiin ja välittää sen style-parametrille.
Tämä on kätevää, kun samaa ulkoasua käytetään useassa paikassa.
Text(
text = "Styled",
style = TextStyle(
fontSize = 20.sp,
color = Color.Magenta
)
)Pitkän tekstin käsittely
Pitkä teksti voi ylittää sille varatun alueen. Rajoita rivien määrää maxLines-parametrilla ja näytä katkaisukohdassa pisteet overflow-parametrin avulla.
TextOverflow.Ellipsis lisää loppuun ...-merkin piilotetun tekstin tilalle.
Text(
text = "A very long sentence...",
maxLines = 1,
overflow = TextOverflow.Ellipsis
)Alleviivaus ja koristelu
textDecoration-parametrilla voit lisätä Underline- tai LineThrough-koristelun.
Alleviivaus merkitsee usein linkkejä, kun taas yliviivausta voidaan käyttää poistettujen tai vanhojen hintojen näyttämiseen.
Text(
text = "Link",
textDecoration = TextDecoration.Underline
)Pikatarkistus
Testataan, mitä opit Text-komponentin muotoilusta.
Kertaus
Opit muotoilemaan Text-komponenttia fontSize-parametrilla (sp-yksiköissä), lihavoimaan sitä fontWeight-parametrilla, kursivoimaan sitä fontStyle-parametrilla ja muuttamaan sen sävyä color-parametrilla.
Voit myös tasata tekstiä, lisätä merkkivälistystä ja koristeluja sekä koota kaikki asetukset TextStyleen.
Seuraavaksi teet painikkeita, jotka reagoivat napautuksiin.
Opi Kotlin tekoälytuutorin avulla — ilmaiseksi
Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.
- Kurssit
- 36
- Oppitunnit
- 152
Usein kysytyt kysymykset
Onko oppitunti ”Tekstin tyylittely” ilmainen?
Kyllä — voit lukea täällä verkossa kokonaan ilmaiseksi mitkä tahansa Android Academy-oppimispolun 3 oppituntia, myös oppitunnin “Tekstin tyylittely”. Sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä interaktiiviset harjoitukset sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. Android Academy-kurssilla on yhteensä 4 oppituntia.
Mitä opin oppitunnilla ”Tekstin tyylittely”?
Fontit, koko, paksuus ja väri. Harjoittelet Android Academy-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.
Tarvitsenko kokemusta aloittaakseni Android Academy-opiskelun?
Aiempi kokemus ei ole tarpeen. CoddyKitin Android Academy-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 1/4.
Kuinka kauan ”Tekstin tyylittely”-oppitunnin suorittaminen kestää?
Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.
Voinko kirjoittaa ja suorittaa koodia tällä Android Academy-oppitunnilla?
Kyllä. Jokainen Android Academy-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.
Kaikki tämän kurssin oppitunnit
- Tekstin tyylittely
- Painikkeet ja napsautukset
- Välit paddingilla
- Värit ja MaterialTheme