SwiftUI Academy · leksjon

ButtonStyle og LabelStyle

Bygg profilerte, gjenbrukbare stiler for kontroller.

Leksjon 3 av 413 trinn

ButtonStyle og LabelStyle er en gratis leksjon i SwiftUI Academy på CoddyKit. Dette er leksjon 3 av 4. Du kan lese hele leksjonen gratis nedenfor – og deretter øve praktisk i nettleseren med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt. Den er en del av læringsløpet i SwiftUI Academy, og fremdriften din synkroniseres mellom nettet og CoddyKit-appen. Kurset i SwiftUI Academy inneholder totalt 4 leksjoner.

Stillegg kontroller, ikke forekomster

Det blir kjedelig å endre stilen på hver knapp manuelt. En ButtonStyle definerer ett merkevaretilpasset utseende som De kan gjenbruke i hele appen. 🎨

Protokollen ButtonStyle

La en struct samsvare med ButtonStyle, og implementer makeBody. Den mottar en konfigurasjon og returnerer den stilsette knappen.

struct PrimaryStyle: ButtonStyle {
    func makeBody(configuration: Configuration) -> some View {
        configuration.label
    }
}

label i Configuration

Konfigurasjonen gir Dem knappens label, altså tittelen eller innholdet. De dekorerer denne label-en med utfylling og farge.

configuration.label
    .padding()
    .background(.blue)

Reagere på isPressed

Konfigurasjonen eksponerer også isPressed. Bruk den til å dempe eller skalere knappen mens fingeren holdes nede, slik at De får taktil tilbakemelding.

configuration.label
    .opacity(configuration.isPressed ? 0.6 : 1)

Bruke med buttonStyle

Knytt stilen til med modifikatoren .buttonStyle. Alle knapper den brukes på, får det samme merkevaretilpassede utseendet.

Button("Save") { }
    .buttonStyle(PrimaryStyle())

Stilsette en hel beholder

Angi .buttonStyle på en stabel, så arver alle knappene inni den stilen. Én linje stilsetter en hel gruppe kontroller.

Det finnes også innebygde stiler

SwiftUI leveres med ferdige stiler som .bordered og .borderedProminent. Bruk disse før De skriver en egendefinert stil.

Button("Go") { }
    .buttonStyle(.borderedProminent)

Møt LabelStyle

En Label kobler tekst sammen med et ikon. En LabelStyle bestemmer hvordan dette paret plasseres og vises.

Label("Home", systemImage: "house")

Bare tittel eller bare ikon

Innebygde label-stiler lar Dem vise bare tittelen, bare ikonet eller begge deler. Bytt etter hvor mye plass De har, uten å endre kallstedet.

Label("Home", systemImage: "house")
    .labelStyle(.iconOnly)

Egendefinert LabelStyle

Implementer LabelStyle og implementer makeBody for å omorganisere ikonet og tittelen selv, for eksempel ved å stable dem loddrett.

func makeBody(configuration: Configuration) -> some View {
    VStack { configuration.icon; configuration.title }
}

Én definisjon, mange knapper

Egendefinerte stiler samler utseende og oppførsel på ett sted. Juster stilen, så oppdateres alle knapper og etiketter i appen samtidig.

Rask kontroll

En rask kontroll av kontrollstiler.

Besvar den i den interaktive leksjonen

Oppsummering: Gjenbrukbare kontrollutseender

Bruk ButtonStyle og LabelStyle til å definere profilerte kontroller én gang. Reager på isPressed, omorganiser etiketter og bruk utseendet overalt. 🧠

Gratis å komme i gang

Lær deg Swift med en AI-veileder – gratis

Skriv og kjør ekte kode i nettleseren, få umiddelbar hjelp fra en AI-veileder som er tilgjengelig døgnet rundt, og fortsett der du slapp – på nettet eller i appen.

Kurs: 30
Leksjoner: 120

Start læringen gratis Se hele kurset

Ofte stilte spørsmål

Er leksjonen «ButtonStyle og LabelStyle» gratis?

Ja – hele teksten i «ButtonStyle og LabelStyle» er gratis å lese her på nettet. For å øve interaktivt med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt, og for å låse opp resten av SwiftUI Academy-kurset, kan du oppgradere til CoddyKit PRO. Kurset i SwiftUI Academy inneholder totalt 4 leksjoner.

Hva lærer jeg i «ButtonStyle og LabelStyle»?

Bygg profilerte, gjenbrukbare stiler for kontroller. Du øver på SwiftUI Academy med praktisk kode som du kjører direkte i nettleseren, mens en AI-veileder som er tilgjengelig døgnet rundt, svarer på spørsmålene dine mens du jobber deg gjennom leksjonen.

Trenger jeg erfaring for å begynne med SwiftUI Academy?

Ingen tidligere erfaring er nødvendig. SwiftUI Academy på CoddyKit er lagt opp for både nybegynnere og viderekomne, så De kan begynne her eller helt fra start og lære i Deres eget tempo. Dette er leksjon 3 av 4.

Hvor lang tid tar leksjonen «ButtonStyle og LabelStyle»?

De fleste CoddyKit-leksjoner tar omtrent 5–10 minutter. Hver leksjon er kort og interaktiv, slik at De gjør jevne fremskritt og kan fortsette akkurat der De slapp – både på nettet og i appen.

Kan jeg skrive og kjøre kode i denne SwiftUI Academy-leksjonen?

Ja. Alle SwiftUI Academy-leksjoner har en innebygd kodeeditor, slik at De kan skrive og kjøre ekte kode direkte i nettleseren og få umiddelbar tilbakemelding fra AI – uten lokal konfigurering.

Alle leksjonene i dette kurset

← Tilbake til SwiftUI Academy