Animate custom subview with buttons to fly in from bottom of screen in iOS 5 using storyboard

Question

I am trying to simulate the keyboard appear animation, only using a custom subview that will show the user three buttons. Is there any way I can accomplish this with storyboard (i.e. without having to programmatically create a subview)?

Answer 1

Quick Answer

Yes, although you will programmatically have to set some of the subviews properties. What you want to do is have your UIViewController call:

[UIView animateWithDuration:animations:completion:]

---

Detailed Example

in side of whatever method should bring up the keyboard try the following:

CGFloat windowWidth = self.mainView.frame.size.width;
CGFloat windowHeight = self.mainView.frame.size.height;

// center myCustomSubview along the x direction, and put myCustomSubview just below the screen when UIViewController initially gets onto the screen
CGPoint offScreenBelow = CGPointMake(windowWidth/2, windowHeight + (myCustomView.frame.size.y/2));
CGPoint onScreen = CGPointMake(windowWidth/2,windowHeight/2); 
// change the second argument of the CGPointMake function to alter the final height of myCustomSubview

// start myCustomSubview offscreen
myCustomSubview.center = offScreenBelow;
// make sure to add myCustomSubview to the UIViewController's view's subviews
[self.view addSubview:myCustomSubview];
float duration = 1.0; // change this value to make your animation slower or faster. (units in seconds)

// animate myCustomSubview onto the screen
[UIView animateWithDuration:duration
                 animations:^{
                     myCustomSubview.center = onScreen;
                 }
                 completion:^(BOOL finished){
                     // add anything you want to be done as soon as the animation is finished here
                 }];

make sure you method is being called after 'viewDidAppear:' or inside of it. when you want to get animate myCustomSubview back down off screen make sure to do the following in your UIViewController:

// set offscreen position same way as above
CGFloat windowWidth = self.mainView.frame.size.width;
CGFloat windowHeight = self.mainView.frame.size.height;

CGPoint offScreenBelow = CGPointMake(windowWidth/2, windowHeight + (myCustomView.frame.size.y/2));

// myCustomSubview is on screen already. time to animate it off screen
[UIView animateWithDuration:duration // remember you can change this for animation speed
                 animations:^{
                     myCustomSubview.center = offScreenBelow;
                 }
                 completion:^(BOOL finished){
                     [myCustomSubview removeFromSuperView];
                 }];

---

If Your Subview Is Not Showing Up

As always when dealing with subviews, make sure the frame is properly set, the subview has been added to a superview with addSubview:, the subview is not nil (and that it is properly initialized), and that neither the alpha nor opacity properties of the subview are set to 0.