三角UIView - 斯威夫特 [英] Triangle UIView - Swift

问题描述

所以我正在制作一个游戏，其中我正在丢弃的对象必须被用户在屏幕底部的尖峰（三角形）破坏。

So I'm making a game in which I am dropping objects which have to be destroyed by a spike(triangle) at the bottom of the screen by a user.

我无法弄清楚如何制作一个三角形的UIView。但是我已经能够使它像这样的矩形工作：

I cannot work out how to make a UIView that is a triangle. However I have been able to make it work as a rectangle like this:

 let barrier = UIView(frame: CGRect(x:125, y: 650, width: 130, height:20))
 barrier.backgroundColor = UIColor.orangeColor()
 view.addSubview(barrier)

这已经奏效了。但我无法弄清楚如何制作一个三角形。我希望它作为UIView的原因是因为我在它上面使用碰撞并且让用户移动它。我尝试了一个PNG三角形，但它检测到碰撞是图像的边界而不是三角形的开头。

And this has worked. But I cannot work out how to make a triangle. The reason I want it as a UIView is because im using collisions on it and for the user to move it. I have tried a PNG triangle but it detects the collision as the border of the image not the start of the triangle.

我试过这个但是没有用......

I have tried this but it doesn't work...

 let square = UIView(frame: CGPathMoveToPoint(path, nil, 50, 0), CGPathAddLineToPoint(path, nil, 100, 50), CGPathAddLineToPoint(path, nil, 0, 100))
 square.backgroundColor = UIColor.purpleColor()
 view.addSubview(square)

任何和所有帮助都将是赞赏，

Any and all help will be appreciated,

谢谢，

Alex

推荐答案

更新 Swift 3 ：

Updated for Swift 3:

class TriangleView : UIView {

    override init(frame: CGRect) {
        super.init(frame: frame)
    }

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
    }

    override func draw(_ rect: CGRect) {

        guard let context = UIGraphicsGetCurrentContext() else { return }

        context.beginPath()
        context.move(to: CGPoint(x: rect.minX, y: rect.maxY))
        context.addLine(to: CGPoint(x: rect.maxX, y: rect.maxY))
        context.addLine(to: CGPoint(x: (rect.maxX / 2.0), y: rect.minY))
        context.closePath()

        context.setFillColor(red: 1.0, green: 0.5, blue: 0.0, alpha: 0.60)
        context.fillPath()
    }
}

---

Swift 2 ：

---

Swift 2:

import UIKit

class TriangleView : UIView {

    override init(frame: CGRect) {
        super.init(frame: frame)
    }

    required init(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
    }

    override func drawRect(rect: CGRect) {

        var ctx : CGContextRef = UIGraphicsGetCurrentContext()

        CGContextBeginPath(ctx)
        CGContextMoveToPoint(ctx, CGRectGetMinX(rect), CGRectGetMaxY(rect))
        CGContextAddLineToPoint(ctx, CGRectGetMaxX(rect), CGRectGetMaxY(rect))
        CGContextAddLineToPoint(ctx, (CGRectGetMaxX(rect)/2.0), CGRectGetMinY(rect))
        CGContextClosePath(ctx)

        CGContextSetRGBFillColor(ctx, 1.0, 0.5, 0.0, 0.60);
        CGContextFillPath(ctx);
       }
 } 

这将从MinX，MaxY开始;

从开头画一条线到MaxX，MaxY;

从MaxX画一条线，MaxY到MaxX / 2，MinY;

然后关闭开始的路径位置。

下一部分设置您要使用的颜色。在这个例子255,127,0中，Alpha 0.6
然后将使用设置颜色填充您刚刚绘制的路径。

This will start from MinX, MaxY;
Draw a line from the start to MaxX, MaxY;
Draw a line from MaxX,MaxY to MaxX/2, MinY;
Then close the path to the start location.

The next part sets the color you want to use. In this example 255,127,0, Alpha 0.6 Then will fill the path you just drew above with the set color.

然后在你的视图控制器中

Then in your View Controller

Swift 3 ：

Swift 3:

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        let triangle = TriangleView(frame: CGRect(x: 10, y: 20, width: 25 , height: 30))
        triangle.backgroundColor = .white
        view.addSubview(triangle)
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
}

---

Swift 2 ：

---

Swift 2:

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.

        let triangle = TriangleView(frame: CGRectMake(10, 20, 25, 30))
        triangle.backgroundColor = .whiteColor()
        view.addSubview(triangle)
    }

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

然而，这会导致同样的问题这个视图的框架仍然是一个矩形。 UIKit适用于矩形，你必须使用另一个框架，比如Sprite Kit。

However, this is going to cause the same problem as the frame of this view is still going to be a rectangle. UIKit works with rectangles, you would have to use another framework, like Sprite Kit.

这篇关于三角UIView - 斯威夫特的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！