仅从 cgpoint 开始在一个方向上画线

Question

我下面的 swifts 代码目标是能够画一条直线。当 uiview 被触摸时，用户只能在初始点上方绘制 90 度。方向已经确定。所以用户可以在被触摸的点上方画一条线。你可以在左边的行下面的 gif 是我的代码在下面所做的。右边的线是我想要实现的。

import UIKit



class ViewController: UIViewController{
    
    
    
  
    
    var draw = Canvas()
    
    
    override func viewDidLoad() {
        super.viewDidLoad()
        [draw].forEach {
            view.addSubview($0)
            $0.translatesAutoresizingMaskIntoConstraints = false}
    }
    
    
    
    override func viewDidLayoutSubviews() {
        
        draw.backgroundColor = .clear
        
        
        NSLayoutConstraint.activate ([
            
            
            
            draw.bottomAnchor.constraint(equalTo: view.bottomAnchor),
            
            draw.heightAnchor.constraint(equalTo: view.heightAnchor, multiplier: 0.77, constant: 0),
            draw.widthAnchor.constraint(equalTo: view.widthAnchor, multiplier: 1, constant: 0),
            draw.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant : 0),
            
            
            
        ])
        
        
        
        
    }
    
    
    
}



struct ColoredLine {
    var color = UIColor.black
    var points = [CGPoint]()
    var width = 5
}





class Canvas: UIView {
    
    
    var strokeColor = UIColor.red
    var strokeWidth = 5
    func undo() {
        _ = lines.popLast()
        setNeedsDisplay()
    }
    
    func clear() {
        lines.removeAll()
        setNeedsDisplay()
    }
    
    var lines = [ColoredLine]()
    
    override func draw(_ rect: CGRect) {
        super.draw(rect)
        
        guard let context = UIGraphicsGetCurrentContext() else { return }
        
        lines.forEach { (line) in
            for (i, p) in line.points.enumerated() {
                if i == 0 {
                    context.move(to: p)
                } else {
                    context.addLine(to: p)
                }
            }
            
            context.setStrokeColor(line.color.cgColor)
            context.setLineWidth(CGFloat(line.width))
            context.strokePath()
            context.beginPath()
        }
        
        
    }
    
    override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
        var coloredLine = ColoredLine()
        coloredLine.color = strokeColor
        coloredLine.width = strokeWidth
        lines.append(coloredLine)
        
    }
    
    override func touchesMoved(_ touches: Set<UITouch>, with event: UIEvent?) {
        guard let point = touches.first?.location(in: self) else { return }
        guard var lastLine = lines.popLast() else { return }
        lastLine.points.append(point)
        lines.append(lastLine)
        setNeedsDisplay()
    }
    
}

Answer 1

制作坐标即可，Points由x和y组成。

保持y，完成。

• 为一个触摸事件保留第一个点

    var firstPt: CGPoint?
  
    //  get the first point
    override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
        guard let first = touches.first?.location(in: self) else { return }
  
        // store first as property 
        firstPt = first
    }
  

• 制造其余点，新获取点的x无关

    override func touchesMoved(_ touches: Set<UITouch>, with event: UIEvent?) {
        guard let point = touches.first?.location(in: self), let first = firstPt else { return }
  
        let pointNeeded = CGPoint(x:  first.x ,  y:  point.y)
        //  ... , do as usual
    }
  

在touchesEnd 和touchesCancell，firstPt = nil