2012-10-06 14 views
6

Come si usa CAShapeLayer di tracciare una linea che ha sia un colore del bordo, larghezza del bordo e il colore di riempimento?CAShapeLayer con bordo e il colore di riempimento e di arrotondamento

Ecco quello che ho provato, ma è sempre e solo blu ...

self.lineShape.strokeColor = [UIColor blueColor].CGColor; 
self.lineShape.fillColor = [UIColor greenColor].CGColor; 
self.lineShape.lineWidth = 100; 
self.lineShape.lineCap = kCALineCapRound; 
self.lineShape.lineJoin = kCALineJoinRound; 
UIBezierPath* path = [UIBezierPath bezierPath]; 
[path moveToPoint:self.lineStart]; 
[path addLineToPoint:self.lineEnd]; 
self.lineShape.path = path.CGPath; 

risposta

7
self.lineShapeBorder = [[CAShapeLayer alloc] init]; 
    self.lineShapeBorder.zPosition = 0.0f; 
    self.lineShapeBorder.strokeColor = [UIColor blueColor].CGColor; 
    self.lineShapeBorder.lineWidth = 25; 
    self.lineShapeBorder.lineCap = kCALineCapRound; 
    self.lineShapeBorder.lineJoin = kCALineJoinRound; 

    self.lineShapeFill = [[CAShapeLayer alloc] init]; 
    [self.lineShapeBorder addSublayer:self.lineShapeFill]; 
    self.lineShapeFill.zPosition = 0.0f; 
    self.lineShapeFill.strokeColor = [UIColor greenColor].CGColor; 
    self.lineShapeFill.lineWidth = 20.0f; 
    self.lineShapeFill.lineCap = kCALineCapRound; 
    self.lineShapeFill.lineJoin = kCALineJoinRound; 

// ... 

    UIBezierPath* path = [UIBezierPath bezierPath]; 
    [path moveToPoint:self.lineStart]; 
    [path addLineToPoint:self.lineEnd]; 
    self.lineShapeBorder.path = self.lineShapeFill.path = path.CGPath; 
+0

Questa era la mia soluzione finale – jjxtra

7

Se si imposta la proprietà del livello fillColor a qualcosa di diverso nil o trasparente, lo strato riempirà il suo percorso.

Se si imposta il livello lineWidth su un numero maggiore di zero e si imposta strokeColor su un valore diverso da nil o trasparente, il livello eseguirà il tracciamento del suo percorso.

Se si impostano tutte queste proprietà, il livello riempirà il percorso di e. Disegna il tratto dopo il riempimento.

percorso del strato deve in realtà racchiudere qualche area in modo che esso per riempire qualsiasi cosa. Nel tuo post, hai impostato il percorso in questo modo:

UIBezierPath* path = [UIBezierPath bezierPath]; 
[path moveToPoint:self.lineStart]; 
[path addLineToPoint:self.lineEnd]; 
self.lineShape.path = path.CGPath; 

Quel percorso contiene un singolo segmento di linea. Non racchiude alcuna area, quindi il livello non ha nulla da riempire.

+0

Ho aggiornato la mia domanda con il mio codice corrente ... – jjxtra

+0

@PsychoDad Ho aggiornato la mia risposta. –

+0

Quindi avrei bisogno di avere il mio percorso sia un poligono, allora? – jjxtra

1

In Swift 3. un metodo di estensione di UIView.

// Usage: 
self.btnGroup.roundCorner([.topRight, .bottomRight], radius: 4.0, borderColor: UIColor.red, borderWidth: 1.0) 

// Apply round corner and border. An extension method of UIView. 
public func roundCorner(_ corners: UIRectCorner, radius: CGFloat, borderColor: UIColor, borderWidth: CGFloat) { 
    let path = UIBezierPath.init(roundedRect: self.bounds, byRoundingCorners: corners, cornerRadii: CGSize(width: radius, height: radius)) 

    let mask = CAShapeLayer() 
    mask.path = path.cgPath 
    self.layer.mask = mask 

    let borderPath = UIBezierPath.init(roundedRect: self.bounds, byRoundingCorners: corners, cornerRadii: CGSize(width: radius, height: radius)) 
    let borderLayer = CAShapeLayer() 
    borderLayer.path = borderPath.cgPath 
    borderLayer.lineWidth = borderWidth 
    borderLayer.strokeColor = borderColor.cgColor 
    borderLayer.fillColor = UIColor.clear.cgColor 
    borderLayer.frame = self.bounds 
    self.layer.addSublayer(borderLayer) 
} 
Problemi correlati