CODEWITHSUNDEEP
objective-canimationbackground
Manish Nathani
Manish Nathani

Reputation: 49

Putting a fade in fadeout Effect on objective C

I want this to be a background in my app for Ipad. I'm building everything in objective C (native app)

I need a little help figuring out how to animate each of the triangles over the image (overlay) so it fades in and out independently of each other, the goal to make a constant shimmer like effect so the image doesn't feel sos tatic. Do i have to animate each triangle independently? Is there any algorithm that i should be looking at so it seems kinda random but isn't.

Here is the background image

enter image description here

I need some guidance on where to start and how to approach this problem, and feedback would be appreciated.

Upvotes: 4

Views: 2300

Answers (2)

Pedro Mancheno
Pedro Mancheno

Reputation: 5237

a) My advice is to use UIViewAnimationWithBlocks introduced in iOS 4. If you have a solid grasp on blocks, they can be very useful. Here's an example I created in as little as 5 minutes to illustrate:

typedef void(^FadeInOutBlock)(void);

@interface PMViewController ()
@property (nonatomic, copy) FadeInOutBlock fadeInOutBlock;
@end

Here we declare a typedef to save us from doing the block syntax all over again. We also create a property to hold the animation block.

@implementation PMViewController
@synthesize myView;

- (void)viewDidLoad
{
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.

    __block PMViewController *_self = self;


    self.fadeInOutBlock = ^{

        [UIView animateWithDuration:0.5f animations:^{
            // fade out effect
            _self.myView.alpha = 0.0f;
        } completion:^(BOOL success){
            [UIView animateWithDuration:0.5f animations:^{
                // fade in effect
                _self.myView.alpha = 1.0f;
            } completion:^(BOOL success){
                // recursively fire a new animation
                if (_self.fadeInOutBlock)
                    _self.fadeInOutBlock();
            }];
        }];
    };
}

We create the animation, within an animation. You start off with the fade out, where myView's alpha will be reduced to 0.0f in 0.5f seconds. After it's completed, a second animation will be fired, restoring the alpha for myView back to 1.0f and finally, firing out the first animation, again. (Animception)

- (void)viewDidAppear:(BOOL)animated
{
    [super viewDidAppear:animated];

    if (self.fadeInOutBlock)
        self.fadeInOutBlock();
}

@end

And finally, in view did appear you fire it off for the first time.

b)

Now, for the shimmering animation that you mention, I suggest you separate each triangle into it's own UIView and use the technique above, using different durations and alphas.

If you have to many small UIViews, group them up into a bigger UIView (by using the addSubview method) and apply the animation to those 'container' UIViews.

For instance, you could have four separate UIView containers, that have a bunch of separate UIViews as their children. You could then create four block animations, one for each container, and then apply the animation to them. I bet experimenting with that, you would be able to create pretty good effects.

Upvotes: 4

Allison
Allison

Reputation: 2383

You can do this without any special librarys. So you need to create a black UIView with an alpha of 0. Then create an NSTimer that increases the alpha of the UIView.

Upvotes: 0

Related Questions