iOS7：像Dropbox这样的导航栏

Question

如何创建DropBox的“...”之类的导航栏项？因此，当用户选择它时，会出现更多选项。对不起这个问题，但我找不到任何地方。 Dropbox导航布局：http://cdn.pttrns.com/pttrns/1748/small/IMG_2763.PNG

Answer 1

由于UINavigationController将大部分操作推迟到堆栈顶部的控制器上，因此您只需要在您选择的控制器内部放置一个位于导航栏上方的视图，然后在点击按钮时，您可以向下设置动画。 / p>

有些事情如下：

（注意，ViewController在这里有一个UINavigationController作为其父级，在故事板中设置）

ViewController.h

@interface ViewController : UIViewController<UITableViewDataSource, UITableViewDelegate>
{
    UIView *_bottomView;
    UITableView *_dropdownView;
}

@end

ViewController.m

@implementation ViewController

// Setup
- (void)viewDidLoad
{
    [super viewDidLoad];

    // The button in the top-right
    UIButton *dropboxButton = [UIButton buttonWithType:UIButtonTypeCustom];
    // The icon you want to use for the button
    [dropboxButton setImage:[UIImage imageNamed:@"db_nav_icon"] forState:UIControlStateNormal];
    // This defines which method is triggered when the button is tapped
    [dropboxButton addTarget:self action:@selector(navButtonTapped) forControlEvents:UIControlEventTouchUpInside];
    dropboxButton.frame = CGRectMake(0, 0, 44, 32);
    // Wrapping the button in a UIBarButtonItem
    UIBarButtonItem *dropboxItem = [[UIBarButtonItem alloc] initWithCustomView:dropboxButton];
    // Adding it to the navigationcontroller
    self.navigationItem.rightBarButtonItem = dropboxItem;

    // Setting the original background-color to black
    self.view.backgroundColor = [UIColor blackColor];
    // Adding a view on top of it, because when we show the dropdown, we want to lower the opacity without fading out the dropdown (due to it being a subview of self.view)
    _bottomView = [[UIView alloc] initWithFrame:self.view.bounds];
    _bottomView.backgroundColor = [UIColor whiteColor];
    [self.view addSubview:_bottomView];

    // Creating the dropdown as a UITableView, and setting its delegates to this ViewController
    CGFloat dropdownHeight = (CGRectGetHeight(self.view.frame)/3);
    _dropdownView = [[UITableView alloc]
        initWithFrame:CGRectMake(0, -dropdownHeight, self.view.frame.size.width, dropdownHeight)
        style:UITableViewStylePlain];
    _dropdownView.delegate = self;
    _dropdownView.dataSource = self;

    [self.view addSubview:_dropdownView];
}

// Called when the button is tapped
- (void)navButtonTapped
{
    BOOL toggle = (_dropdownView.frame.origin.y == 64) ? YES : NO;
    [self toggleDropdownView:toggle animated:YES];
}

// Showing the actual dropdown view
- (void)toggleDropdownView:(BOOL)toggle animated:(BOOL)animated
{
    CGRect destination = _dropdownView.frame;
    float backgroundOpacity = (toggle) ? 1 : 0.6;
    // toggle == YES means the dropdown should appear
    destination.origin.y = (toggle) ? -destination.size.height+64 : 64;
    // If the animated-parameter is false, animate it with a duration of zero
    NSTimeInterval duration = (animated) ? 0.4 : 0;
    // Animating the opacity & dropdown position
    [UIView animateWithDuration:duration animations:^{
        _dropdownView.frame = destination;
        _bottomView.layer.opacity = backgroundOpacity;
    }];
    [_dropdownView reloadData];
}

// UITableView callbacks
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return 3;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    UITableViewCell *cell = [_dropdownView dequeueReusableCellWithIdentifier:@"CellIdentifier"];
    if (cell == nil) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"CellIdentifier"];
    }

    cell.textLabel.text = [self titleForCellAtIndexPath:indexPath];

    return cell;
}

- (NSString *)titleForCellAtIndexPath:(NSIndexPath *)idxPath
{
    NSString *title;
    switch (idxPath.row) {
        case 0:
            title = @"Upload";
            break;
        case 1:
            title = @"Create Folder";
            break;
        case 2:
            title = @"Select";
            break;
        default:
            title = @"No title found";
            break;
    }
    return title;
}

@end