• iOS快速集成搜索界面下拉菜单框架


    前言

    这次推出的控件,比较常用,搜索界面下拉菜单,如果喜欢我的文章,可以关注我微博:吖了个峥,也可以来小码哥,了解下我们的iOS培训课程。后续还会更新更多内容,有任何问题,欢迎简书留言峥吖。。。

    Demo效果:


    效果图.gif

    Demo演示:

    1.创建下拉菜单

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

    2.设置下拉菜单代理

    menu.dataSource = self;

    3.添加所有下拉菜单对应的子控制器

    为什么要这样设计?,因为每个app对应的下拉菜单不确定,所以交给各个开发者决定,下拉菜单的界面。

    - (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.实现YZPullDownMenu数据源方法

    #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:@"标签-向下箭头"] forState:UIControlStateNormal];
        [button setImage:[UIImage imageNamed:@"标签-向上箭头"] forState:UIControlStateSelected];
    
        return button;
    }
    
    // 返回下拉菜单每列对应的控制器
    - (UIViewController *)pullDownMenu:(YZPullDownMenu *)pullDownMenu viewControllerForColAtIndex:(NSInteger)index
    {
        return self.childViewControllers[index];
    }
    
    // 返回下拉菜单每列对应的高度
    - (CGFloat)pullDownMenu:(YZPullDownMenu *)pullDownMenu heightForColAtIndex:(NSInteger)index
    {
        // 第1列 高度
        if (index == 0) {
            return 400;
        }
    
        // 第2列 高度
        if (index == 1) {
            return 180;
        }
    
        // 第3列 高度
        return 240;
    }

    5.【更新菜单标题,需要发送通知给我】

    为什么要这样设计?解耦,自己的控制器中就不需要导入我的框架的头文件了,侵入性不大。

    【更新菜单标题步骤】

    • 1.把 【extern NSString * const YZUpdateMenuTitleNote;】这行代码拷贝到自己控制器中,这个在YZPullDownMenu.h中

    • 2.在选中标题的方法中,发送以下通知
      [[NSNotificationCenter defaultCenter] postNotificationName:YZUpdateMenuTitleNote object:self userInfo:@{@"title":cell.textLabel.text}];

    • 3.1 postNotificationName:通知名称 =>【YZUpdateMenuTitleNote】

    • 3.2 object:谁发送的通知 =>【self】(当前控制器)

    • 3.3 userInfo:选中标题信息 => 可以多个key,多个value,没有固定的,因为有些界面,需要勾选很多选项,key可以随意定义。

    • 3.4 底层会自动判定,当前userInfo有多少个value,如果有一个就会直接更新菜单标题,有多个就会更新,满足大部分需求。

    • 3.5 发出通知,会自动弹回下拉菜单

    5.1 可以参考YZSortViewController中代码

    - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
    {
        _selectedCol = indexPath.row;
    
        // 选中当前
        YZSortCell *cell = [tableView cellForRowAtIndexPath:indexPath];
    
        // 更新菜单标题
        [[NSNotificationCenter defaultCenter] postNotificationName:YZUpdateMenuTitleNote object:self userInfo:@{@"title":cell.textLabel.text}];
    }

    源码

    点击这下载源代码



    文/峥吖(简书作者)
    原文链接:http://www.jianshu.com/p/0e1bb29be42e
    著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”。
  • 相关阅读:
    React Native 实现MQTT 推送调研 (1)
    bpmn的依赖注入
    vdom diff
    浏览器渲染与event loop
    uni-app 通过后缀名区分不同渠道版本
    网页定宽 栅格布局
    网页顶部菜单导航和左侧菜单导航的区别?
    Android利用tcpdump和wireshark抓取网络数据包
    就算做了
    我眼中的Serverless
  • 原文地址:https://www.cnblogs.com/xiao-love-meng/p/5832772.html
Copyright © 2020-2023  润新知