从两侧在 UIView 上绘制对角线答案

【问题标题】：Drawing diagonal lines on an UIView from both side从两侧在 UIView 上绘制对角线
【发布时间】：2018-02-22 09:59:22
【问题描述】：

从两侧快速创建对角线，如窗框。

如何以编程方式设计窗口格栅（swift4）？

下面给出了我的错误逻辑，它绘制了穿过视图的一侧诊断线。

        let height = view.frame.size.height
    let width  = view.frame.size.width
   let  space = 10
    for i in stride(from: 0, through: 2*Int(width), by: space) {
        view.layer.addSublayer(DesignShape.addLine(fromPoint: CGPoint(x:
            i, y: 0), toPoint: CGPoint(x:CGFloat(i-Int(width)), y: height), color: UIColor.black,lineWidth :2))
    }

DesignShape.addLine 是使用 UIBezierPaths 在两点之间画线的方法。

【问题讨论】：

仅使用图片资源作为背景怎么样？
@MilanNosáľ 视图大小是动态的，我们需要为通用应用程序设计
一种方法是使用 UIBezierPaths 绘制它，另一种方法是我认为更好的选择。
@J.Doe 我正在使用 UIBezierPaths 绘制线条，但我的逻辑无法正常工作
你不应该为每一行添加一个形状层。为所有行创建一个贝塞尔路径。避免不必要的添加层。为什么不只创建UIView 的子类并覆盖drawRect:？

标签： ios iphone swift swift4

【解决方案1】：

我已经用UIBezierPath 尝试过这种设计。这可能会给您的问题一些想法。

编码

@IBOutlet weak var shapeView: UIView!
// CONSTRAINTS top 20, left and right 16, height as 320

override func viewDidAppear(_ animated: Bool) {
   howManyGrillWeNeed(grillCount : 17, grillWidth: 40, grillHeight : 60)
}

func howManyGrillWeNeed(grillCount: Int, grillWidth: CGFloat, grillHeight: CGFloat)
{
    let xPositionDiff = Int((shapeView.frame.width / grillWidth))
    var xPosiitonCount : Int = 0
    var yPosiitonCount : Int = -1

    for i in 0..<grillCount
    {
        if i % xPositionDiff == 0
        {
            xPosiitonCount = 0
            yPosiitonCount = yPosiitonCount + 1
            print("newxLine")
        }
        else
        {
            xPosiitonCount = xPosiitonCount + 1
        }
        let grillVw = UIView(frame: CGRect(x: 0, y: 0, width: grillWidth, height: grillHeight))
        grillVw.backgroundColor = UIColor.white


        grillVw.frame.origin.x = CGFloat(xPosiitonCount) * grillWidth
        grillVw.frame.origin.y = CGFloat(yPosiitonCount) * grillHeight

        let layerWidth = grillWidth
        let layerHeight = grillHeight
        let bezierPath = UIBezierPath()
        bezierPath.move(to: CGPoint(x: 0, y: layerHeight / 2))

        bezierPath.addLine(to: CGPoint(x: layerWidth / 2, y: 0))
        bezierPath.addLine(to: CGPoint(x: layerWidth, y: layerHeight / 2))
        bezierPath.addLine(to: CGPoint(x: layerWidth / 2, y: layerHeight))
        bezierPath.addLine(to: CGPoint(x: 0, y: layerHeight / 2))


        // Mask to Path
        let shapeLayer = CAShapeLayer()
        shapeLayer.path = bezierPath.cgPath
        shapeLayer.strokeColor = UIColor.red.cgColor
        shapeLayer.fillColor = UIColor.orange.cgColor
        shapeLayer.lineWidth = 1.0

        grillVw.layer.addSublayer(shapeLayer)
        //grillVw.layer.mask = shapeLayer

        shapeView.addSubview(grillVw)
    }
}

输出

【讨论】：