How to show/hide a UIView with animation in iOS?

Question

The main UIView contains two subviews - UIView_1 and UIView_2.
In the UIView_2, there is a button to show or hide the UIView_1.
For example, when a user touches the button to show the UIView_1, then UIView_1 will slide down and UIView_2 will push downwards with transition.
I have very little knowledge in animation. Can someone show me some sample code for reference?
Should I use CGAffineTransformMakeTranslation?
Thanks. enter image description here

Answer for this question can be found easily by stumbling in stack overflow. Not merely a question or an issue.. Please use papa google once before posting. — Anil Kumar, May 17 '14 at 04:56
@Anil This question is rather old ;) I guess it was a legitimate (non-duplicate) question back in 2011 ;) — HAS, May 17 '14 at 05:23

score 20 · Accepted Answer · answered Dec 17 '11 at 04:27

You don't need anything so complex. Just change the view's frame size.

    NSTimeInterval animationDuration = /* determine length of animation */;
    CGRect newFrameSize = /* determine what the frame size should be */;
    [UIView beginAnimations:nil context:NULL];
    [UIView setAnimationDuration:animationDuration];
    theViewToChange.frame = newFrameSize;
    [UIView commitAnimations];

score 7 · Answer 2 · answered May 17 '14 at 04:51

Simply Hide/show with fadein/out effect `

/To Show/

sliderView.hidden = NO;
sliderView.alpha = 0.1;
[UIView animateWithDuration:0.25 animations:^{
    sliderView.alpha = 1.0f;
} completion:^(BOOL finished) {
    // do some
}];

/To hide/

[UIView animateWithDuration:0.25 animations:^{
    sliderView.frame =  CGRectMake(130, 30, 0, 0);
    [sliderView setAlpha:0.1f];
} completion:^(BOOL finished) {
    sliderView.hidden = YES;
}];

`

score 3 · Answer 3 · answered Dec 17 '11 at 04:33

It depends on what you want to do with UIView_2.

Place UIView_1 below UIView_2 in Interface Builder.
Size UIView_2 to take up all the space below the UINavigationBar.
Use the following code to either resize (using uiview2_resized_rect) the frame for UIView_2, or translate/move the frame for UIView_2 (using uiview2_translated_rect ):


CGRect uiview1_original_rect = UIView_1.frame;
CGRect uiview2_original_rect = UIView_2.frame;

CGRect uiview2_translated_rect = CGRectMake(uiview2_original_rect.origin.x, 
        uiview2_original_rect.origin.y+uiview1_original_rect.size.height, 
        uiview2_original_rect.size.width, 
        uiview2_original_rect.size.height);

CGRect uiview2_resized_rect = CGRectMake(uiview2_original_rect.origin.x, 
    uiview2_original_rect.origin.y+uiview1_original_rect.size.height, 
    uiview2_original_rect.size.width, 
    uiview2_original_rect.size.height-uiview1_original_rect.size.height);

[UIView animateWithDuration:0.300 delay:0.0 
                    options:UIViewAnimationOptionCurveEaseInOut|UIViewAnimationOptionBeginFromCurrentState 
                 animations:^{
    //uncomment this and comment out the other if you want to move UIView_2 down to show UIView_1
    //UIView_2.frame = uiview2_translated_rect;
    UIView_2.frame = uiview2_resized_rect;
} completion:^(BOOL finished) {

}];

How to show/hide a UIView with animation in iOS?

3 Answers3