Endless runner imageview animation (No SpriteKit)

Question

Is there a way to animate an UIImageView from right to left without using CABasicAnimation? I'm having troubles with it and I would like to find another way to do it.

The "ground" image its 1200 (width) x 33 (height) and I would like to move it from right to left simulating an endless runner with infinite repetitions.

How can I achieve it without CALayer/CABasicAnimation?.

Thank you!

Actually a way to simulate an endless running ground without using CABasicAnimation. I have the asset in a UIImageView. — iDec, Apr 01 '16 at 15:14
so you have several images that you want to use within one UIImageView or you have just one image and you need to move UIImageView in order to achieve the desired effect? — Andrey Chernukha, Apr 01 '16 at 15:15
Just one image that I want to reuse and attach to the end of the previous same image — iDec, Apr 01 '16 at 15:18
so you have several UIImageViews, right? you show one, move it, and then you attach the second one to the end of the first? — Andrey Chernukha, Apr 01 '16 at 15:30
Yes, but using the same asset, image. So the effect is an endless moving ground. — iDec, Apr 01 '16 at 15:31

Andrey Chernukha · Accepted Answer · 2016-04-01T20:19:23.910

There's a bunch of methods on UIView that allows any animations, particularly moving views.

You could move your imageView like this:

[UIView animateWithDuration:10
                 animations:^{

                     yourImageView.frame = frame_you_need;
                 }
                 completion:^(BOOL finished){

                    //start from the very beginning
                    //set initial frame to the image view and run the 
                    // animation again
                 }];

so you need two image views. set them start positions, run animations on both, in completion of animation repeat the animation again. that's it

UPDATE

I decided to implement this functionality myself. Here's how my animating function looks:

- (void)runView:(UIView *)aView withStartPosition:(CGPoint)startPosition
{
aView.center = startPosition;

[UIView animateWithDuration:3
                      delay:0
                    options:UIViewAnimationOptionCurveLinear
                 animations:^{

                     CGPoint newPosition = CGPointMake(aView.center.x + aView.frame.size.width, aView.center.y);
                     aView.center = newPosition;
                 }
                 completion:^(BOOL finished){

                     [self runView:aView withStartPosition:startPosition];

                 }];
}

The project demonstrating this functionality is here: Github

Awesome! The project on GitHub helped me a lot, I understand things better if I can see them :) Thanks! — iDec, Apr 02 '16 at 09:52

score 0 · Answer 2 · answered Apr 03 '16 at 11:46

Since UIView.animateWithDuration is sometimes awkward to implement, I created a way to perform animations, with sequences and groups easier. You can check it out here: GitHub - UIAnimation . It's the UIKit version of SKAction.

Using this UIAnimation a way to implement what you want would be:

//imgView is your UIImageView
let positioning = UIAnimation.moveTo(CGPointMake(view.frame.width+imgView.frame.width/2,view.frame.height/2), duration: 0) //put the UIView on the right side of the screen
let movement = UIAnimation.moveTo(CGPointMake(-imgView.frame.width/2),view.frame.height/2), duration: 5) //moves the UIView to the left side of the screen
let animation = UIAnimation.sequence([positioning,movement]) //do them sequentially
let foreverAnimation = UIAnimation.repeatAnimationForever(animation) //repeat the sequence forever
imgView.runAnimation(foreverAnimation) //start the animation

The interesting thing here is that you can store the 'foreverAnimation' in a variable and reuse it for all the imageViews you want to move. You just need to call runAnimation.

Hope it helps. If you have any problems or suggestions regarding the script, contact me please =)

Oh sorry, did not realize it was obj-c, my bad. I'll make an obj-c version — Pietro Pepe, Apr 03 '16 at 19:30
Nevertheless you can import Swift code into objective-c https://developer.apple.com/library/ios/documentation/Swift/Conceptual/BuildingCocoaApps/MixandMatch.html — Pietro Pepe, Apr 03 '16 at 19:33

Endless runner imageview animation (No SpriteKit)

2 Answers2