美文网首页iOS技术分享ios开发IOS开发路上的故事
搜索框UISearchController的使用及所遇到的坑

搜索框UISearchController的使用及所遇到的坑

作者: TongRy | 来源:发表于2017-06-23 17:49 被阅读4614次
    不忘初心,坚持下去

    以前没遇到过搜索功能,所以一直也没做,这次项目中用到了,就查了下资料,因为我们项目支持iOS8以上的设备,所以就采用的UISearchController,然后就愉快的用了起来,可是不用不知道,一用吓一跳呀,刚开始写的demo,没有navigation,也没有sectionIndex,感觉一点坑都没有,简直很爽,殊不知无数的坑在等着我跳。下面我就讲讲我的使用及我所遇到的坑。

    UISearchController的使用

    使用懒加载:

    - (UISearchController *)searchController {
        if(!_searchController) {
            UISearchController *searchVC = [[UISearchController alloc] initWithSearchResultsController:nil];
            _searchController = searchVC;
            //取消蒙版
            _searchController.dimsBackgroundDuringPresentation = NO;
            _searchController.searchResultsUpdater = self;
            _searchController.searchBar.placeholder = @"搜索";
            //改变searchBar的文字
            [_searchController.searchBar setValue:@"取消" forKey:@"_cancelButtonText"];
            //改变取消按钮字体颜色
            self.searchController.searchBar.tintColor = [UIColor colorWithRed:239 / 255.0 green:128 / 255.0 blue:25 / 255.0 alpha:1];
            //去掉searchController.searchBar的上下边框(黑线)
            UIImageView *barImageView = [[[_searchController.searchBar.subviews firstObject] subviews] firstObject];
            barImageView.layer.borderColor = UIColorFromRGB(0xe5e5e5).CGColor;
            barImageView.layer.borderWidth = 1;
            //改变searchController背景颜色
            _searchController.searchBar.barTintColor = UIColorFromRGB(0xe5e5e5);
             //此处重要一步,将searbar显示到界面上(在tableView头视图中添加时searbar有时会消失,不可控制,原因未找到)
            [self.view addSubview:_searchController.searchBar];
            
        }
        return _searchController;
    }
    

    第一个大坑 —— sectionIndex 和 searchBar冲突

    searchBar加到tableView的headerView上,然后为tableView添加sectionIndex,问题就出来了,因为sectionIndex会占用位置,tableView整体左移,searchBar也不例外。下面请看图:


    tableView整体左移.png

    根据需求这个不是我们要的效果,那如何解决这个问题的,所以在网上找答案,刚开始用百度(没买翻墙软件,所以没到万不得已不Google),说把sectionIndex背景清除就可以,可是并不能。

        [self.brandListTableView setSectionIndexBackgroundColor:[UIColor clearColor]];
    

    然后在百度找了好几页也没找到满意的答案,最后在google里面找到了,解决方法是把searchBar加在一个UIView上,然后把UIView加在tableHeaderView上,同时sectionIndex背景色要清除,也就是上面一段代码(因为sectionIndex一直浮在最上层),就完美解决问题。

        UIView *headerView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, _brandListTableView.bounds.size.width, _searchController.searchBar.size.height)];
        [headerView addSubview:self.searchController.searchBar];
        //设置tableHeaderView
        [self.brandListTableView setTableHeaderView:headerView];
    

    效果图:


    正常图.png

    第二个坑 —— 搜索时searchBar向上偏移64

    当在有navigation的时候点击,搜索时,searchBar向上偏移64,网上的解决方案是:

        self.definesPresentationContext = YES;
    

    给出的解释是:

    设置definesPresentationContext为YES,可以保证在UISearchController在激活状态下用户push到下一个view controller之后search bar不会仍留在界面上。
    苹果对它官方的解释是// know where you want UISearchController to be displayed
    a、如果不添加上面这行代码,在设置hidesNavigationBarDuringPresentation这个属性为YES的时候,搜索框进入编辑模式会导致,searchbar不可见,偏移-64;
    在设置为NO的时候,进入编辑模式输入内容会导致高度为64的白条,猜测是导航栏没有渲染出来
    b、如果添加了上面这行代码,在设置hidesNavigationBarDuringPresentation这个属性为YES的时候,输入框进入编辑模式正常显示和使用;在设置为NO的时候,搜索框进入编辑模式导致向下偏移64,具体原因暂时未找到

    第三个坑 —— 搜索结果tableView向上偏移20px

    上面的问题解决之后,新问题又出现了,那就是搜索出结果后,tableView会向上偏移20px。
    如图:


    搜索结果向上偏移20px.png

    解决办法是:

    -(void)viewDidLayoutSubviews {
            if(self.searchController.active) {
                  [self.brandListTableView setFrame:CGRectMake(0, 20, TLScreenWidth, self.view.height -20)];
            }else {
                  self.brandListTableView.frame =self.view.bounds;
            }
    }
    

    解决之后:


    搜索正常.png

    这个问题解决之后,新问题又出来了,那就是,每次搜索完返回之后,tableView都向上偏移20(每次累加),如图:


    tableView向上偏移20px.png
    解决办法是,让控制器不自动滚动:
          self.automaticallyAdjustsScrollViewInsets = NO;
    

    以上就是我这次项目中使用的UISearchController和遇到的坑,欢迎交流,如有什么写的不好的,请多多指教!

    相关文章

      网友评论

      • 流氓会武术:self.definesPresentationContext = YES;
        hidesNavigationBarDuringPresentation = NO;时搜索框进入编辑模式会向下偏移,这个有人解决了吗?查了好久也没有找到解决办法...
        TongRy:那就设置为YES吧
      • TimberTang:写得真好
        TongRy:@TimberTang :cold_sweat: 瞎写的,记录下
      • Yuency:相当赞, 我也遇到了很多样式方面的问题, 简直了.
        TongRy:@罪恶将知道什么是痛苦 是吧,坑多着呢
        TongRy:@罪恶将知道什么是痛苦 哈哈哈,很多坑的,我现在另一个项目都直接自己用TextField写了
      • 18ce3a64cb31:为什么我的搜索条(放大镜以及placeholder)初始化不是在中间是直接偏左了,所以点击搜索栏就没有了那个动画效果
      • 温柔vs先生:右边索引字体怎么调大一点呢?还有你那个搜索的图标怎么加上去的呢?
      • Jenny_e668:请问你有遇到,搜索框中的文字原本是居中显示,后来变成靠左边显示了吗?
        TongRy:@Jenny_e668 额……这个还没遇到过。。。
        Jenny_e668:@TongRy 系统更新到11.0之后,就一直居左了
        TongRy:@Jenny_e668 是什么情况下会居左呢
      • 凄清肆水丶:我想问一下楼主, 我点击搜索结果后跳转一个Nav页面 但是searchBar不隐藏 ,,,怎么弄
      • 不辣先生:楼主,你试过直接push一个UIsearchcontroller么?为啥直接push不行呢?报了个这样的错
        Attempting to load the view of a view controller while it is deallocating is not allowed and may result in undefined behavior (<SearchVC: 0x7f9546d02ed0>)
        TongRy:@不辣先生 没看你代码,不知道什么情况,你可以谷歌看看
        不辣先生:@TongRy 不是,我是说写个继承uisearchcontroller不能push出来只能present好像
        TongRy:@不辣先生 你是说搜索完成后,点击搜索出来的内容,然后push吗?
      • 点丶点:求助啊,我在push到下一个页面之后searchBar隐藏不掉,第二个页面我是把navigation隐藏掉了,所以导致试图遮挡.
      • ElliotYamin:不错你遇到的问题我都遇到了
        ElliotYamin:@TongRy 有个问题要问啊
        ElliotYamin:@TongRy searchController.searchBar是放在tableview.header上还是view上的
        TongRy:@ElliotYamin 哈哈,坑就是这样一步步踩下来的:smirk:

      本文标题:搜索框UISearchController的使用及所遇到的坑

      本文链接:https://www.haomeiwen.com/subject/lsifcxtx.html