how to animate an image to follow a line

Discussion in 'iPhone/iPad Programming' started by mandude, Nov 21, 2009.

  1. macrumors member

    Joined:
    Nov 19, 2009
    #1
    hi i have a line that is created everytime the user taps the screen going from one constant point (150, 150) to the point the user taps. I would like an image (image.png) to move from right to left along this line when the line appears, and when the picture reaches the end of the line.. disappears. heres the code of the line when the user taps :


    CGContextMoveToPoint(context, 150.0, 150.0);
    CGContextAddLineToPoint(context, touch.x, touch.y);
    CGContextStrokePath(context);



    heres the arc:
    CGContextMoveToPoint(context, 220.0, 200.0);
    CGContextAddQuadCurveToPoint(context, 150.0, 20.0, firstTouch.x, firstTouch.y);
    CGContextStrokePath(context);
     
  2. Moderator

    dejo

    Staff Member

    Joined:
    Sep 2, 2004
    Location:
    The Centennial State
    #2
    I'd start by looking at the MoveMe sample app.
     
  3. thread starter macrumors member

    Joined:
    Nov 19, 2009
    #3
    thanks for the reply, but the MoveMe app doesn't see, to meet the criteria i need. I need and image to follow an arc that is prduced
     
  4. macrumors member

    alexandergre

    Joined:
    Jul 28, 2009
    #4
    I would also like to know that.
     
  5. Moderator

    dejo

    Staff Member

    Joined:
    Sep 2, 2004
    Location:
    The Centennial State
    #5
    An arc? Your OP said a line. MoveMe has an image move along a line.
     
  6. Guest

    Darkroom

    Joined:
    Dec 15, 2006
    Location:
    Montréal, Canada
    #6
    i think you can still follow with Move Me example, replacing CGPathAddLineToPoint with CGPathAddArcToPoint to achieve what you want.

    check out CGPath Reference in the docs.
     
  7. thread starter macrumors member

    Joined:
    Nov 19, 2009
    #7
    yes you're right i can create a path that is the same here is the code, but i now need to know how to make the image appear and start to follow the path in the "EaseIn" animation curve type.


    // Making the red line appear where the arc is.
    CGContextMoveToPoint(context, 220.0, 200.0);
    CGContextAddQuadCurveToPoint(context, 150.0, 20.0, firstTouch.x, firstTouch.y);
    CGContextStrokePath(context);
    //making the same animation path as the red line will show.
    CGMutablePathRef thePath = CGPathCreateMutable();
    CGPathMoveToPoint(thePath, NULL, 220.0, 200.0);
    CGPathAddQuadCurveToPoint(thePath, NULL, 150.0, 20.0, firstTouch.x, firstTouch.y);
     

Share This Page