Comment dessiner des lignes pour CKComponent (ComponentKit Facebook)?

Question

Comment tracer des lignes pour CKComponent (ComponentKit Facebook)?

je peux le faire en utilisant la classe à base UIView avec la méthode drawRect.

[CKStackLayoutComponent newWithView:{ [ViewWithDrawrectMethod class], 
            { 
            { CKComponentViewAttribute::LayerAttribute(@selector(setCornerRadius:)), @4.0 }, 
            { CKComponentViewAttribute::LayerAttribute(@selector(setBorderColor:)), (id)[[UIColor lightGrayColor] CGColor]}, 
            { CKComponentViewAttribute::LayerAttribute(@selector(setBorderWidth:)), @0.5}, 
            { @selector(setClipsToBounds:), @YES }, 
            { @selector(setBackgroundColor:), [UIColor whiteColor]}, 
            } 
           } 

---

@interface ViewWithDrawrectMethod : UIView 

@end 

@implementation ViewWithDrawrectMethod 
    -(void) drawRect: (CGRect) rect 
    { 

     [super drawRect:rect]; 

     CGContextRef context = UIGraphicsGetCurrentContext(); 

     CGFloat dash[] = {2.0, 3.0}; 
     CGContextSetLineDash(context, 0, dash, 1); 

     CGRect paperRect = self.bounds; 

     CGPoint startPoint = CGPointMake(paperRect.origin.x,50); 
     CGPoint endPoint = CGPointMake(paperRect.origin.x + paperRect.size.width, 50); 

     CGContextSetLineCap(context, kCGLineCapSquare); 
     CGContextSetStrokeColorWithColor(context, [UIColor grayColor].CGColor); 
     CGContextSetLineWidth(context, 0.5); 
     CGContextMoveToPoint(context, startPoint.x , startPoint.y); 
     CGContextAddLineToPoint(context, endPoint.x, endPoint.y); 
     CGContextStrokePath(context); 

    } 

Mais je doute que le droit d'utiliser le composant à base UIViev comme un enfant de CKStackLayoutComponent? Peut-être qu'il y a un meilleur moyen?

Merci pour vos réponses à l'avance.

Answer 1

+ (instancetype)newLineWithColor: (UIColor *)color { 
    return [super newWithComponent:[CKComponent 
           newWithView:{ 
            UIView.class, 
            {{@selector(setBackgroundColor:), color}} 
           } 
           size:{ 
            .height = 0.5 
           }]]; 
} 

ou:

vous pouvez utiliser une image de fond comme l'image étirable et tracer des lignes sur elle.