iOS搜索栏的自定义使用方案(UI)

SearchController.searchBar的三种UI布局应用案例：
应用在导航栏2级以上层级位置(非首页)

UI-1: 放置在UITableView的tableHeaderView视图的位置

---

优点： 搜索框可以跟随tableView视图一起进行垂直方向滑动；

代码：

tableView.tableHeaderView = _searchController.searchBar;

如图：

tableHeaderView上沿.png

• 与列表中间有一条分隔线；
• 在列表视图置顶时，搜索框会暂时隐藏；

UI-2:放置在导航栏，且在返回按钮下方

---

优点：无分隔线（UI-1升级版，可设置搜索框滚动时不隐藏）；
缺点：需要iOS11以上版本才支持；

代码：

if (@available(iOS 11.0, *)) {
    self.navigationItem.searchController = _searchController;
    // 如下设置，可一直显示搜索框
    self.navigationItem.hidesSearchBarWhenScrolling = false;
}

如图：

tableHeaderView升级方案-iOS11+.png

何必曰(笔者)：第一种方案兼容更多版本，但第二种方案拥有很多可设置的属性，用法上设置自定义时更灵活些

UI-3:放置在导航栏的标题位置

---

优点：位置居中 ；

代码：

self.navigationItem.titleView = _searchController.searchBar;

如图：

titleView位置.png

何必说一句

其实UI布局以上说的，仅仅是简单应用，更多的还是需要去因需而创：直接自定义导航栏(更灵活);
使用系统原生的控件，可以使用每次WWDC带来的一点🤏新意(虽然不多)。这“不够新意”或许会让我们去怀念乔歩斯-以及OneMoreThing的特场秀~