ios 如何在swift中以最简单的方式画一条线

Question

提问by Volkodav

I am fairly new to swift and Xcode and I am trying to make a tic tac toe game. I have everything figured out except how to draw a line through the three x's or o's. I have no idea on how to draw lines. I have looked on the web for the answer and can't figure it out.

我对 swift 和 Xcode 相当陌生，我正在尝试制作井字游戏。除了如何通过三个 x 或 o 画一条线之外，我已经弄清楚了一切。我不知道如何画线。我已经在网上寻找答案，但无法弄清楚。

Answer 1

回答by Epic Defeater

Try looking into UIBezierPath, it will help you a lot for drawing lines. Here is documentation. Here is an example:

尝试查看 UIBezierPath，它将对您绘制线条有很大帮助。这是文档。下面是一个例子：

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

    aPath.move(to: CGPoint(x:<#start x#>, y:<#start y#>))
    aPath.addLine(to: CGPoint(x: <#end x#>, y: <#end y#>))

    // Keep using the method addLine 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.lineWidth = <#line width#>
    aPath.stroke()
}

Make sure you put this code in the drawRect, like in the example above.

确保将此代码放在中drawRect，就像上面的示例一样。

If you need to update the drawing just call setNeedsDisplay()to update.

如果您需要更新图纸，只需调用setNeedsDisplay()更新即可。

Answer 2

回答by Sal

Update for Swift 3.xusing Epic Defeater's example

使用 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

回答by iljn

Swift 3.1, inside a UIView:

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

If you want to add a line to a UIViewController, just add a UIView with this function as a subview to the UIViewController, ei:

如果要在 UIViewController 中添加一行，只需将具有此功能的 UIView 作为 UIViewController 的子视图添加，即：

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

Answer 4

回答by paulo62

The questioner isn't really asking what code to use, he is asking where to put the code. It's actually a good question because if you put any of the graphics code in the 'wrong' place, nothing at all will be drawn. The 'wrong' place to put the code is in a class that is not a subclass of UIView. If you try doing that, the code will compile but when it runs, the call to get the graphics context will fail and the calls to the following graphics functions, such as context?.move(), will not run because the context is nil.

提问者并不是在问要使用什么代码，而是在问将代码放在哪里。这实际上是一个很好的问题，因为如果您将任何图形代码放在“错误”的位置，则根本不会绘制任何内容。放置代码的“错误”位置是在不是UIView子类的类中。如果您尝试这样做，代码将编译但当它运行时，获取图形上下文的调用将失败并且对以下图形函数的调用（例如context?.move() ）将不会运行，因为上下文为零.

As an example, let's create a storyboard with a View, a Button and a Label by dragging the respective objects from the Object Library onto the storyboard. My example looks like this, where the white square is the View (actually a sub-view because the main screen is also a view):

举个例子，让我们通过将对象库中的各个对象拖到情节提要上来创建一个带有视图、按钮和标签的情节提要。我的例子看起来像这样，其中白色方块是视图（实际上是一个子视图，因为主屏幕也是一个视图）：

It's possible to draw graphics on Button and Label controls (and the other types of UI controls) because UIButtonand UILabelare subclasses of UIView.

可以在 Button 和 Label 控件（以及其他类型的 UI 控件）上绘制图形，因为UIButton和UILabel是UIView 的子类。

I also created a new file in the project, of type Swift, and called it ExampleDraw.swiftand put the following code in it. The code contains three classes to write graphics on the view, button and label. Each class overrides the draw()function in the base UIViewclass:

我还在项目中创建了一个 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")
    }
}

Then in the main storyboard, select the view, like this:

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

Then open the Identity Inspectorand associate this view with the custom class (i.e. the first class in ExampleDraw.swift) called DrawOnView()like this:

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

Do the same for the Button and the Label, like this:

对 Button 和 Label 执行相同操作，如下所示：

Then run the project in the simulator and hopefully the graphics will write on the view, button and label like this:

然后在模拟器中运行项目，希望图形会像这样写在视图、按钮和标签上：

Answer 5

回答by Kappe

Simple SWIFT 4.1Implementation:

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

Obviously, you need to adjust the starting and ending point.

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

Answer 6

回答by Giorgio Tempesta

I've been struggling on this topic too. In XCode 7.3.1, with Swift version 2.2, the simplest way to draw a line is to create a playground and insert this code in it. Hope this helps other people with this simple task in mind.

我也一直在为这个话题苦苦挣扎。在 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

Edit: Update for Xcode 10.1 with Swift version 4.2.1

编辑：使用 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 7

回答by steve

Are you using SpriteKit? If not, you really should do for any kind of iOS games as it makes manipulating and adding sprites (images) and other game-style objects very easy.

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

Although not at all the best way in terms of coding best-practices, a very simple way to accomplish this would be to create a new view when someone wins, check which direction (out of the possible 8) the row is and then set the image of this view accordingly. The images would be semi-transparent (e.g. PNGs) squares each containing a different possible line.

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

If you want to do it the proper way research how to draw paths in SpriteKit between coordinates.

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

Hope this is of some help! Steve

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

Answer 8

回答by matthias

In general, you have to draw a path in Core Graphics. You can follow this example:

通常，您必须在 Core Graphics 中绘制路径。你可以按照这个例子：

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

Answer 9

回答by Mahesh Chaudhari

Drawing in Swift 4.1

在 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()
    }
}

Answer 10

回答by CodeWithDavid

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

}

ios 如何在swift中以最简单的方式画一条线

提问by Volkodav

回答by Epic Defeater

回答by Sal

回答by iljn

回答by paulo62

回答by Kappe

回答by Giorgio Tempesta

回答by steve

回答by matthias

回答by Mahesh Chaudhari

回答by CodeWithDavid

相关推荐

最近更新

标签

ios 如何在swift中以最简单的方式画一条线

提问by Volkodav

回答by Epic Defeater

回答by Sal

回答by iljn

回答by paulo62

回答by Kappe

回答by Giorgio Tempesta

回答by steve

回答by matthias

回答by Mahesh Chaudhari

回答by CodeWithDavid

相关推荐

有没有办法在应用商店之外分发 ios 应用程序？

ios Swift - 如果小数等于 0，如何从浮点数中删除小数？

ios 在 UITableViewController (Swift) 顶部添加按钮

ios Swift 自定义字体 Xcode 7

相关推荐

最近更新

标签