SwiftUI CGAffineTransform
Main Idea
The first is CGAffineTransform, which describes how a path or view should be rotated, scaled, or sheared; and the second is even-odd fills, which allow us to control how overlapping shapes should be rendered. CGAffineTransform can be used to store rotation and translation data.
https://www.hackingwithswift.com/books/ios-swiftui/creative-borders-and-fills-using-imagepaint
struct Flower: Shape {
var petalOffset = -20.0
var petalWidth = 100.0
func path(in rect: CGRect) -> Path {
var path = Path()
for number in stride(from:0, to: Double.pi * 2, by: Double.pi / 8) {
let rotation = CGAffineTransform(rotationAngle: number)
let position = rotation.concatenating(CGAffineTransform(translationX: rect.width / 2, y: rect.height / 2))
let originalPetal = Path(ellipseIn: CGRect(x: petalOffset, y: 0, width: petalWidth, height: rect.width / 2))
let rotatedPetal = originalPetal.applying(position)
path.addPath(rotatedPetal)
}
return path
}
}
struct ContentView: View {
@State private var petalOffset = -20.0
@State private var petalWidth = 100.0
var body: some View {
VStack {
Flower(petalOffset: petalOffset, petalWidth: petalWidth)
.fill(.red, style: FillStyle(eoFill: true))
Text("Offset")
Slider(value: $petalOffset, in: -40...40)
.padding([.horizontal, .bottom])
Text("Width")
Slider(value: $petalWidth, in: 0...100)
.padding(.horizontal)
}
}
}