@Composable-funktion kirjoittaminen
Määritelkää oma uudelleenkäytettävä käyttöliittymäfunktio.
@Composable-funktion kirjoittaminen on ilmainen Jetpack Compose Academy-oppitunti CoddyKitissä. Tämä on oppitunti 1/4. Voit lukea koko oppitunnin alta ilmaiseksi ja harjoitella sen jälkeen käytännössä selaimessa sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla. Oppitunti kuuluu Jetpack Compose Academy-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. Jetpack Compose Academy-kurssilla on yhteensä 4 oppituntia.
Mitä rakennatte
Tässä oppitunnissa kirjoitatte oman own Composable-funktion alusta alkaen. Lopussa osaatte kuvata käyttöliittymän osan yhdellä Kotlin-funktiolla. 🚀
Kaikki alkaa @Composableista
Composable on funktio, joka on merkitty @Composable-annotaatiolla. Tämä merkintä kertoo Composelle, että funktio tuottaa käyttöliittymää eikä palauta arvoa.
@Composable
fun Greeting() {
Text("Hello!")
}Nimetkää se tyypin tavoin
Käyttöliittymää tuottavien Composablejen nimet kirjoitetaan PascalCasella kuten luokkien nimet. Kirjoitatte siis Greeting, ei greeting, osoittaaksenne sen olevan käyttöliittymän rakennuspalikka.
Ne palauttavat Unit-arvon
Composable ei palauta arvoa. Se tuottaa käyttöliittymän kutsumalla muita Composableja sisällään, joten sen palautustyyppi on yksinkertaisesti Unit.
@Composable
fun Welcome() {
Text("Welcome aboard")
}Välittäkää dataa parametreilla
Tehkää Composablesta uudelleenkäytettävä lisäämällä parametreja. Välittäkää sille nimi, niin sama funktio voi tervehtiä ketä tahansa.
@Composable
fun Greeting(name: String) {
Text("Hello, " + name)
}Oletusarvot helpottavat
Antakaa parametreille oletusarvot, jotta kutsuja voi jättää ne pois. Tässä name-parametrin oletusarvo on World, joten Greeting() toimii sellaisenaan.
@Composable
fun Greeting(name: String = "World") {
Text("Hello, " + name)
}Valmiit Composablet
Harvoin joudutte aloittamaan tyhjästä. Compose sisältää valmiita osia, kuten Text, Button ja Image, joita kutsutte oman funktionne sisältä.
Tuokaa käyttöön tarvitsemanne
Kun kutsutte Textiä, Android Studio lisää import-lauseen pakettia androidx.compose.material3.Text varten. Antakaa IDE:n lisätä tuonti automaattisesti, jotta teidän ei tarvitse arvailla pakettia.
Pitäkää funktiot pieninä
Jokaisen Composablen tulisi kuvata yhtä selkeää asiaa. Pieni, rajattu funktio on helpompi lukea, käyttää uudelleen ja esikatsella kuin valtava funktio.
Ei palautusta, vain kutsuja
Composable-funktion sisällä ette rakenna widgetiä ettekä palauta sitä. Kutsutte yksinkertaisesti muita Composableja ylhäältä alas, ja Compose piirtää ne järjestyksessä.
@Composable
fun Card() {
Text("Title")
Text("Subtitle")
}Se on silti Kotlinia
Composable on pohjimmiltaan tavallinen Kotlin-funktio. Voitte käyttää sen sisällä muuttujia, ehtoja ja silmukoita aivan kuten missä tahansa muussakin funktiossa.
@Composable
fun Status(online: Boolean) {
if (online) Text("Online")
else Text("Offline")
}Pikatarkistus
On aika tarkistaa nopeasti, mikä määrittää Composablen.
Kertaus
Osaatte nyt kirjoittaa Composablen: merkitkää se @Composable-annotaatiolla, nimetkää se PascalCasella, ottakaa parametreja ja kutsukaa muita Composableja käyttöliittymän tuottamiseksi. 🎉
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
- 30
- Oppitunnit
- 120
Usein kysytyt kysymykset
Onko oppitunti ”@Composable-funktion kirjoittaminen” ilmainen?
Kyllä – oppitunnin ”@Composable-funktion kirjoittaminen” koko tekstin voi lukea täällä verkossa ilmaiseksi. Jos haluat harjoitella interaktiivisesti sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla sekä avata koko Jetpack Compose Academy-kurssin, päivitä CoddyKit PROhon. Jetpack Compose Academy-kurssilla on yhteensä 4 oppituntia.
Mitä opin oppitunnilla ”@Composable-funktion kirjoittaminen”?
Määritelkää oma uudelleenkäytettävä käyttöliittymäfunktio. Harjoittelet Jetpack Compose Academy-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.
Tarvitsenko kokemusta aloittaakseni Jetpack Compose Academy-opiskelun?
Aiempi kokemus ei ole tarpeen. CoddyKitin Jetpack Compose 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 ”@Composable-funktion kirjoittaminen”-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ä Jetpack Compose Academy-oppitunnilla?
Kyllä. Jokainen Jetpack Compose 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
- @Composable-funktion kirjoittaminen
- Reaaliaikaiset esikatselut @Previewlla
- Composable-funktioiden kutsuminen Composable-funktioista
- setContent: mistä käyttöliittymä alkaa