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

时间:2015-07-22 16:37:17

标签: ios swift

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

11 个答案:

答案 0 :(得分:43)

尝试查看UIBezierPath,它将为绘图线提供很多帮助。 Documentation以下是一个例子:

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()进行更新。

答案 1 :(得分:20)

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

PreparedStatement state = Mysql.conn().prepareStatement("insert into contents(campaignId, site_id, original_article_id, title, content) values(-1, -1, -1, ?, ?)");
state.setString(1, "acbdąčęėįšųū");
state.setString(2, "acbdąčęėįšųū");
state.execute();

答案 2 :(得分:6)

Swift 3.1 ,在UIView中:

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

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

{{1}}

答案 3 :(得分:5)

提问者并没有真正询问使用什么代码,他问的是在哪里放置代码。这实际上是一个很好的问题,因为如果您将任何图形代码放入错误的'地方,什么都没画。错误'将代码置于不是 UIView 的子类的类中。如果你尝试这样做,代码将编译,但是当它运行时,获取图形上下文的调用将失败,并且对以下图形函数的调用,例如 context?.move(),将因为上下文是 nil 而无法运行。

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

enter image description here

可以在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")
    }
}

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

enter image description here

然后打开 Identity Inspector 并将此视图与名为 DrawOnView()的自定义类(即E xampleDraw.swift 中的第一个类)相关联。像这样:

enter image description here

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

enter image description here

enter image description here

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

enter image description here

答案 4 :(得分:5)

简单 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()
}

显然,你需要调整起点和终点。

答案 5 :(得分: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()

答案 6 :(得分:3)

您使用的是SpriteKit吗?如果没有,你真的应该为任何类型的iOS游戏做,因为它可以很容易地操作和添加精灵(图像)和其他游戏风格的对象。

虽然在编写最佳实践方面并不是最好的方法,但实现这一目标的一个非常简单的方法是在有人获胜时创建一个新视图,检查该行的哪个方向(可能是8个)和然后相应地设置此视图的图像。图像将是半透明的(例如PNG)正方形,每个正方形包含不同的可能线。

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

希望这有一些帮助! 史蒂夫

答案 7 :(得分:2)

通常,您必须在Core Graphics中绘制路径。您可以按照以下示例:

let context = UIGraphicsGetCurrentContext()
CGContextSetLineWidth(context, 2.0)
CGContextSetStrokeColorWithColor(context, color)
CGContextMoveToPoint(context, startPoint)
CGContextAddLineToPoint(context, endPoint)
CGContextStrokePath(context)

答案 8 :(得分:0)

在Swift 4.1中绘图

override func viewDidLoad() {
    super.viewDidLoad()
     self.lastPoint = CGPoint.zero
     self.red = 0.0
     self.green = 0.0
     self.blue = 0.0

}

override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
    // Dispose of any resources that can be recreated.
}


//MARK: Touch events
override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
    isSwiping    = false
    if let touch = touches.first{
        lastPoint = touch.location(in: mainImageView)
    }
}
override func touchesMoved(_ touches: Set<UITouch>, with event: UIEvent?) {

    isSwiping = true;
    if let touch = touches.first{
        let currentPoint = touch.location(in: mainImageView)
        UIGraphicsBeginImageContext(self.tempImageView.frame.size)
        self.tempImageView.image?.draw(in: CGRect(x:0, y:0,width:self.tempImageView.frame.size.width, height:self.tempImageView.frame.size.height))

        UIGraphicsGetCurrentContext()?.move(to: CGPoint(x: lastPoint.x, y: lastPoint.y))
        UIGraphicsGetCurrentContext()?.addLine(to: CGPoint(x: currentPoint.x, y: currentPoint.y))

        UIGraphicsGetCurrentContext()?.setLineCap(CGLineCap.round)
        UIGraphicsGetCurrentContext()?.setLineWidth(9.0)
        UIGraphicsGetCurrentContext()?.setStrokeColor(red: red, green: green, blue: blue, alpha: 1.0)
        UIGraphicsGetCurrentContext()?.strokePath()


        self.tempImageView.image = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()
        lastPoint = currentPoint
    }
}
override func touchesEnded(_ touches: Set<UITouch>, with event: UIEvent?) {
    if(!isSwiping) {
        // This is a single touch, draw a point
        UIGraphicsBeginImageContext(self.tempImageView.frame.size)
        self.tempImageView.image?.draw(in: CGRect(x:0, y:0,width:self.tempImageView.frame.size.width, height:self.tempImageView.frame.size.height))
        UIGraphicsGetCurrentContext()?.setLineCap(CGLineCap.round)
        UIGraphicsGetCurrentContext()?.setLineWidth(9.0)

        UIGraphicsGetCurrentContext()?.move(to: CGPoint(x: lastPoint.x, y: lastPoint.y))
        UIGraphicsGetCurrentContext()?.addLine(to: CGPoint(x: lastPoint.x, y: lastPoint.y))
        UIGraphicsGetCurrentContext()?.setStrokeColor(red: red, green: green, blue: blue, alpha: 1.0)
        UIGraphicsGetCurrentContext()?.strokePath()
        self.tempImageView.image = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()
    }
}

答案 9 :(得分:0)

import UIKit

@IBDesignable class DrawView: UIView {

    override func draw(_ rect: CGRect) {
        let context = UIGraphicsGetCurrentContext()
        context?.setLineWidth(2.0)
        context?.setStrokeColor(UIColor.red.cgColor)
        context?.move(to: CGPoint(x: 210, y: 30))
        context?.addLine(to: CGPoint(x: 300, y: 200))
        context?.addLine(to: CGPoint(x: 100, y: 200))
        context?.addLine(to: CGPoint(x: 210, y: 30))
        context?.strokePath()
    } 

}

答案 10 :(得分:-1)

Storyboard 中的快速修复:

enter image description here

  1. 创建一个 UILabel
  2. 删除文本
  3. 将背景颜色设置为您想要的颜色
  4. 将高度约束设置为您想要的线宽