SwiftUI Academy · Lezione

Stroke, fill e overlay

Delineare e riempire le forme per creare badge e schede.

Lezione 4 di 413 passaggi

Stroke, fill e overlay è una lezione SwiftUI Academy gratuita su CoddyKit. Questa è la lezione 4 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento SwiftUI Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso SwiftUI Academy include 4 lezioni in totale.

Fill e stroke

Una forma può essere colorata all'interno con fill oppure contornata con stroke. Insieme Le permettono di creare badge e schede.

Riempire una forma

Usi fill per colorare completamente l'interno di una forma con un colore o un gradiente. È il modo più comune per colorare una forma. 🎨

Circle()
    .fill(.blue)

Contornare con stroke

Il modificatore stroke disegna solo il bordo di una forma, lasciando vuoto il centro. È perfetto per anelli vuoti e contorni.

Circle()
    .stroke(.blue)

Controllare la larghezza della linea

Passi un lineWidth a stroke per rendere il contorno più spesso o più sottile. Un numero maggiore produce un bordo più marcato.

Circle()
    .stroke(.blue, lineWidth: 4)

Bordi tratteggiati

Usi un StrokeStyle con un motivo di trattini per creare contorni tratteggiati. È ideale per segnaposto e aree di rilascio nell'interfaccia.

RoundedRectangle(cornerRadius: 12)
    .stroke(style: StrokeStyle(lineWidth: 2, dash: [6]))

Fill e stroke insieme

Desidera sia un riempimento sia un bordo? Usi fill con un argomento stroke per riempire e contornare in un'unica chiamata.

Circle()
    .fill(.yellow)
    .stroke(.orange, lineWidth: 3)

Ecco overlay

Il modificatore overlay sovrappone una vista a un'altra. Lo usi per aggiungere un bordo, un badge o un'icona sopra il contenuto esistente.

Bordi tramite overlay

Un trucco classico: riempia una forma, quindi aggiunga una copia con contorno usando overlay. Otterrà una scheda riempita e pulita, con un bordo nitido.

RoundedRectangle(cornerRadius: 12)
    .fill(.white)
    .overlay(
        RoundedRectangle(cornerRadius: 12)
            .stroke(.gray, lineWidth: 1))

Sovrapporre un'icona

Può sovrapporre qualsiasi vista, non solo le forme. Aggiunga un piccolo badge o un'icona a una scheda per evidenziare elementi nuovi o importanti.

Circle()
    .fill(.blue)
    .overlay(Text("3").foregroundStyle(.white))

overlay e background

Ricordi i livelli: overlay si trova sopra una vista, mentre background si trova dietro. Scelga in base al lato su cui desidera la decorazione.

Creare un badge

Combini fill, stroke e overlay per creare badge, avatar e schede rifiniti. Questi tre strumenti coprono la maggior parte delle decorazioni. ✨

Verifica rapida

Desidera sovrapporre un bordo tracciato a una forma riempita. Quale modificatore posiziona una vista in primo piano?

Rispondi nella lezione interattiva

Riepilogo: Stroke, Fill e overlay

Ha imparato a colorare le forme con fill, a contornarle con stroke e ad aggiungere elementi con overlay. Ora può creare badge e schede reali!

Gratis per iniziare

Impara Swift con un tutor IA — gratis

Scrivi ed esegui vero codice nel tuo browser, ricevi aiuto istantaneo da un tutor IA disponibile 24/7, e riprendi da dove hai lasciato sul web o nell'app.

Corsi: 30
Lezioni: 120

Inizia a imparare gratis Visualizza il corso completo

Domande Frequenti

La lezione «Stroke, fill e overlay» è gratuita?

Sì — il testo completo di «Stroke, fill e overlay» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso SwiftUI Academy, passa a CoddyKit PRO. Il corso SwiftUI Academy include 4 lezioni in totale.

Cosa imparerò in «Stroke, fill e overlay»?

Delineare e riempire le forme per creare badge e schede. Eserciti SwiftUI Academy con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.

Ho bisogno di esperienza per iniziare SwiftUI Academy?

Non è richiesta alcuna esperienza precedente. SwiftUI Academy su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 4 di 4.

Quanto tempo richiede la lezione «Stroke, fill e overlay»?

La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.

Posso scrivere ed eseguire codice in questa lezione SwiftUI Academy?

Sì. Ogni lezione SwiftUI Academy include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.

Tutte le lezioni di questo corso

← Torna a SwiftUI Academy