[iOS Objective C]Drag Bezier curve from a point on closed bezier curve path

0
votes

Sample image for the requirementI have drawn a closed path bezier curve using the UIBezier path code.Im able to find if touched point on screen is on the closed bezier path boundary or outside it. Requirement:- I need to drag the point where user touched on the closed path bezier curve boundary and make the closed path bezier curve extend.

Refer:- The below question is same as mine but i could not find a solution from it. https://math.stackexchange.com/questions/53819/changing-a-bezier-curve-by-dragging-a-point-on-the-curve-itself-rather-than-a-co

It would be a great help if i could get the Objective C code or algorithm to do the above functionality.

Hi Fang, I have posted the image in my post which illustrates the requirement. Currently i have only point A and point B which is from user touch and move finger. I need to calculate point C and D and remove the path CD so that it looks like the original curve is just expanded in the user finger movement direction.

Note:- I do all this when i get a closed curve.If not closed the user is able to draw free hand which im able to achieve.Currently using quad curve for my requirement.

Any help would be greatful.

1
uibezierpathbeziernsbezierpath
The link in your post provides two different solutions. If you know the parameter associated with the point you are dragging, it is easier to go with Solution 1, which will compute the new position of a nearby control point. Otherwise, go with Solution 2, which is simply a Bezier curve interpolation. – fang
As observed in the link the above it is not clear that solution is working. – Amit Dhawan
Both solutions will work. Read them in details and post questions where you don't understand and I will try to explain. – fang
I have the point touch by user on curve boundary.Now when user drags the curve to a new point in view, it should expand the curve along with user finger movement. The algorithm provided is not sufficient or lacks information that how can we achieve the functionality. Can you please help me provide the code or detail algo her. – Amit Dhawan
I post a more detailed description about the "Solution 1" as answer. I did not elaborate on "Solution 2" for now because Solution 1 is preferable. – fang

1 Answers

0
votes

Assuming you have a quadratic Bezier curve C(t) and the point A you would like to drag is at parameter t0, then we have 

 A=C(t0)=(1-t0)^2*P0+2t0(1-t0)*P1+t0^2*P2        (1)

Now, you drag the point A to B, so we have

 B=D(t0)=(1-t0)^2*Q0+2t0(1-t0)*Q1+t0^2*Q2        (2)

Since we would like C(t) and D(t) to share the same end point, so we have P0=Q0 and P2=Q2. Then, from equations (1) and (2), we have

 B-A = 2t0(1-t0)(Q1-P1), or
 Q1 = (B-A)/(2t0(1-t0)) + P1

Similarly, if you have a cubic Bezier curve, we will have

 A=C(t0)=(1-t0)^3*P0+3t0(1-t0)^2*P1+3t0^2(1-t0)*P2+t0^3*P3        (3)
 B=D(t0)=(1-t0)^3*Q0+3t0(1-t0)^2*Q1+3t0^2(1-t0)*Q2+t0^3*Q3        (4)

Again, combining (3) and (4) and keeping the same end points P0=Q0 and P3=Q3 will result in

  B-A = 3t0(1-t0)^2*(Q1-P1)+3t0^2(1-t0)*(Q2-P2),

and we have

  Q1= w(B-A)/(3t0(1-t0)^2) + P1, and
  Q2= (1-w)(B-A)/(3t0^2(1-t0)) + P2

where w is just a weighting value between [0,1].

As you can see that for a cubic Bezier curve, you really have infinite solutions for moving P1 and P2 so that the point C(t0) is moved from point A to point B. You can choose to move only P1 or P2 (by setting w to 0.0 or 1.0) or moving both of them (by setting w to any value between 0.0 and 1.0). More complex algorithm will decide the value of w by minimizing the integrated difference between C(t) and D(t) but I guess we don't need to go there.

Above is just a more detailed description about the "Solution 1" mentioned in the link in your post. I would recommend you to go with this approach (when compared to the Solution 2). If you do have a quadratic or cubic Bezier curve, finding the parameter t0 associated with a point at C(t0) is just finding the root of degree 2 or 3 polynomial, which should not be difficult.