How can I present a UIView from the bottom of the screen like a UIActionSheet?

Question

I'd like a UIView to slide up from the bottom of the screen (and stay mid-screen) like a UIActionSheet. How can I accomplish this?

UPDATE: I am using the following code:

TestView* test = [[TestView alloc] initWithNibName:@"TestView" bundle:nil];
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.4];
[UIView setAnimationCurve:UIViewAnimationCurveEaseIn];

test.view.center = CGPointMake(160,100);
//test.view.frame = CGRectMake(0, 0, 160, 210);
[[[UIApplication sharedApplication] keyWindow] addSubview:test.view];

[UIView commitAnimations];  

The view seems to be animating from the corner and appearing in the corner. How can I make it slide up from the bottom? Getting close!

Solution 1

Do what Matt did here, but just change the values and direction. I have code at home to do this from the bottom if you need it later (I'll update this post).

Link: http://cocoawithlove.com/2009/05/intercepting-status-bar-touches-on.html

Also, don't forget to take out the bit of code that shifts the main view downward (so instead the UIView just pops over top like an ActionSheet)

Updated with code:

This is what I use in one of my apps to show/hide a little "options" view:

- (void)toggleOptions:(BOOL)ViewHidden
{
// this method opens/closes the player options view (which sets repeat interval, repeat & delay on/off)

if (ViewHidden == NO)
{
    // delay and move view out of superview
    CGRect optionsFrame = optionsController.view.frame;

    [UIView beginAnimations:nil context:nil];

    optionsFrame.origin.y += optionsFrame.size.height;
    optionsController.view.frame = optionsFrame;

    [UIView commitAnimations];

    [optionsController.view
     performSelector:@selector(removeFromSuperview)
     withObject:nil
     afterDelay:0.5];
    [optionsController
     performSelector:@selector(release)
     withObject:nil
     afterDelay:0.5];
    optionsController = nil;
}
else
{
    optionsController = [[PlayOptionsViewController alloc] init];

    //
    // Position the options at bottom of screen
    //
    CGRect optionsFrame = optionsController.view.frame;
    optionsFrame.origin.x = 0;
    optionsFrame.size.width = 320;
    optionsFrame.origin.y = 423;

    //
    // For the animation, move the view up by its own height.
    //
    optionsFrame.origin.y += optionsFrame.size.height;

    optionsController.view.frame = optionsFrame;
    [window addSubview:optionsController.view];

    [UIView beginAnimations:nil context:nil];

    optionsFrame.origin.y -= optionsFrame.size.height;
    optionsController.view.frame = optionsFrame;

    [UIView commitAnimations];
}
}

Solution 2

One way would be to use the present modal view controller on the view controller:

presentModalViewController:(UIViewController *)modalViewController animated:(BOOL)animated

For more info take a look at the UIViewController documentation.

EDIT: If you want a mid-screen view you'll need to animate it into position as @jtbandes has pointed out. I suggest also adding some candy to UIView animation block:

[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.4];
[UIView setAnimationCurve:UIViewAnimationCurveEaseIn];

myView.center = CGPointMake(x,y);

[UIView commitAnimations];

You can then move it again if you need to go full screen or dismiss it.

Solution 3

You'll have to move the view yourself, by setting its center or frame. I'll let you figure out what to set those to. But for the animation:

// set the view to its initial position here...

[UIView beginAnimations:nil context:NULL];
// move the view into place here...
[UIView commitAnimations];

Comments

[Sheehan Alam]

I want it to behave like a UIActionSheet as well, by showing the view mid-screen.

[Sheehan Alam]

Thanks for the tip! I'm almost there. I have modified my post to show my code. It isn't exactly sliding up.

[Sheehan Alam]

Thanks for the tip! I'm almost there. I have modified my post to show my code. It isn't exactly sliding up.

[Sheehan Alam]

I like your solution. Is there any way you stop the user from interacting with the view behind this popup?

[iwasrobbed]

One simple way would be to just disable user interaction (i.e. [someView setUserInteractionEnabled: NO];) of that view. A better way would be to first show another view with some sort of semi-transparent gradient with user interaction disabled and then animate your new view. This way it makes sense to the user that since the other view is somewhat dimmed out, that they can no longer interact with it. Otherwise they might think something's broken. Just think of how a UIAlertView does this. When you're done with it, just remove both views

[marciokoko]

How about a view like the free ups app? It's like a notification center view that the user can drag/slide and can even regulate how far up or down the view is displayed over the other view.

[kleopatra]

Note that link-only answers are discouraged, SO answers should be the end-point of a search for a solution (vs. yet another stopover of references, which tend to get stale over time). Please consider adding a stand-alone synopsis here, keeping the link as a reference.