在图像视图上快速创建倾斜的切割

Question

I have been looking around the internet and I can't find a good solution for making a slanted cut on an image view that works for swift.

Here is what I want

As you can see I would like to slant an image view as seen in the background. If anyone had some thoughts or solutions, that would be much appreciated.

Answer 1

Properties:

fileprivate var headerView: PostHeaderView!
fileprivate var headerMaskLayer: CAShapeLayer!

In viewDidLoad():

headerMaskLayer = CAShapeLayer()
    headerMaskLayer.fillColor = UIColor.black.cgColor
    headerView.layer.mask = headerMaskLayer

    updateHeaderView()

Then use this function:

func updateHeaderView() {
    let effectiveHeight = Storyboard.tableHeaderHeight - Storyboard.tableHeaderCutAway / 2

    var headerRect = CGRect(x: 0, y: -effectiveHeight, width: tableView.bounds.width, height: Storyboard.tableHeaderHeight)

    headerView.logoImageView.alpha = 0

    if tableView.contentOffset.y < -effectiveHeight {
        headerRect.origin.y = tableView.contentOffset.y
        headerRect.size.height = -tableView.contentOffset.y + Storyboard.tableHeaderCutAway/2

        let final: CGFloat = -100
        let alpha =  min((tableView.contentOffset.y + effectiveHeight) / final, 1)
        headerView.logoImageView.alpha = alpha
    }

    headerView.frame = headerRect

    // cut away
    let path = UIBezierPath()
    path.move(to: CGPoint(x: 0, y: 0))
    path.addLine(to: CGPoint(x: headerRect.width, y: 0))
    path.addLine(to: CGPoint(x: headerRect.width, y: headerRect.height))
    path.addLine(to: CGPoint(x: 0, y: headerRect.height - Storyboard.tableHeaderCutAway))
    headerMaskLayer?.path = path.cgPath
}