addSubview animation

Question

I have main UIView where I display different data. Then I put a button, which displays subview like this:

- (IBAction) buttonClicked:(id)sender
{
    UIView *newView = [[UIView alloc] initWithFrame:CGRectMake(25,25,50,20)];
    UILabel *newLabel = [[UILabel alloc] initWithFrame:CGRectMake(25,25,50,25)];
    newLabel.text = @"some text";
    [newView addSubview:newLabel];

    [self.view addSubview:newView];
    [newLabel release];
    [newView release];
}

newView appears fine, but it doesn't animate itself any way, it just appears immediately. How can I add some kind of animation when newView appears? Like zoom or slide down or something like that. Is there some simple code?

Answer 1

[UIView transitionWithView:containerView duration:0.5
        options:UIViewAnimationOptionTransitionCurlUp //change to whatever animation you like
        animations:^ { [containerView addSubview:subview]; }
        completion:nil];

Answer 2

Hi You could use the UIView Animations:

[newView setFrame:CGRectMake( 0.0f, 480.0f, 320.0f, 480.0f)]; //notice this is OFF screen!
[UIView beginAnimations:@"animateTableView" context:nil];
[UIView setAnimationDuration:0.4];
[newView setFrame:CGRectMake( 0.0f, 0.0f, 320.0f, 480.0f)]; //notice this is ON screen!
[UIView commitAnimations];

The SDK will now figure this out for you and animate the view to the positions you gave it. This works for most properties of UIViews: alpha, scale, bounds, frames, etc.

There are also build in animations as flip and curl:

[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1.0];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight
                           forView:newView
                            cache:YES];

[self.navigationController.view addSubview:settingsView.view];
[UIView commitAnimations];

Hope this helps out getting you started:)

Answer 3

link against QuarzCore framework

#import <QuartzCore/QuartzCore.h>

CATransition *transition = [CATransition animation];
transition.duration = 1.0;
transition.type = kCATransitionPush; //choose your animation
[newView.layer addAnimation:transition forKey:nil];
[self.view addSubview:newView]; 

Answer 4

Let's do this in swift.

var redView = UIView(frame:CGRectMake(20,20,100,100))
redView.backgroundColor = UIColor.redColor
redView.alpha = 0.0
view.addSubview(redView)

UIView.animateWithDuration(0.25) { () -> Void in
    redView.alpha = 1.0
}

Adding a subview cannot be animated by simply putting it in an animateWithDuration block. And it can't be animated using hidden.

Answer 5

I found that even with the animation blocks and options, trying to animate addSubview alone would not do anything for me. I found a workaround which is to set the subview's alpha to 0.0, add the subview, and then animate the setting of the alpha from 0.0 to 1.0. This gives me the fade in effect I was looking for.

Hope this helps someone else.

UIView *redView = [[UIView alloc] initWithFrame:CGRectMake(20, 20, 100, 100)];
redView.backgroundColor = [UIColor redColor];
redView.alpha = 0.0;

[self.view addSubview:redView];

[UIView animateWithDuration:0.5 animations:^{
  redView.alpha = 1.0;
}];

Answer 6

Swift 5

UIView.transition(with: renderView, duration: 0.25, options: .transitionCrossDissolve, animations: {
        self.renderView.addSubview(emojiView)
        self.renderView.bringSubviewToFront(emojiView)
    }, completion: nil)

in code example renderView is view to what you will add your subView