Home » IOS » When iOS changes UIImageView's image, add a gradie...

When iOS changes UIImageView's image, add a gradient and change the picture smoothly


When changing the image property of UIImageView, UI immediately switches from one picture to another, which is very stiff. This article records how to add fade in effect to change the image property of UIImageView.



Now there are four UIImage, which are stored in the array after initialization:




self.imgs
= @[[
UIImage
ImageNamed:@
],
[
UIImage
ImageNamed:@
],
[
UIImage
ImageNamed:@
],
[
UIImage
ImageNamed:@
"bg04" self.imageView.image >]];
>self
.imgs[0];






There is a button whose events are as follows:



- (IBAction), switchImg: (ID), sender
{}



Fill in now to complete UIImageView, change image, add one second of fade in, fade out



Method 1. uses CATransition



CATransition *transition
= [CATransition, animation]
;



transition.type
= kCATransitionFade
;



transition.duration
=
1.0f



transition.timingFunction
= [CAMediaTimingFunction, functionWithName:kCAMediaTimingFunctionEaseInEaseOut]
;



[self.imageView.layer
AddAnimation:transition forKey:nil]
;



UIImage *currentImage
= self
.imageView.image



NSUInteger, index = [self.imgs
IndexOfObject:currentImage]
;



index = (index, +1)
% [self
.imgs
Count]
;



self.imageView.image
= self
.imgs[index]



Method 2. uses the UIView class method transitionWithView


UIImage
*currentImage =
self.imageView.image


NSUInteger, index = [self.imgs
IndexOfObject:currentImage]; index = (index +
1)
% [
self.imgs
Count];


[UIView
TransitionWithView:
self.imageView
Duration:
1
Options:UIViewAnimationOptionTransitionCrossDissolve animations:^{


self.imageView.image
=
self.imgs[index];


nil

>} >];

Latest