SwiftUI Academy · Oppitunti

Rivit HStackilla

Sijoita näkymät vierekkäin vaakasuunnassa

Oppitunti 2/413 vaihetta

Rivit HStackilla on ilmainen SwiftUI Academy-oppitunti CoddyKitissä. Tämä on oppitunti 2/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 SwiftUI Academy-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. SwiftUI Academy-kurssilla on yhteensä 4 oppituntia.

Siirtyminen vaakasuuntaan

Joskus näkymät kuuluvat vierekkäin eivätkä allekkain. Tällöin tarvitsette VStackin vaakasuuntaisen sisaruksen. ➡️

HStack-esittely

HStack järjestää alinäky-mänsä vaakasuunnassa vasemmalta oikealle. Se sopii täydellisesti riveille, kuten kuvakkeelle selitteen vieressä.

Ensimmäinen HStackinne

Sijoittakaa näkymät HStack-aaltosulkeiden sisään, niin ne asettuvat ruudulle kirjoittamassanne järjestyksessä.

HStack {
    Text("Left")
    Text("Right")
}

Järjestys vasemmalta oikealle

HStackissa ensimmäinen alinäky-mä sijoittuu leading-reunaan ja myöhemmät näkymät seuraavat kohti trailing-reunaa. Koodin järjestys on vasemmalta oikealle etenevä järjestys.

Kuvake ja selite

Tyypillisessä HStackissa Image yhdistetään Text-näkymään, jotta kuvake ja sen selite pysyvät samalla rivillä, kuten asetukset-näkymän rivillä.

HStack {
    Image(systemName: "bell")
    Text("Alerts")
}

Pystysuunnassa keskitetty

Oletusarvoisesti HStack kohdistaa alinäky-mänsä pystysuuntaiseen keskikohtaan, joten korkea kuva ja lyhyt teksti asettuvat siististi keskiviivansa mukaan.

HStack myötäilee sisältöään

VStackin tavoin HStack kutistuu alinäky-mänsä kokoiseksi sen sijaan, että täyttäisi koko leveyden. Se vie vain tarvitsemansa tilan.

HStackin ja VStackin yhdistäminen

Sisäkkäistäkää HStack VStackin sisään rakentaaksenne kortin: otsikkorivi ylös ja tietorivi sen alle. Molempien suuntien yhdistäminen mahdollistaa oikeat asettelut.

VStack {
    Text("Title")
    HStack {
        Text("A")
        Text("B")
    }
}

HStack on näkymä

HStack on myös näkymä, joten muuntajat, kuten padding tai background, kohdistuvat koko riviin kerralla ja käsittelevät sitä yhtenä lohkona.

Rivit, joissa on erilaista sisältöä

HStack sisältää mielellään erityyppisiä näkymiä yhdessä, kuten numeron, selitteen ja painikkeen samalla vaakarivillä.

HStack {
    Text("42")
    Button("Add") { }
}

Milloin HStack kannattaa valita

Käyttäkää HStackia aina, kun kohteet luetaan vasemmalta oikealle: selite ja arvo, painikkeista koostuva työkalurivi tai avatar nimen vieressä.

Pikatarkistus

Varmistetaan, miten HStack asettelee näkymät.

Vastaa interaktiivisessa oppitunnissa

Kertaus: vaakarivit

Edistytte hienosti! HStack asettaa näkymät riviin vasemmalta oikealle, keskittää ne pystysuunnassa ja toimii erinomaisesti yhdessä VStackin kanssa korttien ja rivien rakentamisessa. 🙌

Aloita maksutta

Opi Swift 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

Aloita opiskelu maksutta Näytä koko kurssi

Usein kysytyt kysymykset

Onko oppitunti ”Rivit HStackilla” ilmainen?

Kyllä – oppitunnin ”Rivit HStackilla” 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 SwiftUI Academy-kurssin, päivitä CoddyKit PROhon. SwiftUI Academy-kurssilla on yhteensä 4 oppituntia.

Mitä opin oppitunnilla ”Rivit HStackilla”?

Sijoita näkymät vierekkäin vaakasuunnassa Harjoittelet SwiftUI Academy-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.

Tarvitsenko kokemusta aloittaakseni SwiftUI Academy-opiskelun?

Aiempi kokemus ei ole tarpeen. CoddyKitin SwiftUI Academy-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 2/4.

Kuinka kauan ”Rivit HStackilla”-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ä SwiftUI Academy-oppitunnilla?

Kyllä. Jokainen SwiftUI 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

← Takaisin: SwiftUI Academy