When animation finishes, keep the ending image of the animation - iphone

i have an animation that starts out as a plain back ground. when the animation begins, it plays and when it finishes, the screen goes back to the original background. How can i keep the ending image of my animation and set it as my background? Thanks for the help!!
By the way, what i am asking is similar to a childrens book. When the animation finishes, i want the background to stay the same as the very last part of the animation. So it looks like the animation just stops!

Assuming your NSArray for the images is called imageArray and your UIImageView is called imageView, try this:
imageView.image = [imageArray lastObject];
imageView.animationImages = imageArray;
imageView.animationDuration = 1.0f;
imageView.animationRepeatCount = 1;
[imageView startAnimating];
That should loop through the images once, and then once it ends, leave the UIImageView on the last image. Hope that Helps!

Related

Should I animate a three dots loading animation using Core Animation or should I find a way to show a gif of the same operation?

Basically I have three dots that are supposed to get bigger and smaller in succession on the loading screen and I'm wondering what is the best way to do a simple animation like that - coding or otherwise?
For a simple animation you can use a UIImageView animation to animate a set of images (i.e. use the images as frames in the animation).
UIImageView* dotsImageView= [[UIImageView alloc] initWithFrame:dotsFrame];
// load all the frames of your animation
dotsImageView.animationImages = #[[UIImage imageNamed:#"image1.png"],
[UIImage imageNamed:#"image2.png"],
[UIImage imageNamed:#"image3.png"]];
// set how long it will take to go through all images
dotsImageView.animationDuration = 1.0;
// repeat the animation forever
dotsImageView.animationRepeatCount = 0;
// start the animation
[dotsImageView startAnimating];
// add it to the view
[self.view addSubview:dotsImageView];
If you don't want to use preset images for the dots, you can chain together UIView animations using the completion block. Here's a tutorial on UIView animations:
http://www.raywenderlich.com/5478/uiview-animation-tutorial-practical-recipes

smooth UIImageView animation for multiple images

I have used animation on an UIImageView to animate 36 images like this:
-(void) kickOffTheAnimation {
self.imgView.animationImages = imagesArr;
[self.imgView setAnimationRepeatCount:HUGE_VALF];
self.imgView.animationDuration =0.9;
[self.imgView startAnimating];
}
and myviewDidLoad method is simply as:
NSMutableArray *imagesArr = [[NSMutableArray alloc] init];
for(int i =0; i<35; i++) {
[imagesArr addObject:[UIImage imageNamed: [NSString stringWithFormat:#"img%i#2x.png",i]]];
}
[self kickOffTheAnimation];
However, there is a small glitch, the animation is not smooth when it reaches the final image and repeats the animation from the first image, how can I fix this problem?
EDIT:
the exact problem is there is a milliseconds hang happens after reaching img35.png and showing img0.png
I have sometimes noticed a very small loop delay with a larger in memory image array. It could be that some resource has to be reloaded. I have used AVPlayer in repeat mode with better luck for a small movie. An actual movie might also compress better.

xcode: Continuously generating images that move in a direction

I've made a program that generates an image at a random x-coordinate at the top of the screen. The image then falls down to the bottom. However, I want to keep generating new images (of the same image) every few seconds so that it's as though these duplicates of the same image are continually "raining" from the top. (Note: Eventually, as I continue to develop this app, I will need to recall the location of each image at any moment, so I believe I will need each spawned image to be part of an array. I also believe I must move each image step-by-step, so I cannot rely on animation).
The problem is: How can I make all of this code repeat every 0.5 seconds so that each newly spawned image has its own moveObject timer. It will be like raindrops falling from the top.
#implementation ViewController {
UIImageView *_myImage;
}
- (void)viewDidLoad
{
srand(time(NULL));e
int random_x_coordinate = rand() % 286;
CGRect myImageRect = CGRectMake(random_x_coordinate, 0.0f, 40.0f, 40.0f);
UIImageView *myImage = [[UIImageView alloc] initWithFrame:myImageRect];
[myImage setImage:[UIImage imageNamed:#"flake.png"]];
myImage.opaque = YES;
[self.view addSubview:myImage];
_myImage = myImage;
//FALLING BIRDS TIMER
moveObjectTimer = [NSTimer scheduledTimerWithTimeInterval:0.001 target:self selector:#selector(moveObject) userInfo:nil repeats:YES];
}
//FALLING BIRDS MOVER
-(void) moveObject { // + means down and the number next to it is how many pixels y moves down per each tick of the TIMER above
_myImage.center = CGPointMake(_myImage.center.x, _myImage.center.y +1);
}
You have different solutions:
Just 1 timer in which you update an array of UIImageView (I prefer this one)
Subclass Imageview and put the timer inside the class so each one would have its own timer
Maybe you can use [UIView animateWithDuration... instead of timers, but not sure if you can use many at the same time.
The problem is: How can I make all of this code repeat every 0.5
seconds so that each newly spawned image has its own moveObject timer.
Look into Core Animation's particle effects -- they're not just for smoke, fog, and fire. By setting up a particle emitter and creating particle cells using your image, you can have Core Animation take care of the whole operation. I don't see much official documentation on the topic, but you can read the reference page for CAEmitterLayer to get an idea of how it works, and then take a look at the tutorial on raywenderlich.com.
Use this function for each raindrop object.Just provide point to move to:
-(void)raindropAnimation:(CGPoint)dropPoint
{
raindrop.frame = CGRectMake(dropPoint.x,0,raindrop.frame.size.width,raindrop.frame.size.height) //here y is 0 ie topmost
[UIView animateWithDuration:2.0
delay:0.0
options:UIViewAnimationCurveEaseInOut
animations:^ {
raindrop.frame = CGRectMake(dropPoint.x,dropPoint.y,raindrop.frame.size.width,raindrop.frame.size.height) //will move to point
}
completion:^(BOOL finished) {
[self perfromSelector:#selector(raindropAnimation:CGPointMake(xnewpointhere,ynewpointhere))];
}];

UIImageView Fade In/Out with NSArray

I have an NSArray of images that I want to fade in/out between each other (much like how Flickr handles their home screen).
The problem I'm having is figuring out how to utilize the [UIView beginAnimations]; with the NSArray... any idea?
My code is below.
Thanks in advance!
NSArray *myImages = [NSArray arrayWithObjects:
[UIImage imageNamed:#"show_robmachado.jpg"],
[UIImage imageNamed:#"show_losness.jpg"],
[UIImage imageNamed:#"show_blanchard.jpg"],
[UIImage imageNamed:#"show_tonino.jpg"],
nil];
homeAnimation.animationImages = myImages;
homeAnimation.animationRepeatCount = 0; // 0 = loops forever
homeAnimation.animationDuration = 7.0;
[homeAnimation startAnimating];
The array method is really for simple frame-based animations, not for transitions.
Instead I would have two UIImageViews at the same position, and set up a timer that would work through the array, using UIView animations to animate one image view fading to an alpha of 0 and the other to an alpha of 1. Then you'd get a kind of fading switch you are going for.
The .image property on a UIImageView might also be animatable, try in a timed loop changing .image on an image view in a UIView based animation block and see if you get a cross-fade.

Can I stop UIImageView Animation at last frame?

I have an animation using a UIImageView:
myAnimatedView.animationImages = myImages;
myAnimatedView.animationDuration = 1;
myAnimatedView.animationRepeatCount = 1;
[myAnimatedView startAnimating];
How can I tell to animation to stop at the last frame (keeping the last image in the series visible)?
the image property on the UIImageView class has the following docs:
"If the animationImages property contains a value other than nil, the contents of this property are not used."
So the trick to hold on the last frame of an animation in iOS4 is to first set the image property to that last frame (while animationImages is still nil), then set the animationImages property and call startAnimating. When the animation completes, the image property is then displayed. No callback/delegate needed.
You can set image of last frame to your UIImageView instance and then when animation will finish last frame image remains visible. Here is the code:
// create your array of images
NSArray *images = #[[UIImage imageNamed:#"video1.png"], [UIImage imageNamed:#"video2.png"]];
UIImageView *imageView = [UIImageView new];
imageView.image = images.lastObject;
imageView.animationImages = images;
imageView.animationDuration = 1.0; // seconds
imageView.animationRepeatCount = 1;
[imageView startAnimating];
After the animation finishes you can set your UIImageView image to the last frame of your animation.
myAnimatedView.image = [myAnimatedImages objectAtIndex:myAnimatedImages.count - 1]
I don't think there is a delegate method that would notify you on animationFinish event so you would need to start a NSTimer with same duration as the animation to get the notification.
UIImageViewAnimation documentation
Swift version will be as given below but in objective-c logic will be same
you can hack it just setting the image of the UIImageView to the last image of the images array. just before the code of animation, like imageView.image = arrayOfImage.last
the whole logic is given below
imageView.image = arrayOfImage.last //(this line create magic)
imageView.animationImages = arrayOfImage
imageView.animationDuration = 1.0
imageView.animationRepeatCount = 1
imageView.startAnimating()
I just toss a UIView holding the first frame on top of the animation UIView...
make the animation view hidden and set it's image as the last frame...
and then have them switch hidden properties during the process.
so... just before your last line...
// quickly hide the view that only holds the first frame
myOtherView.hidden = YES;
// start the animation
[myAnimatedView startAnimating];
// show the animation view
myAnimatedView.hidden = NO;
// BAM, done. It will use the last image when it ends.
Less code, more IB, whenever possible.
I've achieved this by creating a subclass of UIImageView, overriding startAnimating() and setting the image property to be the last image in your image array before you call super.startAnimating().
This in addition to setting the animationRepeatCount to 1 achieves the desired effect.
Here is my Swift class:
class SuccessAnimationImageView: UIImageView {
var duration: NSTimeInterval = 2
override func didMoveToSuperview() {
super.didMoveToSuperview()
setupImages()
}
override func startAnimating() {
setLastFrame()
super.startAnimating()
}
func setupImages() {
animationImages = ImageHelper.successAnimationImages
image = animationImages?.first
animationRepeatCount = 1
}
func setLastFrame() {
image = animationImages?.last
}
}
Was having issues in start/stop animation & managing animation count So used this pod
imageViewObject.animate(withGIFNamed: "gif_name", loopCount: 1) {
print("animating image")
}
To start/stop animation :
imageViewObject.isAnimatingGIF ? imageViewObject.stopAnimatingGIF() : imageViewObject.startAnimatingGIF()
Have you set the removedOnCompletion property of the rotation animation to NO,
e.g.,
rota.removedOnCompletion = NO;
That should leave the presentation layer where it was when the animation finished. The default is YES, which will snap back to the model value, i.e., the behavior you describe.
The fillMode should also be set,
i.e.,
rota.fillMode = kCAFillModeForwards;
You can Stop the animation by setting the UIImageView property
animateImg.animationDuration = 1