basic animation a few images

Question

I'm trying to animate the same images in a different position like this:

    for (int i = 0; i == 3; i++) {

        UIImageView *imageToAnimate = [[UIImageView alloc] initWithFrame: imageFrameTwo];

        [imageToAnimate setImage: [UIImage imageNamed: imageTwo]];

        CGPoint point0 = imageTwoImage.layer.position;
        CGPoint point1 = { point0.x + 10*i, point0.y - 10*i +  50};

        CABasicAnimation *anim = [CABasicAnimation animationWithKeyPath:@"position.y"];
        anim.fromValue  = @(point0.y);
        anim.toValue    = @(point1.y);
        anim.duration   = 15.0f;
        anim.repeatCount = HUGE_VALF;
        anim.cumulative  = NO;
        anim.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];

        // First we update the model layer's property.
        imageToAnimate.layer.position = point1;

        // Now we attach the animation.
        [imageToAnimate.layer  addAnimation:anim forKey:@"position.y"];
        [theView addSubview:imageToAnimate];
    }

But nothing happens. Without cycle it works well. Am I doing something wrong?

There are plenty of it. You should go to www.google.com first. — Mert Buran, Dec 04 '13 at 09:06

score 0 · Answer 1 · answered Dec 04 '13 at 09:13

0

[UIView animateWithDuration:DURATION delay:DELAY options:YOUR_UIViewAnimation animations:^(void)

This should do the trick ;)

answered Dec 04 '13 at 09:13

Albara

1,306
8
14

[UIView animateWithDuration:5 delay:0.2 options:imageToAnimate animations:^{ imageToAnimate.frame = CGRectMake(imageToAnimate.frame.origin.x + 10, imageToAnimate.frame.origin.y - 10 + 50, imageToAnimate.frame.size.width, imageToAnimate.frame.size.height); } completion:^(BOOL finished) { NSLog(@"done"); }]; did like so. how to infinite it? – Pavel Dec 04 '13 at 09:22
So you want it to never stop? Animate forever? Well, just put it in a separate method and then call it from the completion handler everytime it is finished ;) .... was that your question? – Albara Dec 04 '13 at 09:29
One option is UIViewAnimationOptionCurveLinear, but there isn't any that repeats... But the idea of recursive should do the trick (Y) – Albara Dec 04 '13 at 09:34
there is an option: UIViewAnimationOptionRepeat – Pavel Dec 04 '13 at 10:25

Yunus Nedim Mehel · Accepted Answer · 2013-12-04T11:24:40.157

0

I won't go into details but you can try using animation blocks. 0 and 100 are the origin points. Also, make sure you are not using autoLayout, you should either disable it, or animate using autolayout constraints instead of frame changes.

[UIView animateWithDuration:0.3 
                      delay:1 
                    options:UIViewAnimationOptionCurveEaseInOut | UIViewAnimationOptionBeginFromCurrentState                                 
                  animations:^ {

//[yourView setFrame:CGRectMake(0,100,yourView.frame.size.width,yourView.frame.size.height )];
[yourView setFrame:CGRectMake(yourView.frame.origin.x + 100,100,yourView.frame.size.width,yourView.frame.size.height )];


                                }
                  completion:^ (BOOL finished) {

                            }] ;

For example, to animate on x axis you just need to have a different x value in the

CGRectMake ( <desired x value here>, y, ....)

The line inside the animation block should slide your view to right by 100 pixels now.

edited Dec 04 '13 at 11:24

answered Dec 04 '13 at 09:25

Yunus Nedim Mehel

12,089
4
50
56

yes, i did like so ) its very helpful. how to use the options? like an array? – Pavel Dec 04 '13 at 09:34
@Pavel, You can enter any animation option if you seperate them using '|' character like I did. There are lots of other options, left click after writing one to see the whole list. – Yunus Nedim Mehel Dec 04 '13 at 09:51
Sorry, it should be cmd + left click – Yunus Nedim Mehel Dec 04 '13 at 10:34
how can i do complicated animation with this? like moving x +_ ? – Pavel Dec 04 '13 at 10:38
It is actually very simple, extended my answer. – Yunus Nedim Mehel Dec 04 '13 at 11:22
yes, it works, but only one way. i want it to move forward and backward. how can i do this? – Pavel Dec 04 '13 at 12:10
First set the delay:0. Then copy the animation block, and paste it in the completion block, so after the first animation finishes a second one will start. Now change the +100 to -100 in the anim block inside completion block, your view will jiggle. Tweak with duration parameter for desired effect. – Yunus Nedim Mehel Dec 04 '13 at 12:41

basic animation a few images

2 Answers2