当前位置: > > > Swift - 搜索条(UISearchBar)的用法

Swift - 搜索条(UISearchBar)的用法

(本文代码已升级至Swift4)

1,搜索条Options属性还可设置如下功能样式:
  • Shows Search Results Button:勾选后,搜索框右边显示一个圆形向下的按钮,单击会发送特殊事件。
  • Shows Bookmarks Button:勾选后,搜索框右边会显示一个书本的按钮,单击会发送特殊事件。
  • Shows Cancel Button:勾选后,搜索框右边会出现一个“Cancel”按钮,单击会发送特殊事件。
  • Shows Scope Bar:勾选后,会在搜索条下面出现一个分段控制器。


2,下面是一个搜索条的使用样例,功能如下:
(1)在Main.storyboard界面里拖入一个 Search Bar 和一个 Table ViewSearch Bar放到Table View的页眉位置
(2)初始化或者搜索条为空时,表格显示所有数据
(3)搜索条不为空时,表格实时过滤显示匹配的项目

3,效果图
           

4,代码如下
import UIKit

class ViewController: UIViewController,UISearchBarDelegate,
UITableViewDataSource,UITableViewDelegate {
    
    // 引用通过storyboard创建的控件
    @IBOutlet var searchBar : UISearchBar!
    @IBOutlet var tableView : UITableView!
    
    // 所有组件
    var ctrls:[String] = ["Label","Button1","Button2","Switch"]
    // 搜索匹配的结果,Table View使用这个数组作为datasource
    var ctrlsel:[String] = []
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        // 起始加载全部内容
        self.ctrlsel = self.ctrls
        //设置代理
        self.searchBar.delegate = self
        self.tableView.delegate = self
        self.tableView.dataSource = self
        // 注册TableViewCell
        self.tableView.register(UITableViewCell.self, forCellReuseIdentifier: "cell")
    }
    
    // 返回表格行数(也就是返回控件数)
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return self.ctrlsel.count
    }
    
    // 创建各单元显示内容(创建参数indexPath指定的单元)
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath)
        -> UITableViewCell {
        // 为了提供表格显示性能,已创建完成的单元需重复使用
        let identify:String = "cell"
        // 同一形式的单元格重复使用,在声明时已注册
        let cell = tableView.dequeueReusableCell(withIdentifier: identify,
                                                 for: indexPath)
        cell.accessoryType = .disclosureIndicator
        cell.textLabel?.text = self.ctrlsel[indexPath.row]
        return cell
    }
    
    // 搜索代理UISearchBarDelegate方法,每次改变搜索内容时都会调用
    func searchBar(_ searchBar: UISearchBar, textDidChange searchText: String) {
        print(searchText)
        // 没有搜索内容时显示全部组件
        if searchText == "" {
            self.ctrlsel = self.ctrls
        }
        else { // 匹配用户输入内容的前缀(不区分大小写)
            self.ctrlsel = []
            for ctrl in self.ctrls {
                if ctrl.lowercased().hasPrefix(searchText.lowercased()) {
                    self.ctrlsel.append(ctrl)
                }
            }
        }
        // 刷新Table View显示
        self.tableView.reloadData()
    }
    
    // 搜索代理UISearchBarDelegate方法,点击虚拟键盘上的Search按钮时触发
    /**func searchBarSearchButtonClicked(_ searchBar: UISearchBar) {
     searchBar.resignFirstResponder()
     }**/
    
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
}
评论8
  • 8楼
    2017-12-05 15:11
    LB

    航哥,请问一下,如果每一行中要放入多个信息(比如美团的发现页),那么案例中的“ctrls”定义存放就不一样,再有就是怎么做到这个案例这样的效果,匹配首字符显示。谢谢

    站长回复

    原理其实都一样,如果每一行数据里有多个信息,那么ctrls里存放的应该是字典或者模型对象。搜索时将输入的文字和对象里的标题或者对象其他信息比对就好了。

  • 7楼
    2017-11-24 10:58
    AlexLLL

    站长,UISearchBar的数据源只能是tableview的array吗?可以实现跟微信公众号文章一样的搜索引擎查询吗?

    站长回复

    当然不是,我只是举个例子演示下UISearchBar的用法。你甚至可以向远程服务端发送请求进行搜索。

  • 6楼
    2017-10-27 09:48
    KyleBing

    上划隐藏好像是自带功能,怎么才能让它下划时才显示出来呢? 什么思路呢?

    站长回复

    你指的是哪个上划隐藏?Search Bar不会自动上划隐藏啊。还是你评论错文章了。

  • 5楼
    2016-05-28 10:23
    小白

    谢谢航哥回复,我看过您关于索引功能的帖子,您的header数组是固定的,我的痛点是,如果有一个随时变动的数组的contact(像微信),怎么提取首字母分section列出来,我的方法特别笨就是存到二维数组,不知道您有没有好的方法,谢谢。

    站长回复

    你的这个做法没问题。要么就是APP这边遍历数据再根据首字母组成成一个二维数组。要么就是服务器那边直接传过来已经分组后的数据。

  • 4楼
    2016-05-24 12:32
    小白

    感谢站长,看了3楼的帖子,我也深有同感,真是帮助太大了,希望航哥多多更新,请航哥有机会讲讲controller的生命周期和那几个函数的区别,看了一些文章还是区分不太清什么时候该用哪个。另外楼下说到排序,想问问航哥对于微信那个联系人排序和右侧索引能不能有机会分析一下,自己总是做不出来微信的效果,排序也没什么太好的方法。万分感谢。

    站长回复

    controller的生命周期确实还没讲过,后面晚些的时候会写篇相关文章。右侧索引那个我原来有写过相关文章:Swift - 给表格UITableView添加索引功能(快速定位)

  • 3楼
    2016-05-05 16:21
    NSCoffee

    感谢站长,对于把swift作为第一个iOS学习语言的人来说,这些教程太重要了。求hangge多分享和讲解纯代码实现的例子。
    前几天遇到一个面试题要求在searchBar加个sort的功能,点击后按照cell title A-Z 进行sort,是应该加到哪里里面呢?
    代码如何实现呢
    Shows Search Results Button:
    Shows Bookmarks Button:
    Shows Scope Bar:

    站长回复

    很高兴我写的文章对你有所帮助,我会持续更新的,所以各方面的文章都会有,欢迎常来看看。

    searchBar排序那个需求我有些不太理解,是让查询结果排序显示吗,按理结果显示出来就应该排序好。再点一下排序就多余了,不管加Search Results Button,Bookmarks Button等都是不合适。

  • 2楼
    2016-02-18 11:37
    IOS初学者

    有源代码吗,能发到我邮箱让我学习一下吗?多谢!!!

    站长回复

    源码已经在文章里了啊。一般复杂的demo,我会在站内附上整个项目源码的压缩包。这个样例很简单,只有一个文件的话,就不提供项目压缩包。你本地新建个工程,把代码粘贴进去就好了。

  • 1楼
    2016-02-04 11:13
    初生、小白

    判断搜索前缀的话,还是不使用 小写转换的好吧,因为弹出键盘 默认输入首字母都是大写的,直接使用hasPrefix不是更好么?

    站长回复

    谢谢提醒,这个确实需要修改,搜索的的话还是不区分大小写更人性化些。文章已更新。