SwiftUI Academy · Oppitunti

Mukautetut ViewModifierit

Kootkaa muokkainketjut yhdeksi muokkaimeksi.

Oppitunti 2/413 vaihetta

Mukautetut ViewModifierit 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.

Usein käyttämänne muunnokset

Ketjutatte jatkuvasti samaa täytettä, taustaa ja kulman sädettä. Mukautettu ViewModifier kokoaa tämän ketjun yhdeksi uudelleenkäytettäväksi vaiheeksi. ✨

ViewModifier-protokolla

Mukautettu muunnos on ViewModifier-protokollan toteuttava struct. Sen body ympäröi saapuvan sisällön haluamallanne tyylillä.

struct CardStyle: ViewModifier {
    func body(content: Content) -> some View {
        content.padding()
    }
}

content-parametri

Saate bodyn sisällä alkuperäisen näkymän content-parametrina. Palautatte uuden näkymän, joka koristelee sitä, ei korvaa sen näyttämää sisältöä.

Käyttäkää .modifier-metodilla

Liittäkää muunnos mihin tahansa näkymään .modifier-metodilla. Sama ulkoasu otetaan nyt käyttöön yhdellä selkeällä kutsulla.

Text("Hi").modifier(CardStyle())

Käärikää se laajennukseen

Muoto .modifier(CardStyle()) on kömpelö. Lisätkää View extension -laajennus, jotta tyylitys näyttää sisäänrakennetulta muunnokselta.

extension View {
    func cardStyle() -> some View {
        modifier(CardStyle())
    }
}

Nyt käyttö on selkeää

Laajennuksen ansiosta käyttö tuntuu natiivilta. Yksi method-metodin nimi sisältää koko tyylitysketjun.

Text("Hi").cardStyle()

Lisätkää parametreja

Antakaa muunnokselle tallennettuja properties-ominaisuuksia, jotta kutsuja voi säätää sitä. Välittäkää ne myös laajennusmetodinne kautta.

struct CardStyle: ViewModifier {
    var color: Color
    func body(content: Content) -> some View {
        content.background(color)
    }
}

Yhdistäkää useita muunnoksia

Mukautettu muunnos voi ketjuttaa useita sisäänrakennettuja muunnoksia. Näin kätkette kokonaisen design recipe -tyyliohjeen yhden nimen taakse.

content.padding().background(.gray).cornerRadius(12)

Yhtenäisyys koko sovelluksessa

Kun jokainen kortti käyttää samaa muunnosta, käyttöliittymänne pysyy consistent-yhtenäisenä. Päivittäkää muunnos kerran, niin koko sovellus seuraa muutosta.

Muunnos vai eroteltu näkymä

Käyttäkää modifier-muunnosta minkä tahansa sisällön tyylin muuttamiseen ja eroteltua näkymää kiinteään asetteluun. Muunnokset koristelevat, näkymät määrittävät rakenteen.

Järjestyksellä on edelleen merkitystä

Bodyn sisällä muunnosten order-järjestys toimii kuten tavallisesti. Taustan lisääminen ennen täytettä antaa eri tuloksen kuin täytteen lisääminen ennen taustaa, joten järjestäkää ne huolellisesti.

Pikatarkistus

Pikatarkistus mukautetuista muunnoksista.

Vastaa interaktiivisessa oppitunnissa

Kertaus: kootkaa tyylinne

ViewModifier kokoaa tyylitysketjun yhdeksi uudelleenkäytettäväksi vaiheeksi, ja View-laajennus antaa sille selkeän piste-syntaksin. Tyylitelkää kerran, käyttäkää kaikkialla. 🧠

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 ”Mukautetut ViewModifierit” ilmainen?

Kyllä – oppitunnin ”Mukautetut ViewModifierit” 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 ”Mukautetut ViewModifierit”?

Kootkaa muokkainketjut yhdeksi muokkaimeksi. 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 ”Mukautetut ViewModifierit”-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

Uudelleenkäytettävien näkymien erottaminen
Mukautetut ViewModifierit
ButtonStyle ja LabelStyle
ViewBuilder ja geneeriset säilöt

← Takaisin: SwiftUI Academy