Swift Academy · Oppitunti

Näkymien identiteetin ymmärtäminen

Hallitse, miten SwiftUI vertaa ja käyttää näkymiä uudelleen.

Oppitunti 1/413 vaihetta

Näkymien identiteetin ymmärtäminen on ilmainen Swift 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 Swift Academy-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. Swift Academy-kurssilla on yhteensä 4 oppituntia.

Identiteetti ohjaa SwiftUI:ta

SwiftUI seuraa jokaista näkymää sen identiteetin perusteella päättääkseen, päivitetäänkö olemassa olevaa näkymää vai luodaanko uusi.

Oikein määritetty identiteetti on tärkein yksittäinen tekijä oikeellisuuden ja suorituskyvyn kannalta.

Kaksi identiteetin tyyppiä

SwiftUI käyttää kahta muotoa: rakenteellista identiteettiä, joka perustuu näkymän sijaintiin näkymäpuussa, ja eksplisiittistä identiteettiä, jonka määritätte itse.

Rakenteellinen identiteetti

Oletusarvoisesti näkymän identiteetti määräytyy sen sijainnista hierarkiassa. Alla olevat if-haarat luovat kaksi rakenteellisesti erillistä näkymää.

var body: some View {
    if isOn {
        Text("On")  // one identity
    } else {
        Text("Off") // a different identity
    }
}

Miksi haarat menettävät tilan

Koska kullakin haaralla on eri rakenteellinen identiteetti, haarojen välillä vaihtaminen tuhoaa ensimmäisen näkymän ja luo toisen. Sen sisällä oleva @State nollautuu.

if isExpanded {
    DetailView() // new instance each time the branch flips
} else {
    SummaryView()
}

Eksplisiittinen identiteetti id()-metodilla

Määrite .id(_:) asettaa eksplisiittisen identiteetin. Kun id muuttuu, SwiftUI saa tiedon, että kyseessä on eri näkymä, joten se luo uuden instanssin ja nollaa tilan.

CounterView()
    .id(selectedTab) // new identity per tab

Identiteetti ForEach-rakenteessa

ForEach tarvitsee jokaiselle elementille vakaan identiteetin. Käyttäkää vakaaseen id-arvoon viittaavaa avainpolkua, älkää koskaan taulukon indeksiä muuttuvissa kokoelmissa.

ForEach(items, id: \.id) { item in
    RowView(item: item)
}

Indeksi-identiteetin sudenkuoppa

id: \.self-määrityksen käyttäminen indekseihin tai muuttuviin arvoihin saa identiteetit vaihtumaan datan muuttuessa. Tämä aiheuttaa virheellisiä animaatioita ja tilan menettämistä.

// Risky if items reorder or values repeat:
// ForEach(0..<items.count, id: \.self) { ... }

Identiteetti ja animaatio

Animaatiot interpoloivat saman identiteetin tilojen välillä. Jos identiteetti muuttuu, SwiftUI suorittaa lisäys- ja poisto-siirtymän tasaisen animaation sijaan.

withAnimation {
    // same identity -> property animates
    // changed id     -> transition (fade/slide)
}

Ehdolliset määritteet muuttavat identiteettiä

Määritteen käyttäminen if-haaran sisällä voi muuttaa rakenteellista identiteettiä ja nollata tilan. Käyttäkää mieluummin yhtä näkymää, jonka määritteen arvo lasketaan ehdollisesti.

// Better: keep one identity
Text("Hi")
    .opacity(isHidden ? 0 : 1)
// Worse: branching creates two identities

AnyView häivyttää identiteettitiedot

Näkymien kääriminen AnyView-tyyppiin piilottaa niiden tyypin SwiftUI:lta ja heikentää sen kykyä vertailla näkymiä tehokkaasti. Käyttäkää mahdollisuuksien mukaan konkreettisia tyyppejä tai @ViewBuilder-rakennetta.

// Prefer @ViewBuilder over returning AnyView
@ViewBuilder
func content() -> some View {
    if flag { A() } else { B() }
}

Vakaa identiteetti tarkoittaa vakaata tilaa

Nyrkkisääntö on seuraava: pitäkää identiteetti vakaana, kun haluatte säilyttää tilan ja sujuvat animaatiot, ja vaihtakaa identiteettiä tarkoituksella vain silloin, kun todella haluatte aloittaa alusta.

Pikatesti: näkymän identiteetti

Testatkaa ymmärrystänne näkymän identiteetistä.

Vastaa interaktiivisessa oppitunnissa

Kertaus: näkymän identiteetin ymmärtäminen

SwiftUI tunnistaa näkymät rakenteellisesti, eli puusijainnin perusteella, ja eksplisiittisesti määritteellä .id. Vakaa identiteetti säilyttää @State-tilan ja mahdollistaa ominaisuuksien sujuvan animoinnin. Identiteetin muuttaminen nollaa tilan ja käynnistää siirtymät.

Antakaa ForEach-rakenteelle vakaat id-arvot, välttäkää indeksin käyttämistä muuttuvan datan identiteettinä, minimoikaa identiteettiä vaihtavat haarat ja välttäkää AnyView-tyyppiä, kun konkreettinen tyyppi toimii.

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: 122
Oppitunnit: 409

Aloita opiskelu maksutta Näytä koko kurssi

Usein kysytyt kysymykset

Onko oppitunti ”Näkymien identiteetin ymmärtäminen” ilmainen?

Kyllä — voit lukea täällä verkossa kokonaan ilmaiseksi mitkä tahansa Swift Academy-oppimispolun 3 oppituntia, myös oppitunnin “Näkymien identiteetin ymmärtäminen”. Sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä interaktiiviset harjoitukset sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. Swift Academy-kurssilla on yhteensä 4 oppituntia.

Mitä opin oppitunnilla ”Näkymien identiteetin ymmärtäminen”?

Hallitse, miten SwiftUI vertaa ja käyttää näkymiä uudelleen. Harjoittelet Swift Academy-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.

Tarvitsenko kokemusta aloittaakseni Swift Academy-opiskelun?

Aiempi kokemus ei ole tarpeen. CoddyKitin Swift 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 ”Näkymien identiteetin ymmärtäminen”-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ä Swift Academy-oppitunnilla?

Kyllä. Jokainen Swift 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: Swift Academy