CODEWITHSUNDEEP
objective-cpathdrawinglinegradient
Alexander Patoka
Alexander Patoka

Reputation: 3

How to draw a multiple point line using UIBezierPath with gradient

I need to draw a lot of lines.

I'm using UIBezierPath for drawing lines and small 5x10 pattern image for gradient. Here's the part of code below:

 l1 = [UIBezierPath bezierPath];
    [l1 moveToPoint:CGPointMake(76, 373)];  
    [l1 addLineToPoint:CGPointMake(940, 373)];   


    CAShapeLayer *pathLayer = [CAShapeLayer layer];
    CGRect pathRect = self.view.frame;

    path = l1;
    pathLayer.frame = self.view.bounds;
    pathLayer.bounds = pathRect;
    pathLayer.geometryFlipped = NO;
    pathLayer.path = path.CGPath;
    pathLayer.strokeColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"line1Pattern.png"]];
    pathLayer.fillColor = nil;
    pathLayer.lineWidth = 8.0f;
    pathLayer.opacity = 1;
    [pathLayer setShadowOffset:CGSizeMake(0, 5)];
    [pathLayer setShadowOpacity:0.5];
    pathLayer.lineCap = kCALineCapRound;
    pathLayer.lineJoin = kCALineJoinRound;
    [pathArray addObject:pathLayer];

    self.pathLayer = pathLayer;

If the line is straight horizontal (like blue and red) - everything is ok and the result is great. But if I draw tilted line, or straight and then tiled - the result is not ok. Here's the link to image: left side - what I need, right side - what mu result: example

So, as I understand - I need to rotate the gradient to match the line. But I cant imagine how to realize that.

Also some lines could have zig-zag form like on this graph: example

Could anyone help me with this problem? Or suggest another way of drawing lines. Thanks!

Upvotes: 0

Views: 1083

Answers (1)

bealex
bealex

Reputation: 10014

You can draw only horizontal lines and rotate them with transform. But if you'll need a curve, then everything will be much more complicated.

Also you can create a gradient and draw it instead of tiled image.

Upvotes: 1

Related Questions