SwiftUI Academy · Oppitunti

GeometryReaderin perusteet

Mitatkaa käytettävissä oleva tila sisällön koon määrittämiseksi.

Oppitunti 1/413 vaihetta

GeometryReaderin perusteet on ilmainen SwiftUI 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 SwiftUI Academy-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. SwiftUI Academy-kurssilla on yhteensä 4 oppituntia.

Tilan mittaaminen

Joskus näkymän on tiedettävä, kuinka suuri sen käytettävissä oleva tila on. GeometryReader antaa sinulle tilan tarkan koon ja sijainnin. 📐

Se on säilö

GeometryReader on näkymä, jonka body on sulkeuma. Sulkeuma vastaanottaa käytettävissä olevaa tilaa kuvaavan välityspalvelimen.

GeometryReader { proxy in
    Text("Hi")
}

Välityspalvelin

Sulkeuman parametri on GeometryProxy. Se sisältää lukijan koon, turva-alueen sisennykset ja kehyksen.

GeometryReader { proxy in
    let w = proxy.size.width
    Color.blue.frame(width: w)
}

Koon lukeminen

Yleisin käyttötapa on proxy.size, CGSize-arvo, joka kertoo käytettävissä olevan leveyden ja korkeuden.

GeometryReader { proxy in
    Text("\(proxy.size.width)")
}

Puolet leveydestä

Käyttäkää mitattua leveyttä suhteelliseen mitoitukseen, esimerkiksi palkin tekemiseen täsmälleen puoleksi käytettävissä olevasta width-arvosta.

GeometryReader { proxy in
    Color.green
        .frame(width: proxy.size.width / 2)
}

Täyttää tilan oletusarvoisesti

GeometryReader ottaa ahneesti kaiken tilan, jonka sen ylänäkymä tarjoaa, joten sen alielementit asettuvat vasempaan yläkulmaan, ellette keskitä niitä.

Sisällön keskittäminen

Koska sisältö kiinnittyy vasempaan yläkulmaan, ympäröikää se tai lisätkää frame-muunnos kohdistuksella, jotta voitte keskittää alielementit lukijan sisälle.

GeometryReader { proxy in
    Text("Center")
        .frame(width: proxy.size.width,
               height: proxy.size.height)
}

Globaalit koordinaatit

Pyytäkää näkymän sijainti ikkunan koordinaatistossa käyttämällä proxy.frame(in: .global)-kutsua. Se on kätevä vieritystehosteissa ja päällekkäisissä näkymissä.

let f = proxy.frame(in: .global)
Text("\(f.minY)")

Turva-alueen sisennykset

Proxy tarjoaa myös safeAreaInsets-arvon, joten voitte huomioida lovet ja kotiosoittimet mukautetuissa asetteluissa.

let top = proxy.safeAreaInsets.top

Käyttäkää harkiten

GeometryReader muuttaa asettelun toimintaa, joten käyttäkää sitä vain silloin, kun todella tarvitsette mittaustietoja, älkää oletusarvoisena ympäröivänä näkymänä. ⚠️

Vierityksen ohjaamat tehosteet

Yhdistämällä sen ScrollView-näkymään ja lukemalla kunkin elementin kehyksen voitte luoda vierityksen scroll-sijaintiin sidottuja parallaksi- ja häivytystehosteita.

Pikatarkistus

Palauttakaa mieleen, mitä sulkeuma välittää teille.

Vastaa interaktiivisessa oppitunnissa

Kertaus

Osaatte nyt lukea käytettävissä olevan space-tilan GeometryReaderillä, mitoittaa näkymiä suhteellisesti ja lukea kehyksiä vierityksen huomioivia tehosteita varten. 🎉

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 ”GeometryReaderin perusteet” ilmainen?

Kyllä – oppitunnin ”GeometryReaderin perusteet” 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 ”GeometryReaderin perusteet”?

Mitatkaa käytettävissä oleva tila sisällön koon määrittämiseksi. 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 1/4.

Kuinka kauan ”GeometryReaderin perusteet”-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