Skip to content

Instantly share code, notes, and snippets.

@hmhmsh
Last active July 11, 2024 02:56
Show Gist options
  • Save hmhmsh/4d424dfcc19ffc9126d15e5d52aa43f8 to your computer and use it in GitHub Desktop.
Save hmhmsh/4d424dfcc19ffc9126d15e5d52aa43f8 to your computer and use it in GitHub Desktop.
SwiftUIで一部角丸の枠線を引く
import SwiftUI
struct MaskedCornerRoundedRectangle: Shape {
let topLeadingRadius: CGFloat
let bottomLeadingRadius: CGFloat
let bottomTrailingRadius: CGFloat
let topTrailingRadius: CGFloat
init(topLeadingRadius: CGFloat = 0, bottomLeadingRadius: CGFloat = 0, bottomTrailingRadius: CGFloat = 0, topTrailingRadius: CGFloat = 0) {
self.topLeadingRadius = topLeadingRadius
self.bottomLeadingRadius = bottomLeadingRadius
self.bottomTrailingRadius = bottomTrailingRadius
self.topTrailingRadius = topTrailingRadius
}
func path(in rect: CGRect) -> Path {
Path { path in
if topLeadingRadius > 0 {
path.addArc(
center: CGPoint(x: rect.minX + topLeadingRadius, y: rect.minY + topLeadingRadius),
radius: topLeadingRadius,
startAngle: .degrees(180),
endAngle: .degrees(-90),
clockwise: false
)
} else {
path.move(to: CGPoint(x: rect.minX, y: rect.minY))
}
if topTrailingRadius > 0 {
path.addLine(to: CGPoint(x: rect.maxX - topTrailingRadius, y: rect.minY))
path.addArc(
center: CGPoint(x: rect.maxX - topTrailingRadius, y: rect.minY + topTrailingRadius),
radius: topTrailingRadius,
startAngle: .degrees(-90),
endAngle: .degrees(0),
clockwise: false
)
} else {
path.addLine(to: CGPoint(x: rect.maxX, y: rect.minY))
}
if bottomTrailingRadius > 0 {
path.addLine(to: CGPoint(x: rect.maxX, y: rect.maxY - bottomTrailingRadius))
path.addArc(
center: CGPoint(x: rect.maxX - bottomTrailingRadius, y: rect.maxY - bottomTrailingRadius),
radius: bottomTrailingRadius,
startAngle: .degrees(0),
endAngle: .degrees(90),
clockwise: false
)
} else {
path.addLine(to: CGPoint(x: rect.maxX, y: rect.maxY))
}
if bottomLeadingRadius > 0 {
path.addLine(to: CGPoint(x: rect.minX + bottomLeadingRadius, y: rect.maxY))
path.addArc(
center: CGPoint(x: rect.minX + bottomLeadingRadius, y: rect.maxY - bottomLeadingRadius),
radius: bottomLeadingRadius,
startAngle: .degrees(90),
endAngle: .degrees(180),
clockwise: false
)
} else {
path.addLine(to: CGPoint(x: rect.minX, y: rect.maxY))
}
path.closeSubpath()
}
}
}
Color.red
.overlay {
MaskedCornerRoundedRectangle(topLeadingRadius: 8)
.stroke(Color.blue, lineWidth: 1)
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment