2016-07-10 13 views
-1

Also mache ich eine Art einfaches Spiel basierend auf Sechsecken. Hier ist, wie es aussieht:Erstellen einer UIButton mit Form CAShapeLayer

enter image description here

Ich habe es geschafft, die Hexagone zu ziehen genau so, wie ich sie als CAShapeLayer s will, aber ich möchte sie anklickbar. Kurz gesagt möchte ich sie irgendwie in UIButtons umwandeln, damit ich verfolgen kann, welches über TouchUpInside ausgewählt wird. Die andere Art, wie ich daran denken kann, ist Spuren zu verfolgen und zu überprüfen, ob sie in der Form mit dem Tag waren, aber es scheint viel zu kompliziert zu sein. Unten ist mein Code:

 let screenSize: CGRect = UIScreen.mainScreen().bounds 
     let screenWidth = screenSize.width 
     let screenHeight = screenSize.height 

     let radius : CGFloat = screenWidth/6 

     var c = 0 

     var counter = 0 

     for j in 1...6 { 
      for i in 1...3 { 

       for x in 1...2 { 

        var center = CGPoint(x: CGFloat((i-1)*2)*radius+CGFloat(i-1)*radius, y: CGFloat((j-1)*2)*radius) 

        if (x==2) { 
         center.x = center.x+1.5*radius 
         center.y = center.y+radius 
        } 



        let shape = CAShapeLayer() 
        view.layer.addSublayer(shape) 
        shape.opacity = 0.5 
        shape.lineWidth = 2 
        shape.lineJoin = kCALineJoinMiter 
        shape.strokeColor = UIColor(hue: 0.786, saturation: 0.79, brightness: 0.53, alpha: 1.0).CGColor 
        shape.fillColor = UIColor(hue: 0.786, saturation: 0.15, brightness: 0.89, alpha: 1.0).CGColor 


        let path = UIBezierPath() 
        path.moveToPoint(CGPointMake(center.x-radius, center.y)) 
        path.addLineToPoint(CGPointMake(center.x-radius/2, center.y-radius)) 
        path.addLineToPoint(CGPointMake(center.x+radius/2, center.y-radius)) 
        path.addLineToPoint(CGPointMake(center.x+radius, center.y)) 
        path.addLineToPoint(CGPointMake(center.x+radius, center.y)) 
        path.addLineToPoint(CGPointMake(center.x+radius/2, center.y+radius)) 
        path.addLineToPoint(CGPointMake(center.x-radius/2, center.y+radius)) 

        path.closePath() 
        shape.path = path.CGPath 



       } 


      } 

     } 

Antwort

2

Die andere Art, wie ich es zu tun denken kann Spur berührt ist und überprüfen, ob sie mit dem Tag in der Form waren, aber es Art und Weise zu kompliziert

Okay, scheint , aber das Problem ist, dass Sie dies mit Ebenen ausgewählt haben, und Ebenen überhaupt keine Berührungen erkennen, so dass es schwer ist zu sehen, welche andere Wahl Ihnen offen steht. Sie können eine Ebene nicht in eine Schaltfläche "umwandeln". Wenn Sie Schaltflächen oder Ansichten möchten, die auf sich selbst tippen, sollten Sie Schaltflächen oder Ansichten verwenden, nicht Schichten. Wenn Sie z. B. eine benutzerdefinierte UIView verwenden, können Sie Ihre Formebene als Ebene verwenden und eine Hit-Prüfung implementieren, um zu bestimmen, ob ein Tap in den Sechseckpfad der Formebene fällt.

Hier ist ein Beispiel für den Einstieg:

class HexButton: UIView { 

    var path: UIBezierPath! 

    override class func layerClass() -> AnyClass { 
     return CAShapeLayer.self 
    } 

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

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

    func finishInitialization() { 
     let shape = self.layer as! CAShapeLayer 
     shape.opacity = 0.5 
     shape.lineWidth = 2 
     shape.lineJoin = kCALineJoinMiter 
     shape.strokeColor = UIColor(hue: 0.786, saturation: 0.79, brightness: 0.53, alpha: 1.0).CGColor 
     shape.fillColor = UIColor(hue: 0.786, saturation: 0.15, brightness: 0.89, alpha: 1.0).CGColor 

     let center = CGPoint(x:self.bounds.midX, y: self.bounds.midY) 
     let radius = self.bounds.width/2.0 

     let path = UIBezierPath() 
     path.moveToPoint(CGPointMake(center.x-radius, center.y)) 
     path.addLineToPoint(CGPointMake(center.x-radius/2, center.y-radius)) 
     path.addLineToPoint(CGPointMake(center.x+radius/2, center.y-radius)) 
     path.addLineToPoint(CGPointMake(center.x+radius, center.y)) 
     path.addLineToPoint(CGPointMake(center.x+radius, center.y)) 
     path.addLineToPoint(CGPointMake(center.x+radius/2, center.y+radius)) 
     path.addLineToPoint(CGPointMake(center.x-radius/2, center.y+radius)) 

     path.closePath() 
     shape.path = path.CGPath 

     self.path = path 

    } 

    override func hitTest(point: CGPoint, withEvent event: UIEvent?) -> UIView? { 
     return self.path.containsPoint(point) ? self : nil 
    } 

} 

Wenn Sie eine Anzapfung Gestenerkenner zu dieser Ansicht anschließen, werden Sie sehen, dass es feuert nur dann, wenn der Hahn im Inneren des Sechsecks.

+0

Hey vielen Dank für die Antwort! Das macht Sinn. Gibt es eine Möglichkeit, zum Beispiel UIButton mit Shape Layer zu setzen? Wie würde ich einen Hexagon-UIButton erstellen? – Antoine

+0

Beispielcode hinzugefügt. – matt

Verwandte Themen