带有波浪线（波浪形）顶部的 CustomView。（Swift）答案

【问题标题】：CustomView with squiggle(wavy) top.(Swift)带有波浪线（波浪形）顶部的 CustomView。（Swift）
【发布时间】：2019-11-18 13:35:00
【问题描述】：

我正在尝试创建一个自定义视图，并在中间添加一个图像视图。

类似这样的：

但是我不太习惯UIBezierPath，所以我很困惑。

这是我到目前为止所做的。

    class DemoView: UIView {

  var path: UIBezierPath!

  override init(frame: CGRect) {
      super.init(frame: frame)

      self.backgroundColor = UIColor.darkGray
    complexShape()
  }

  required init?(coder aDecoder: NSCoder) {
      super.init(coder: aDecoder)
    complexShape()
  }

    func complexShape() {
        path = UIBezierPath()
        path.move(to: CGPoint(x: 0.0, y: 0.0))
        path.addLine(to: CGPoint(x: self.frame.size.width/2 - 50.0, y: 0.0))
        path.addLine(to: CGPoint(x: self.frame.size.width/2, y: 0.0))
        path.addCurve(to: CGPoint(x: self.frame.size.width, y: 50.0),
                      controlPoint1: CGPoint(x: self.frame.size.width + 50.0, y: 25.0),
                      controlPoint2: CGPoint(x: self.frame.size.width - 150.0, y: 50.0))
        path.addLine(to: CGPoint(x: self.frame.size.width, y: self.frame.size.height))
        path.addLine(to: CGPoint(x: 0.0, y: self.frame.size.height))
        path.close()

        let shapeLayer = CAShapeLayer()
        shapeLayer.path = path.cgPath


        self.layer.mask = shapeLayer
    }

}

extension CGFloat {
    func toRadians() -> CGFloat {
        return self * .pi / 180.0
    }
}

【问题讨论】：

你问的是什么？你还没问过？你想要贝塞尔路径做什么？你想要动画吗？你想让红框移动吗？你的问题不清楚你在寻求什么帮助
看看：raywenderlich.com/…
@JulianSilvestri 我不想移动任何东西。我只想创建一个类似于图像的视图（白色）。带有波浪形顶部。
参考这个链接：medium.com/@GultekinGokhan/…

标签： ios swift uiview uibezierpath

【解决方案1】：

下面的方法可以让你将背景波效果添加到另一个view。然后，您需要为前景方块添加另一个视图。使用常量来改变波形/高度。

func addWaveBackground(to view: UIView){
      let leftDrop:CGFloat = 0.4
      let rightDrop: CGFloat = 0.3
      let leftInflexionX: CGFloat = 0.4
      let leftInflexionY: CGFloat = 0.47
      let rightInflexionX: CGFloat = 0.6
      let rightInflexionY: CGFloat = 0.22

      let backView = UIView(frame: view.frame)
      backView.backgroundColor = .gray
      view.addSubview(backView)
      let backLayer = CAShapeLayer()
      let path = UIBezierPath()
      path.move(to: CGPoint(x: 0, y: 0))
      path.addLine(to: CGPoint(x:0, y: view.frame.height * leftDrop))
      path.addCurve(to: CGPoint(x:view.frame.width, y: view.frame.height * rightDrop),
                    controlPoint1: CGPoint(x: view.frame.width * leftInflexionX, y: view.frame.height * leftInflexionY),
                    controlPoint2: CGPoint(x: view.frame.width * rightInflexionX, y: view.frame.height * rightInflexionY))
      path.addLine(to: CGPoint(x:view.frame.width, y: 0))
      path.close()
      backLayer.fillColor = UIColor.blue.cgColor
      backLayer.path = path.cgPath
      backView.layer.addSublayer(backLayer)
   }

传入要添加波浪效果的视图（这通常是 VC 的主视图）。

【讨论】：