Search code examples
iphoneiosuianimation

UIAnimation - Show UIView from button.frame.origin.y


I have a UIButton somewhere on my view. On touch event of button I making a UIView appear. The UIAnimation I have used make the view appear from top of window. But I want it to appear from button.frame.origin.y . Before touching the button the view is not visible. On touching the button view should start appearing from above position.

Here is the code :

-(IBAction) ShowInfowView:(id)sender{

    CGRect rect = viewInfo.frame;

    rect.origin.y = rect.size.height - rect.size.height+58.0;
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:0.70];
    [UIView setAnimationDelay:0.0];
    [UIView setAnimationCurve:UIViewAnimationCurveEaseOut];

    viewInfo.frame = rect;

    [UIView commitAnimations];

}

This is how I am hiding the view again :

-(IBAction) HideInfoView:(id)sender{

    CGRect rect = viewInfo.frame;

    rect.origin.y = -rect.size.height;
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:0.70];
    [UIView setAnimationDelay:0.0];
    [UIView setAnimationCurve:UIViewAnimationCurveEaseOut];

    viewInfo.frame = rect;

    [UIView commitAnimations];

}

In viewDidLoad I am doing the following :

CGRect rect = viewInfo.frame;
rect.origin.y = -rect.size.height;
viewInfo.frame = rect;  

UPDATE:

Please see this example. Here view is appearing from top of screen. I want it to appear from button y axis. For that matter please consider button y position a bit upwards.


Solution

  • So you want a slide-in effect, but not from the top of the screen, just some arbitrary value?

    One way to do it:

    1) You should create a view that has the dimensions and position of your desired view AFTER animation finishes, we'll call it baseview.

    2) Set this baseview property clipsToBounds to YES. This will make all subviews that are outside of the baseview's frame invisible.

    3) Add your animating view as a subview of the baseview, but set the frame so it is invisible (by plcacing it above the baseview):

    frame = CGRectMake(0, -AnimViewHeight, AnimViewWidth, AnimViewHeight);
    

    4) Animate the animview frame:

    //put this inside of an animation block
    AnimView.frame = CGRectMake(0, 0, AnimViewWidth, AnimViewHeight);
    

    EDIT:

    Example:

    //define the tags so we can easily access the views later
    #define BASEVIEW_TAG 100
    #define INFOVIEW_TAG 101
    
    - (void) showInfo
    {
            //replace the following lines with preparing your real info view
            UIView * infoView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];
            [infoView setBackgroundColor: [UIColor yellowColor]];
            [infoView setTag: INFOVIEW_TAG];
    
            //this is the frame of the info view AFTER the animation finishes (again, replace with real values)
            CGRect targetframe = CGRectMake(100, 100, 100, 100);
    
            //create an invisible baseview
            UIView * baseview = [[UIView alloc] initWithFrame:targetframe];
            [baseview setBackgroundColor: [UIColor clearColor]];
            [baseview setClipsToBounds: YES]; //so it cuts everything outside of its bounds
            [baseview setTag: BASEVIEW_TAG];
    
            //add the nfoview to the baseview, and set it above the bounds frame
            [baseview addSubview: infoView];
            [infoView setFrame:CGRectMake(0, -infoView.bounds.size.height,
                                          infoView.bounds.size.width, infoView.bounds.size.height)];
    
            //add the baseview to the main view
            [self.view addSubview: baseview];
    
            //slide the view in
            [UIView animateWithDuration: 1.0 animations:^{
                [infoView setFrame: baseview.bounds];
            }];
    
            //if not using ARC, release the views
            [infoview release];
            [baseview release];
    }
    
    - (void) hideinfo
    {
            //get the views
            UIView * baseView = [self.view viewWithTag: BASEVIEW_TAG];
            UIView * infoView = [baseView viewWithTag: INFOVIEW_TAG];
    
            //target frame for infoview - slide up
            CGRect out_frame = CGRectMake(0, -infoView.bounds.size.height,
                                          infoView.bounds.size.width, infoView.bounds.size.height);
    
            //animate slide out
            [UIView animateWithDuration:1.0
                             animations:^{
                                 [infoView setFrame: out_frame];
                             } completion:^(BOOL finished) {
                                 [baseView removeFromSuperview];
                             }];
        }