前言

這次推出的控件，比較常用，搜索界面下拉菜單，如果喜歡我的文章，可以關(guān)注我微博:袁崢Seemygo

Demo效果:

效果圖.gif

Demo演示:

1.創(chuàng)建下拉菜單

    YZPullDownMenu *menu = [[YZPullDownMenu alloc] init];
    menu.frame = CGRectMake(0, 20, YZScreenW, 44);
    [self.view addSubview:menu];

2.設(shè)置下拉菜單代理

menu.dataSource = self;

3.添加所有下拉菜單對(duì)應(yīng)的子控制器

為什么要這樣設(shè)計(jì)?，因?yàn)槊總€(gè)app對(duì)應(yīng)的下拉菜單不確定，所以交給各個(gè)開(kāi)發(fā)者決定，下拉菜單的界面。

- (void)setupAllChildViewController
{
    YZAllCourseViewController *allCourse = [[YZAllCourseViewController alloc] init];
    YZSortViewController *sort = [[YZSortViewController alloc] init];
    YZMoreMenuViewController *moreMenu = [[YZMoreMenuViewController alloc] init];
    // 控制器最好作為自己的子控制器
    [self addChildViewController:allCourse];
    [self addChildViewController:sort];
    [self addChildViewController:moreMenu];
}

4.實(shí)現(xiàn)YZPullDownMenu數(shù)據(jù)源方法

#pragma mark - YZPullDownMenuDataSource
// 返回下拉菜單多少列
- (NSInteger)numberOfColsInMenu:(YZPullDownMenu *)pullDownMenu
{
    return 3;
}

// 返回下拉菜單每列按鈕
- (UIButton *)pullDownMenu:(YZPullDownMenu *)pullDownMenu buttonForColAtIndex:(NSInteger)index
{
    YZMenuButton *button = [YZMenuButton buttonWithType:UIButtonTypeCustom];
    [button setTitle:_titles[index] forState:UIControlStateNormal];
    [button setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
    [button setTitleColor:[UIColor colorWithRed:25 /255.0 green:143/255.0 blue:238/255.0 alpha:1] forState:UIControlStateSelected];
    [button setImage:[UIImage imageNamed:@"標(biāo)簽-向下箭頭"] forState:UIControlStateNormal];
    [button setImage:[UIImage imageNamed:@"標(biāo)簽-向上箭頭"] forState:UIControlStateSelected];
    
    return button;
}

// 返回下拉菜單每列對(duì)應(yīng)的控制器
- (UIViewController *)pullDownMenu:(YZPullDownMenu *)pullDownMenu viewControllerForColAtIndex:(NSInteger)index
{
    return self.childViewControllers[index];
}

// 返回下拉菜單每列對(duì)應(yīng)的高度
- (CGFloat)pullDownMenu:(YZPullDownMenu *)pullDownMenu heightForColAtIndex:(NSInteger)index
{
    // 第1列 高度
    if (index == 0) {
        return 400;
    }
    
    // 第2列 高度
    if (index == 1) {
        return 180;
    }
    
    // 第3列 高度
    return 240;
}

5.【更新菜單標(biāo)題,需要發(fā)送通知給我】

為什么要這樣設(shè)計(jì)？解耦，自己的控制器中就不需要導(dǎo)入我的框架的頭文件了，侵入性不大。

【更新菜單標(biāo)題步驟】

• 1.把 【extern NSString * const YZUpdateMenuTitleNote;】這行代碼拷貝到自己控制器中，這個(gè)在YZPullDownMenu.h中

• 2.在選中標(biāo)題的方法中，發(fā)送以下通知
  [[NSNotificationCenter defaultCenter] postNotificationName:YZUpdateMenuTitleNote object:self userInfo:@{@"title":cell.textLabel.text}];

• 3.1 postNotificationName：通知名稱 =>【YZUpdateMenuTitleNote】

• 3.2 object:誰(shuí)發(fā)送的通知 =>【self】(當(dāng)前控制器)

• 3.3 userInfo:選中標(biāo)題信息 => 可以多個(gè)key,多個(gè)value,沒(méi)有固定的，因?yàn)橛行┙缑妫枰催x很多選項(xiàng)，key可以隨意定義。

• 3.4 底層會(huì)自動(dòng)判定，當(dāng)前userInfo有多少個(gè)value,如果有一個(gè)就會(huì)直接更新菜單標(biāo)題，有多個(gè)就會(huì)更新，滿足大部分需求。

• 3.5 發(fā)出通知，會(huì)自動(dòng)彈回下拉菜單

5.1 可以參考YZSortViewController中代碼

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
    _selectedCol = indexPath.row;
    
    // 選中當(dāng)前
    YZSortCell *cell = [tableView cellForRowAtIndexPath:indexPath];

    // 更新菜單標(biāo)題
    [[NSNotificationCenter defaultCenter] postNotificationName:YZUpdateMenuTitleNote object:self userInfo:@{@"title":cell.textLabel.text}];
}

源碼

點(diǎn)擊這下載源代碼