iPad - No user interaction on view animated on-screen

Question

Alright this is a newbie question, so I apologize in advance. I have a UIView which I laid out in Interface Builder off-screen. When the user presses a button, I would like to animate this view on-screen. It works, but I can't interact with any buttons in the UIView. I have read that only the view is moved when you animate and that the actual objects retain their positions, so I have tried setting the position of the UIViews' layers, but it causes my UIView menu to display an extra 81 pixels to the left. When this happens, I can interact with the buttons, but I need it to be flush with the right of the screen. Here is my code in the IBAction on the openMenu button:

 CABasicAnimation *moveView = [CABasicAnimation animationWithKeyPath:@"position"];
 moveView.delegate = self;
 moveView.duration=0.5; 

 // If the menu is displayed, close it!
 CGPoint currentPosView = [[entirePage layer] position];
 CGPoint destView;

 [moveView setFromValue:[NSValue valueWithCGPoint:currentPosView]];

 if (menuDisplayed) {
  // Move right to our destination
  destView.x = currentPosView.x;
  destView.y = currentPosView.y + 81;

  [moveView setToValue:[NSValue valueWithCGPoint:destView]];

 // Otherwise, open it
 } else {
  // Move left to our destination
  destView.x = currentPosView.x;
  destView.y = currentPosView.y - 81;

  [moveView setToValue:[NSValue valueWithCGPoint:destView]];
 }

 // Animate the view
 [[entirePage layer] addAnimation:moveView forKey:@"move"];

 // Set the final position of our layer
 [[entirePage layer] setPosition:destView];

 menuDisplayed = !menuDisplayed;

And then in the animationDidStop method:

 CGPoint currentPosMenu = [[menuBar layer] position];

 if (menuDisplayed) {
  currentPosMenu.x -= 81;
 } else {
  currentPosMenu.x += 81;
 }

 [[menuBar layer] setPosition:currentPosMenu];

Help???

I had a similar problem recently. Views drawn outside of its parent view's bounds cannot be interacted with. It is also correct that Core Animation only does animations. It does not alter the actual properties. Try experimenting with the userInteractionEnabled. If this doesn't work, you could go dirty and remove the view from its superview once the animation has finished, then add it again immediately after. — Benjamin Egelund-Müller, Dec 08 '10 at 22:05
The deadline on this project draws nigh, but I found a workaround (but it isn't what I want). I display the UIView initially and then slide everything over out of view. Touch interactions work when the menu is brought back, but there must be another way. — Jacob, Dec 08 '10 at 22:40

Sean · Accepted Answer · 2010-12-09T04:41:04.507

You shouldn't need to mess with the layers. You could probably achieve the effect you want by laying out the views in Interface Builder at the positions they will be in after they are animated into view. In other words, first lay things out in their final/correct positions. Don't do anything funky in IB.

In your code, after the app is launched or in a -viewDidAppear: method if you're using a UIViewController, you could offset the views by some amount and then restore them to their original position in an animation block:

myView.transform = CGAffineTransformMakeTranslation(0,81);

[UIView beginAnimations:@"slideUp" context:nil];
myView.transform = CGAffineTransformIdentity;
[UIView commitAnimations];

As for the lack of user interaction on your views, that could be a number of things. If all of your views are subviews of something like a UIImageView, UIImageView has userInteractionEnabled set to NO by default (at least if you build one in code - I'm not sure off hand what IB's default settings are for an image view). It could also mean that the superview of your views is actually too small and its frame does not contain the subviews. (If clipping was turned on for the superview, you wouldn't even be able to see subviews that are having this particular problem.)

EDIT:

I read things more carefully and see you want things to move in response to a button press, so in other words the views will need to be hidden from the start. In that case you could still lay everything out in IB in their final position, but just set them as hidden in IB. When you push the button, set the views visible (hidden=NO) before translating them. That should allow them to be laid out in their final/correct place in IB making sure that they are positioned on the proper superviews, etc while still getting the animation effect you want.

Sorry, I didn't follow up on this, but the above solution with myView.transform = CGAffineTransformMakeTranslation(81,0) and setting its transform back to the identity works fabulously. Thank you! — Jacob, Jan 06 '11 at 16:42

score 0 · Answer 2 · answered Dec 09 '10 at 04:56

Forget about the animations for now; you should move your view by setting its frame property.

E.g.:

CGRect menuFrame = entirePage.frame;
if (menuDisplayed)
{
    menuFrame.origin.x += 81;
}
else
{
    menuFrame.origin.x -= 81;
}
entirePage.frame = menuFrame;

// Do your animation here, after the view has been moved

Don't worry about the animation until you've verified that your view is being placed in the correct location. Once you've verified that that code is working correctly, then do your animation after you set the frame property.

Note that you probably don't need to use the CoreAnimation API at all, unless you're doing something complex. UIKit can do animation on its own. E.g:

[UIView beginAnimations:@"MyAnimation" context:NULL];
myFirstView.frame = ...;
myOtherView.frame = ...;
[UIView commitAnimations];

iPad - No user interaction on view animated on-screen

2 Answers2