SwiftUI Academy · Les

Aangepaste uitlijningshulplijnen

Lijn weergaven nauwkeurig uit binnen de hiërarchie.

Les 2 van 413 stappen

Aangepaste uitlijningshulplijnen is een gratis SwiftUI Academy-les op CoddyKit. Dit is les 2 van 4. Je kunt de volledige les hieronder gratis lezen en daarna in de browser praktisch oefenen met een ingebouwde code-editor en een AI-begeleider die 24/7 beschikbaar is. Deze les maakt deel uit van het leertraject SwiftUI Academy. Je voortgang wordt gesynchroniseerd op het web en in de CoddyKit-app. De cursus SwiftUI Academy bevat in totaal 4 lessen.

Alles op één lijn

Stacks lijnen onderliggende weergaven uit via een gedeelde rand of het midden. Met uitlijningshulplijnen bepaalt u precies waar die lijn komt. 📏

Ingebouwde uitlijningen

Een HStack gebruikt een verticale uitlijning zoals .top of .center, terwijl een VStack een horizontale uitlijning gebruikt.

HStack(alignment: .top) {
    Text("A")
    Text("Big")
}

De modifier alignmentGuide

De modifier alignmentGuide bepaalt opnieuw waar één weergave een bepaalde uitlijning aan de bovenliggende weergave beschikbaar stelt.

Text("Hi")
    .alignmentGuide(.top) { d in d[.bottom] }

Afmetingen uitlezen

De afsluiting ontvangt een waarde van het type ViewDimensions, waarmee u d.width, d.height of een benoemde hulplijn kunt uitlezen.

Text("Hi").alignmentGuide(.leading) { d in
    d.width / 2
}

De hulplijn verschuiven

Als u een ander getal teruggeeft, verschuift u de weergave ten opzichte van de andere weergaven, omdat de bovenliggende weergave iedereen uitlijnt op die teruggegeven waarde.

Aangepaste uitlijnings-ID

Definieer voor hergebruik een type dat voldoet aan AlignmentID, met een defaultValue voor gevallen zonder uitlijning.

struct MidBadge: AlignmentID {
    static func defaultValue(in d: ViewDimensions) -> CGFloat {
        d[.bottom]
    }
}

Geef de uitlijning een naam

Breid VerticalAlignment of HorizontalAlignment uit met een statische eigenschap die aan uw AlignmentID is gekoppeld.

extension VerticalAlignment {
    static let midBadge = VerticalAlignment(MidBadge.self)
}

De aangepaste lijn gebruiken

Geef uw benoemde alignment door aan een stack en markeer daarna de weergaven die op deze aangepaste lijn moeten uitlijnen.

HStack(alignment: .midBadge) {
    Avatar()
    Label()
}

Deelnemers markeren

Elke weergave die dezelfde lijn moet delen, stelt alignmentGuide voor uw aangepaste uitlijning in op het punt waarop deze wil uitlijnen.

Label()
    .alignmentGuide(.midBadge) { d in
        d[VerticalAlignment.center]
    }

Kracht over hiërarchieën heen

Aangepaste hulplijnen zijn vooral nuttig wanneer weergaven in verschillende containers staan maar toch moeten uitlijnen, bijvoorbeeld een bijschrift met het midden van een pictogram over meerdere kolommen heen. ✨

Let op de standaardwaarde

Elke weergave die uw aangepaste hulplijn niet instelt, valt terug op de defaultValue. Kies die standaardwaarde dus zorgvuldig.

Korte controle

Haal u voor de geest wat de alignmentGuide-afsluiting ontvangt.

Beantwoord dit in de interactieve les

Samenvatting

U kunt nu de uitlijning overschrijven met alignmentGuide en aangepaste typen van AlignmentID definiëren om weergaven door de hele hiërarchie heen uit te lijnen. 🎉

Gratis beginnen

Leer Swift met een AI-tutor — gratis

Schrijf echte code en voer die uit in je browser, krijg direct hulp van een AI-tutor die 24/7 beschikbaar is en ga verder waar je gebleven bent op het web of in de app.

Cursussen: 30
Lessen: 120

Gratis beginnen met leren Bekijk de volledige cursus

Veelgestelde vragen

Is de les “Aangepaste uitlijningshulplijnen” gratis?

Ja — de volledige tekst van “Aangepaste uitlijningshulplijnen” kun je hier gratis op het web lezen. Als je interactief wilt oefenen met een ingebouwde code-editor en een AI-begeleider die 24/7 beschikbaar is, en de rest van de cursus SwiftUI Academy wilt ontgrendelen, kun je upgraden naar CoddyKit PRO. De cursus SwiftUI Academy bevat in totaal 4 lessen.

Wat leer ik in “Aangepaste uitlijningshulplijnen”?

Lijn weergaven nauwkeurig uit binnen de hiërarchie. Je oefent met SwiftUI Academy door code rechtstreeks in de browser uit te voeren. Een AI-begeleider die 24/7 beschikbaar is beantwoordt je vragen terwijl je de les doorwerkt.

Heb ik ervaring nodig om met SwiftUI Academy te beginnen?

Ervaring vooraf is niet nodig. SwiftUI Academy op CoddyKit is opgebouwd voor beginners tot gevorderden, zodat je hier of bij het begin kunt starten en in je eigen tempo kunt leren. Dit is les 2 van 4.

Hoe lang duurt de les “Aangepaste uitlijningshulplijnen”?

De meeste lessen van CoddyKit duren ongeveer 5–10 minuten. Elke les is kort en interactief, zodat je gestaag vooruitgaat en op het web en in de app precies verdergaat waar je was gebleven.

Kan ik code schrijven en uitvoeren in deze les over SwiftUI Academy?

Ja. Elke les over SwiftUI Academy bevat een ingebouwde code-editor, zodat je rechtstreeks in je browser echte code kunt schrijven en uitvoeren en direct feedback van AI krijgt — lokale installatie is niet nodig.

Alle lessen in deze cursus

← Terug naar SwiftUI Academy