Last active
July 11, 2024 02:56
-
-
Save hmhmsh/4d424dfcc19ffc9126d15e5d52aa43f8 to your computer and use it in GitHub Desktop.
SwiftUIで一部角丸の枠線を引く
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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() | |
} | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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