How to recreate animations in iPad Notes?

Question

When you use the iPad Notes app (from Apple) in landscape mode, you see a list of notes on the left. If you select a note, you will see a beautiful animation, similar to someone marking a note with a red pencil.

I already have a drawing that looks like a red circle, but how do I revive it? Thank you in advance.

Edit 1
Here is the link to the graphic: red circle

Answer 1

I really don't know the animation you're talking about, but if I understand what it does, then one easy way is to use the built-in support UIImageViewto display a series of images as animations. Then you need a separate image for each frame.

NSArray* imageFrames = [NSArray arrayWithObjects:[UIImage imageNamed:@"frame1.png"],
                                                 [UIImage imageNamed:@"frame2.png"],
                                                 [UIImage imageNamed:@"frame3.png"],
                                                 [UIImage imageNamed:@"frame4.png"],
                                                 nil];
UIImageView* imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0,0,100,100)];
[imageView setAnimationImages:imageFrames];
[imageView setAnimationDuration:10];
[imageView setAnimationRepeatCount:3];

The above creates UIImageViewwith 4 frames that enliven more than 10 seconds. Animation is repeated 3 times.

See the documentation for more information UIImageView.

Obviously, you really need a series of images for the animation.

Answer 2

- (void)moveRedCircle {
    UIImageView *redcircle = [[UIImageView alloc] initWithImage:[UIImage imageWithContentsOfFile:@"redcircle.png"]];
    redcircle.bounds.origin = CGPointMake(x, y);
    [self.view addSubview:redcircle];
    [UIView animateWithDuration:4 animations:^{
        redcircle.bounds.origin = CGPointMake(x, y);
    }];
}

Replace the first x and y with where you want the circle to be initially. Replace the last x and y with the source of the place where you want to move it.