🔹shape.stroke()

SwiftUI ⟩ shapes ⟩ transform ⟩ .stroke()

⚠️ 注意：

• .stroke(lineWidth:), .stroke(style:) 回傳 Shape。

• .stroke(_:lineWidth:), .stroke(_:style:) 回傳 View，要注意❗️

.stroke(lineWidth:) 或 .stroke(style:) 會把「實心圖形變成空心的」，只留下「邊線」是實心的。( 👉 💈範例 )

shape with strokes
import SwiftUI
import PlaygroundSupport

// content view
struct ContentView: View {
    
    let gradient = LinearGradient(
        gradient  : Gradient(colors: [.white, .yellow, .red]), 
        startPoint: .topLeading, 
        endPoint  : .bottomTrailing
    )
    
    let dashed = StrokeStyle(lineWidth: 3, dash:[8,4])
    let borderColor: Color = .gray
    
    // view body
    var body: some View {
        HStack {

            // ⭐️ stroke once
            ZStack {
                Circle()
                    .stroke(lineWidth:40)
                    .fill(gradient)
                Circle().stroke(style: dashed)
            }.border(borderColor)

            // ⭐️ stroke twice
            Circle()
                .stroke(lineWidth:40)
                .stroke(lineWidth: 20)
                .fill(gradient).border(borderColor).opacity(0.9)

            // ⭐️ stroke 3 times
            Circle()
                .stroke(lineWidth:40)
                .stroke(lineWidth: 20)
                .stroke(lineWidth: 10)
                .fill(gradient).border(borderColor).opacity(0.9)

        }.padding(50).frame(height:300)
    }
}

// live view
PlaygroundPage.current.setLiveView(ContentView())
Previoustransform shapeNextStrokeStyle

Last updated

Was this helpful?