Question

我想使用Swift将我的UIView的形状转换为这个（白色UIView - 看右边缘）：

任何想法怎么做？我想我应该使用转换功能，但我不知道具体如何。提前谢谢！

Answer 1

更新

这是更新，我在第一个答案中误解了你的问题您需要子类化UIView并使用您自己的行为覆盖默认的draw方法。要调整角度，您可以更改offsetFactor

class ShapeView : UIView {
    public var bgc = UIColor.clear
    override init(frame: CGRect) {
        super.init(frame: frame)
        //backup old background color
        self.bgc = backgroundColor!
        backgroundColor = UIColor.clear
    }

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        self.bgc = backgroundColor!
        backgroundColor = UIColor.clear
    }

    override func draw(_ rect: CGRect) {
        let size = self.bounds.size

        let offsetFactor = size.width * 0.98

        //define the points
        let tl = self.bounds.origin //top left
        let tr = CGPoint(x:tl.x + size.width, y:tl.y) //top  right
        let br = CGPoint(x:tl.x + offsetFactor, y:tr.y + size.height) // bottom right
        let bl = CGPoint(x:tl.x, y:tr.y + size.height) //bottom left

        let path = UIBezierPath()
        path.move(to: tl)
        path.addLine(to: tr)
        path.addLine(to: br)
        path.addLine(to: bl)
        path.close()

        //set old background color
        bgc.set()
        path.fill()
    }
}

Image

~~我希望我能理解你的问题。您需要子类化UIView并使用您自己的行为覆盖默认的draw方法。要调整尖顶，您可以更改offsetFactor 这应该做的工作~~

class ShapeView : UIView { public var bgc = UIColor.clear override init(frame: CGRect) { super.init(frame: frame) //backup old background color self.bgc = backgroundColor! backgroundColor = UIColor.clear } required init?(coder aDecoder: NSCoder) { super.init(coder: aDecoder) self.bgc = backgroundColor! backgroundColor = UIColor.clear } override func draw(_ rect: CGRect) { let size = self.bounds.size let offsetFactor = size.height * 0.7 //define the points let tl = self.bounds.origin //top left let tr = CGPoint(x:tl.x + size.width, y:tl.y) //top right let br = CGPoint(x:tr.x, y:tr.y + offsetFactor) // bottom right let bm = CGPoint(x:size.width/2, y:size.height) ////bottom middle let bl = CGPoint(x:tl.x, y:offsetFactor) //bottom left let path = UIBezierPath() path.move(to: tl) path.addLine(to: tr) path.addLine(to: br) path.addLine(to: bm) path.addLine(to: bl) path.close() //set old background color bgc.set() path.fill() } }

~~Storyboard and Simulator~~

Answer 2

Dudes，我发现了一个更简单的解决方案，可以完美地作为UIView的扩展：

extension UIView {

    func makeItEdgy() {
       let bounds = self.bounds

        // Create path to mask the view
        let path = CGMutablePath()
        path.move(to: bounds.origin)
        path.addLine(to: CGPoint(x: bounds.maxX, y: bounds.minY))
        path.addLine(to: CGPoint(x: bounds.maxX - (bounds.height / 5), y: bounds.maxY))
        path.addLine(to: CGPoint(x: bounds.minX, y: bounds.maxY))
        path.closeSubpath()

        let maskLayer = (self.layer.mask as? CAShapeLayer) ?? CAShapeLayer()
        maskLayer.path = path

        self.layer.mask = maskLayer
    }
}

变换UIView形状

2 个答案: