-
-
Save henrinormak/96c8918e7baa23d5b10a to your computer and use it in GitHub Desktop.
Answer to StackOverflow question - http://stackoverflow.com/questions/30018970/create-hexagon-imageview-shape-in-ios
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 UIKit | |
public func roundedPolygonPath(rect: CGRect, lineWidth: CGFloat, sides: NSInteger, cornerRadius: CGFloat, rotationOffset: CGFloat = 0) -> UIBezierPath { | |
let path = UIBezierPath() | |
let theta: CGFloat = CGFloat(2.0 * Double.pi) / CGFloat(sides) // How much to turn at every corner | |
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 | |
} | |
public func createImage(layer: CALayer) -> UIImage! { | |
let size = CGSize(width: layer.frame.maxX, height: layer.frame.maxY) | |
UIGraphicsBeginImageContextWithOptions(size, layer.isOpaque, 0.0) | |
let ctx = UIGraphicsGetCurrentContext()! | |
layer.render(in: ctx) | |
let image = UIGraphicsGetImageFromCurrentImageContext() | |
UIGraphicsEndImageContext() | |
return image! | |
} | |
let lineWidth = CGFloat(2.0) | |
let rect = CGRect(x: 0.0, y: 0.0, width: 150.0, height: 150.0) | |
let sides = 5 | |
let rotationOffset = CGFloat(Double.pi / 2.0) | |
var path = roundedPolygonPath(rect: rect, lineWidth: lineWidth, sides: sides, cornerRadius: 15.0, rotationOffset: rotationOffset) | |
let borderLayer = CAShapeLayer() | |
borderLayer.frame = CGRect(x: 0.0, y: 0.0, width: path.bounds.width + lineWidth, height: path.bounds.height + lineWidth) | |
borderLayer.path = path.cgPath | |
borderLayer.lineWidth = lineWidth | |
borderLayer.lineJoin = kCALineJoinRound | |
borderLayer.lineCap = kCALineCapRound | |
borderLayer.strokeColor = UIColor.black.cgColor | |
borderLayer.fillColor = UIColor.white.cgColor | |
var image = createImage(layer: borderLayer) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Swift 5
Usage