如何在swift中以最简单的方式绘制一条线

Question

我是swift和Xcode的新手,我正在尝试制作一个tic tac toe游戏.除了如何通过三个x或o画一条线外,我已经弄明白了.我不知道如何画线.我已经在网上找到了答案,但无法弄明白.

Answer 1

尝试查看UIBezierPath,它将为绘图线提供很多帮助.文档 这是一个例子:

override func drawRect(rect: CGRect) {
      var aPath = UIBezierPath()

      aPath.moveToPoint(CGPoint(x:/*Put starting Location*/, y:/*Put starting Location*/))

      aPath.addLineToPoint(CGPoint(x:/*Put Next Location*/, y:/*Put Next Location*/))

      //Keep using the method addLineToPoint until you get to the one where about to close the path

      aPath.closePath()

      //If you want to stroke it with a red color
      UIColor.redColor().set()
      aPath.stroke()
      //If you want to fill it as well 
      aPath.fill()
}

确保将此代码放在drawRect中.就像上面的例子一样.

如果您需要更新图纸,请致电setNeedsDisplay()更新.

Answer 2

使用Epic Defeater的示例更新Swift 3.x.

override func draw(_ rect: CGRect) {
        let aPath = UIBezierPath()

        aPath.move(to: CGPoint(x:20, y:50))

        aPath.addLine(to: CGPoint(x:300, y:50))

        //Keep using the method addLineToPoint until you get to the one where about to close the path

        aPath.close()

        //If you want to stroke it with a red color
        UIColor.red.set()
        aPath.stroke()
        //If you want to fill it as well
        aPath.fill()
    }

Answer 3

Swift 3.1,在UIView中:

public override func draw(_ rect: CGRect) {
    let context = UIGraphicsGetCurrentContext()
    context!.setLineWidth(2.0)
    context!.setStrokeColor(UIColor.red.cgColor)
    context?.move(to: CGPoint(x: 0, y: self.frame.size.height))
    context?.addLine(to: CGPoint(x: self.frame.size.width, y: 0))
    context!.strokePath()
}

如果你想在UIViewController中添加一行,只需将带有此函数的UIView作为子视图添加到UIViewController,ei:

let line = LineView(CGRect(x: 0, y: 0, width: self.view.frame.width, height: self.view.frame.height))
self.view.addSubview(line)

Answer 4

我也一直在为这个话题苦苦挣扎。在 XCode 7.3.1 和 Swift 2.2 版中，画线最简单的方法是创建一个操场并将此代码插入其中。希望这可以帮助其他人记住这个简单的任务。

import UIKit
import XCPlayground

public class SimpleLine: UIView  {

    public init() {
        super.init(frame: CGRect(x: 0, y: 0, width: 480, height: 320))
        backgroundColor = UIColor.whiteColor()
    }

    public required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    public override func drawRect(rect: CGRect) {
        let context = UIGraphicsGetCurrentContext()
        CGContextSetLineWidth(context, 4.0)
        CGContextSetStrokeColorWithColor(context, UIColor.darkGrayColor().CGColor)
        CGContextMoveToPoint(context, 100, 100)
        CGContextAddLineToPoint(context, 300, 300)
        CGContextStrokePath(context)
    }

}

let firstLine = SimpleLine()

XCPlaygroundPage.currentPage.liveView = firstLine

编辑：使用 Swift 版本 4.2.1 更新 Xcode 10.1

import UIKit
import PlaygroundSupport

public class SimpleLine: UIView  {

    public init() {
        super.init(frame: CGRect(x: 0, y: 0, width: 320, height: 480))
        backgroundColor = .white
    }

    public required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    public override func draw(_ rect: CGRect) {
        guard let context = UIGraphicsGetCurrentContext() else { return }
        context.setLineWidth(4.0)
        context.setStrokeColor(UIColor.darkGray.cgColor)
        context.move(to: CGPoint(x: 40, y: 40))
        context.addLine(to: CGPoint(x: 280, y: 300))
        context.strokePath()
    }
}

PlaygroundPage.current.liveView = SimpleLine()

Answer 5

提问者并没有真正询问使用什么代码,他问的是在哪里放置代码.这实际上是一个很好的问题,因为如果你将任何图形代码放在"错误"的地方,那么就什么都不会被绘制出来.放置代码的"错误"位置在不是UIView的子类的类中.如果您尝试这样做,代码将编译,但是当它运行时,获取图形上下文的调用将失败,并且对上下文？.move()的调用将不会运行,因为上下文为零.

例如,让我们通过将对象库中的相应对象拖到故事板上来创建一个带有视图,按钮和标签的故事板.我的示例看起来像这样,其中白色方块是视图(实际上是子视图,因为主屏幕也是视图):

可以在Button和Label控件(以及其他类型的UI控件)上绘制图形,因为UIButton和UILabel是UIView的子类.

我还在项目中创建了一个类型为Swift的新文件,并将其称为ExampleDraw.swift并将以下代码放入其中.该代码包含三个类,用于在视图,按钮和标签上编写图形.每个类都会覆盖基础UIView类中的draw()函数:

import UIKit

class DrawOnView: UIView {
    override func draw(_ rect: CGRect) {
        let context = UIGraphicsGetCurrentContext()
        context?.setLineWidth(2.0)
        context?.setStrokeColor(UIColor.blue.cgColor)
        context?.move(to: CGPoint(x:0, y: 0))
        context?.addLine(to: CGPoint(x: 20, y: 30))
        context?.strokePath()

        print("in DrawOnView")
    }
}

class DrawOnButton: UIButton {
    override func draw(_ rect: CGRect) {
        let context = UIGraphicsGetCurrentContext()
        context?.setLineWidth(4.0)
        context?.setStrokeColor(UIColor.green.cgColor)
        context?.move (to: CGPoint(x: 0, y: 0))
        context?.addLine (to: CGPoint(x: 40, y: 45))
        context?.strokePath()

        print("in DrawOnButton")
    }
}

class DrawOnLabel: UILabel {
    override func draw(_ rect: CGRect) {
        let context = UIGraphicsGetCurrentContext()
        context?.setLineWidth(1.0)
        context?.setStrokeColor(UIColor.red.cgColor)
        context?.move (to: CGPoint(x: 0, y: 0))
        context?.addLine (to: CGPoint(x: 35, y: 45))
        context?.strokePath()

        print("in DrawOnLabel")
    }
}

然后在主故事板中,选择视图,如下所示:

然后打开Identity Inspector并将此视图与名为DrawOnView()的自定义类(即E xampleDraw.swift中的第一个类)关联,如下所示:

对Button和Label执行相同操作,如下所示:

然后在模拟器中运行项目,希望图形将在视图,按钮和标签上写入如下:

Answer 6

你在使用 SpriteKit 吗？如果没有，你真的应该为任何类型的 iOS 游戏做，因为它使得操作和添加精灵（图像）和其他游戏风格的对象变得非常容易。

尽管在编码最佳实践方面根本不是最好的方法，但一个非常简单的方法是在有人获胜时创建一个新视图，检查行是哪个方向（可能的 8 个方向），然后设置此视图的图像相应。图像将是半透明（例如 PNG）方块，每个方块包含不同的可能线条。

如果您想以正确的方式进行研究，请研究如何在 SpriteKit 中在坐标之间绘制路径。

希望这个对你有帮助！史蒂夫

Answer 7

简单的SWIFT 4.1实施：

public override func draw(_ rect: CGRect) {
    guard let context = UIGraphicsGetCurrentContext() else { return }
    let lineWidth: CGFloat = 1.0
    context.setLineWidth(lineWidth)
    context.setStrokeColor(UIColor(style: .tertiaryBackground).cgColor)
    let startingPoint = CGPoint(x: 0, y: rect.size.height - lineWidth)
    let endingPoint = CGPoint(x: rect.size.width, y: rect.size.height - lineWidth)
    context.move(to: startingPoint )
    context.addLine(to: endingPoint )
    context.strokePath()
}

显然，您需要调整起点和终点。