I want to achieve a hexagon shape using UIBezierPath
like in the image below. But I don´t know how to create this kind of hexagon shape.
I´ve tried following code:
func roundedPolygonPath(rect: CGRect, lineWidth: CGFloat, sides: NSInteger, cornerRadius: CGFloat, rotationOffset: CGFloat = 0)
-> UIBezierPath {
let path = UIBezierPath()
let theta: CGFloat = CGFloat(2.0 * M_PI) / CGFloat(sides) // How much to turn at every corner
let offset: CGFloat = cornerRadius * tan(theta / 2.0) // Offset from which to start rounding corners
let width = min(rect.size.width, rect.size.height) // Width of the square
let center = CGPoint(x: rect.origin.x + width / 2.0, y: rect.origin.y + width / 2.0)
// Radius of the circle that encircles the polygon
// Notice that the radius is adjusted for the corners, that way the largest outer
// dimension of the resulting shape is always exactly the width - linewidth
let radius = (width - lineWidth + cornerRadius - (cos(theta) * cornerRadius)) / 2.0
// Start drawing at a point, which by default is at the right hand edge
// but can be offset
var angle = CGFloat(rotationOffset)
let corner = CGPoint(x: center.x + (radius - cornerRadius) * cos(angle), y: center.y + (radius - cornerRadius) * sin(angle))
path.move(to: CGPoint(x: corner.x + cornerRadius * cos(angle + theta), y: corner.y + cornerRadius * sin(angle + theta)))
for _ in 0 ..< sides {
angle += theta
let corner = CGPoint(x: center.x + (radius - cornerRadius) * cos(angle), y: center.y + (radius - cornerRadius) * sin(angle))
let tip = CGPoint(x: center.x + radius * cos(angle), y: center.y + radius * sin(angle))
let start = CGPoint(x: corner.x + cornerRadius * cos(angle - theta), y: corner.y + cornerRadius * sin(angle - theta))
let end = CGPoint(x: corner.x + cornerRadius * cos(angle + theta), y: corner.y + cornerRadius * sin(angle + theta))
path.addLine(to: start)
path.addQuadCurve(to: end, controlPoint: tip)
}
path.close()
// Move the path to the correct origins
let bounds = path.bounds
let transform = CGAffineTransform(translationX: -bounds.origin.x + rect.origin.x + lineWidth / 2.0,
y: -bounds.origin.y + rect.origin.y + lineWidth / 2.0)
path.apply(transform)
return path
}
Current code output:
for this kind of shape i took two center points and make rectangle hexagon from that
func customPolygonPath(rect: CGRect, lineWidth: CGFloat, sides: NSInteger, cornerRadius: CGFloat, rotationOffset: CGFloat = 0)
-> UIBezierPath {
let path = UIBezierPath()
let theta: CGFloat = CGFloat(2.0 * M_PI) / CGFloat(sides) // How much to turn at every corner
let offset: CGFloat = cornerRadius * tan(theta / 2.0) // Offset from which to start rounding corners
let width = min(rect.size.width, rect.size.height) // Width of the square
let height = max(rect.size.width, rect.size.height)
let upperCenter = CGPoint(x: rect.origin.x + width / 2.0, y: rect.origin.y + width / 2.0)
let bottomCenter = CGPoint(x: upperCenter.x, y: height - upperCenter.y)
let center = CGPoint(x: rect.origin.x + width / 2.0, y: rect.origin.y + height / 2.0)
// Radius of the circle that encircles the polygon
// Notice that the radius is adjusted for the corners, that way the largest outer
// dimension of the resulting shape is always exactly the width - linewidth
let radius = (width - lineWidth + cornerRadius - (cos(theta) * cornerRadius)) / 2.0
// Start drawing at a point, which by default is at the right hand edge
// but can be offset
var angle = CGFloat(rotationOffset)
let bottomCorner = CGPoint(x: bottomCenter.x + (radius - cornerRadius) * cos(angle), y: bottomCenter.y + (radius - cornerRadius) * sin(angle))
path.move(to: CGPoint(x: bottomCorner.x + cornerRadius * cos(angle + theta), y: bottomCorner.y + cornerRadius * sin(angle + theta)))
// print("corner:::\(corner)")
// print("point:::\(CGPoint(x: corner.x + cornerRadius * cos(angle + theta), y: corner.y + cornerRadius * sin(angle + theta)))")
for i in 0 ..< sides {
angle += theta
if i == 0 || i == 4 || i == 5 {
//bottomCenter
let corner = CGPoint(x: bottomCenter.x + (radius - cornerRadius) * cos(angle), y: bottomCenter.y + (radius - cornerRadius) * sin(angle))
let tip = CGPoint(x: bottomCenter.x + radius * cos(angle), y: bottomCenter.y + radius * sin(angle))
let start = CGPoint(x: corner.x + (cornerRadius * cos(angle - theta)), y: corner.y + (cornerRadius * sin(angle - theta)))
let end = CGPoint(x: corner.x + (cornerRadius * cos(angle + theta)), y: corner.y + (cornerRadius * sin(angle + theta)))
path.addLine(to: start)
path.addQuadCurve(to: end, controlPoint: tip)
}else {
//upperCenter
let corner = CGPoint(x: upperCenter.x + (radius - cornerRadius) * cos(angle), y: upperCenter.y + (radius - cornerRadius) * sin(angle))
let tip = CGPoint(x: upperCenter.x + radius * cos(angle), y: upperCenter.y + radius * sin(angle))
let start = CGPoint(x: corner.x + cornerRadius * cos(angle - theta), y: corner.y + cornerRadius * sin(angle - theta))
let end = CGPoint(x: corner.x + cornerRadius * cos(angle + theta), y: corner.y + cornerRadius * sin(angle + theta))
path.addLine(to: start)
path.addQuadCurve(to: end, controlPoint: tip)
}
}
path.close()
// Move the path to the correct origins
let bounds = path.bounds
let transform = CGAffineTransform(translationX: 0,
y: 0)
path.apply(transform)
return path
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.