SwiftUI Academy · Ders

Çizgi, Dolgu ve Kaplama

Rozetler ve kartlar için şekillerin dış çizgisini ve dolgusunu uygulayın.

4. ders / 413 adım

Çizgi, Dolgu ve Kaplama, CoddyKit'te ücretsiz bir SwiftUI Academy dersidir. Bu, 4 dersinin 4. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, SwiftUI Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. SwiftUI Academy kursu toplamda 4 dersten oluşur.

Bu dersin bazı bölümleri henüz çevrilmemiş olup İngilizce olarak gösterilmektedir.

Fill vs Stroke

A shape can be painted inside with fill or outlined with stroke. Together they let you build badges and cards.

Filling a Shape

Use fill to paint the whole inside of a shape with a color or gradient. It is the most common way to color a shape. 🎨

Circle()
    .fill(.blue)

Outlining with stroke

The stroke modifier draws only the border of a shape, leaving the center empty. Perfect for hollow rings and outlines.

Circle()
    .stroke(.blue)

Controlling Line Width

Pass a lineWidth to stroke to make the outline thicker or thinner. A larger number gives a bolder border.

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

Dashed Borders

Use a StrokeStyle with a dash pattern for dashed outlines. Great for placeholders and drop zones in your UI.

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

Fill and Stroke Together

Want both a fill and a border? Use fill with a stroke argument to paint inside and outline in one call.

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

Meet the overlay

The overlay modifier layers a view on top of another. Use it to add a border, badge, or icon over existing content.

Borders via overlay

A classic trick: fill a shape, then add a stroked copy with overlay. You get a clean filled card with a crisp border.

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

Overlaying an Icon

You can overlay any view, not just shapes. Drop a small badge or icon onto a card to highlight new or important items.

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

overlay vs background

Remember the layers: overlay sits on top of a view, while background sits behind it. Pick by which side you want the decoration.

Building a Badge

Combine fill, stroke, and overlay to craft polished badges, avatars, and cards. These three tools cover most decoration. ✨

Quick Check

You want to layer a stroked border on top of a filled shape. Which modifier places a view on top?

İnteraktif derste cevapla

Recap: Stroke, Fill & overlay

You learned to paint shapes with fill, outline them with stroke, and layer extras with overlay. You can now build real badges and cards!

Başlamak ücretsiz

Yapay zeka eğitmeniyle Swift öğren — ücretsiz

Tarayıcında gerçek kod yaz ve çalıştır, 7/24 yapay zeka eğitmeninden anında yardım al; web'de ya da uygulamada kaldığın yerden devam et.

Kurslar: 30
Dersler: 120

Ücretsiz öğrenmeye başla Tüm kursu görüntüle

Sıkça Sorulan Sorular

“Çizgi, Dolgu ve Kaplama” dersi ücretsiz mi?

Evet — “Çizgi, Dolgu ve Kaplama” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve SwiftUI Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. SwiftUI Academy kursu toplamda 4 dersten oluşur.

“Çizgi, Dolgu ve Kaplama” dersinde ne öğreneceğim?

Rozetler ve kartlar için şekillerin dış çizgisini ve dolgusunu uygulayın. SwiftUI Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.

SwiftUI Academy öğrenmeye başlamak için deneyim gerekli mi?

Önceden deneyim gerekmez. CoddyKit'te SwiftUI Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 4. dersidir.

“Çizgi, Dolgu ve Kaplama” dersi ne kadar sürer?

Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.

Bu SwiftUI Academy dersinde kod yazıp çalıştırabilir miyim?

Evet. Her SwiftUI Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.

Bu kursun tüm dersleri

← SwiftUI Academy Sayfasına Dön