UIImageView蒙版图层直到滚动PageViewController第一次之前都不是来自角落 [英] UIImageView Mask Layer not coming from corners Until Scroll PageViewController First time

问题描述

我想达到这个结果

所以我需要在底部添加蒙版，但在这里我得到了

So I need to add mask at bottom but Here What I got

我尝试过的代码

 private func setupImageCutPath () {
        let path = UIBezierPath()
        path.move(to: .zero)
        path.addLine(to: CGPoint(x: 0  , y: self.imgView.frame.height))
        path.addLine(to: CGPoint(x: self.imgView.frame.width  , y: self.imgView.frame.height - imageCutAwayPart))
        path.addLine(to: CGPoint(x: self.imgView.frame.width, y: 0))


        // Multiple tried to check from where masking is comming
        self.maskLayer.fillColor = UIColor.gray.cgColor
        self.maskLayer.lineWidth = 1.0
        self.maskLayer.borderColor = UIColor.gray.cgColor
        self.maskLayer.borderWidth = 1.0
        self.maskLayer.path = path.cgPath


        self.imgView.layer.mask = self.maskLayer

    }

滚动之后第一次我得到正确的结果

After scroll First time I am getting correct result

我不明白我缺少任何帮助吗?

I don't understand What I am missing Any Help ?

推荐答案

我解决了

    path.move(to: .zero)
    /* THIS HELPLS ME */ path.addLine(to: CGPoint(x: 0  , y: self.imgView.frame.height  -  imageCutAwayPart / 2 ))
    path.addLine(to: CGPoint(x: self.imgView.frame.width   , y: self.imgView.frame.height - imageCutAwayPart))
    path.addLine(to: CGPoint(x: self.imgView.frame.width, y: 0))

但是我不明白为什么我需要移动CGPoint(x: 0 , y: self.imgView.frame.height - imageCutAwayPart / 2 )而不是这个CGPoint(x: 0 , y: self.imgView.frame.height)

But I don't understand why I need to move CGPoint(x: 0 , y: self.imgView.frame.height - imageCutAwayPart / 2 ) instead of this CGPoint(x: 0 , y: self.imgView.frame.height)

如果有人知道这一点，请张贴为答案，我一定会接受答案

If any one know this please post as answer I will surely accept the answer

编辑

Storybaord中有一个愚蠢但明智的错误

There was silly but smart mistake in Storybaord

Mistake的UIView包含屏幕快照中显示的Label.可见的部分是UIView，我认为它无法正常工作.仍然存在一个问题，就是页面浏览器控制器蒙版中的第一次设置不正确，但是滚动一次后就完美了.

Mistake was there is UIView which contains Label shown in screenshot. The Part visible is is the UIView I thought it masking is not working properly. Still there is issue that very first time in pageview controller mask is not proper but after scroll one time it is perfect.

EDIT2感谢@DonMag

以下是适用于每种情况的解决方案

Following is working solution for every case

class CutOfImageView:UIImageView {
    let imageCutAwayPart:CGFloat = 80
    let maskLayer = CAShapeLayer()

    override func layoutSubviews() {
        super.layoutSubviews()
        self.setupImageCutPath()
        self.layer.mask = self.maskLayer

    }

    private func setupImageCutPath () {
        let path = UIBezierPath()
        path.move(to: .zero)
        path.addLine(to: CGPoint(x: 0  , y: self.frame.height ))
        path.addLine(to: CGPoint(x: self.frame.width   , y: self.frame.height - imageCutAwayPart))
        path.addLine(to: CGPoint(x: self.frame.width, y: 0))
        path.close()
        self.maskLayer.path = path.cgPath



    }
}

这篇关于UIImageView蒙版图层直到滚动PageViewController第一次之前都不是来自角落的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！