UIBezierPath indicates a fraction of a path

Given arbitrary UIBezierPath

, I'm looking for a way to get a point on a fraction of the length of that path.

Example:

UIBezierPath *path = [UIBezierPath bezierPath];
[path moveToPoint:CGPointMake(200.0, 200.0)];
[path addLineToPoint:CGPointMake(200.0, 400.0)];

CGPoint p = [path pointAtFraction:0.5];

      

p

should be {x: 200.0, y: 300.0}

in this case.

I know this simple example can be calculated, but I am looking for a solution that works for ANY UIBezierPath

(arcs, rounded rectangles, etc.)

Seeing CAShapeLayer

which basically lives UIBezierPath

and its property strokeEnd

, I guess the information is somewhere inside the path object. However, neither the interfaces UIBezierPath

nor CGPathRef

shows a way to achieve this.

I tried to create CAShapeLayer

by setting strokeEnd

and fetching CGPathRef

from the layer, but the path remains the same.

Is there a (public API) way to achieve this?

+3


source to share


2 answers


Sorry for the huge delay. I actually solved this over a year ago, wow.
I created a small category on UIBezierPath

that does the job. GitHub Repo here

After re-reading my code from 1 year ago, I have to say that it is quite shocking how I used the code back then: D Insufficient documentation is worrying. If you need more information please let me know and I will update the repo.



+3


source


A while ago I made a carousel menu based on a cubic bezier curve. I think this code might help you:

CGFloat bezierInterpolation(CGFloat t, CGFloat a, CGFloat b, CGFloat c, CGFloat d) {
    CGFloat t2 = t * t;
    CGFloat t3 = t2 * t;
    return a + (-a * 3 + t * (3 * a - a * t)) * t
           + (3 * b + t * (-6 * b + b * 3 * t)) * t
           + (c * 3 - c * 3 * t) * t2
           + d * t3;
}

- (CGPoint)getPointForT:(CGFloat)t {
    return CGPointMake(bezierInterpolation(t, _p1.x, _p2.x, _p3.x, _p4.x), bezierInterpolation(t, _p1.y, _p2.y, _p3.y, _p4.y));
}

      



t is your fraction length <0,1>

_p1, _p2, _p3, _p4 are curve points (check this site to visualize it a bit: http://cubic-bezier.com/#.17,.67,.83, .67 )

+8


source







All Articles