Reputation: 3810
I wonder for an iOS app, what is the best way to implement a slide-out panel with a button and slider inside it?
That is, the app will have a small "i" icon at the bottom right corner of the screen that kind of look like:
When that icon is touched, a panel of size about 1/4 of the screen will slide out from the bottom, showing a button, a slider, or possibly some other widgets.
What is the best way to implement it -- using Interface Builder or is it better purely by code, and the object to use for the panel (UIView or any existing widget that has this slide out / slide in function?).
Upvotes: 2
Views: 975
Reputation:
Creating this by Interface Builder is a pain (anyways, that tool sucks). You should definitely create that in code. It will also be easier to maintain if you can concentrate on the code and don't have to mess with setting mysterious properties in IB only for the view to be displayed at all...
You can try implementing it like this:
@interface SlideOutMenu: UIView {
UIImageView *imgView;
UITapGestureRecognizer *tap;
}
- (id)initWithImage:(UIImage *)img;
@end
@implementation SlideOutMenu
- (id)initWithImage:(UIImage *)img
{
if ((self = [self initWithFrame:CGRectMake(0, someY, 44, 44)]))
{
imgView = [[UIImageView alloc] initWithImage:img];
[self addSubview:imgView];
[imgView release];
tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(_tapped)];
[self addGestureRecognizer:tap];
[tap release];
}
return self;
}
- (void)_tapped
{
if (self.frame.origin.x > 1.0) // 1.0: some tolerance b/c of floating point numbers
{
[UIView animateWithDuration:0.3 animations:^{
self.frame = CGRectMake(0, self.frame.origin.y, self.frame.size.width, self.frame.size.height);
}];
}
else
{
[UIView animateWithDuration:0.3 animations:^{
self.frame = CGRectMake(120.0, self.frame.origin.y, self.frame.size.width, self.frame.size.height);
}];
}
}
@end
Upvotes: 1
Reputation: 5552
Assuming you are going to use this in multiple locations within your app you would probably want to make it as a reusable component. I would suggest making the slide out screen its own view controller where you could create its view using IB if you need. When the user hits the 'i' you would alloc the slide out view controller, add its view as a subview to your current view controller and animate it in. If you need to communicate between the slide out and your current view controller you could just create a custom delegate protocol on your slide out. I recognize this is making some assumptions but would likely be a clean solution for you.
Upvotes: 2