在 iOS 7 联系人应用程序中创建搜索栏

Posted 2023-03-04

【中文标题】在 iOS 7 联系人应用程序中创建搜索栏

【英文标题】：Create a search bar like in the iOS 7 Contacts app

【发布时间】：2013-09-25 09:50:13

【问题描述】：

我有一个应用程序，其中有一个UITableView，其中的部分可以通过sectionIndexTitlesForTableView: 滚动到侧面。

在UITableView 的tableHeaderView 中，我想添加一个UISearchBar，我想表现得像Apple 在ios7 中的新联系人应用程序中使用的那样。但我似乎无法让它工作。

搜索栏不是 100% 的屏幕宽度，而是在部分索引的右侧。

我的问题是：

当 tableHeaderView 的 UITableView 具有可见的部分索引时，如何将搜索栏的宽度设置为 100%？ 如何在 iOS 7 的通讯录应用中创建导航栏隐藏且搜索栏的灰色背景延伸到状态栏的过渡？

我已经尝试了几件事，包括在导航栏中添加搜索栏，以及使用UISearchBarController，但我在 Apple 网站上找不到关于如何创建它的好文档。另外，从 iOS6 到 iOS7 的过渡指南对我没有什么帮助。

这里有两张图片可以说明我的问题：

【参考方案1】：

Apple 开发应用的方式有两个主要区别，这将解决您的问题。

首先，他们的 UISearchBar 不是 tableView 的 headerView。这是表格上方的单独视图。您需要将 UITableViewController 更改为 UIViewController，它的 UITableView 位于 UISearchBar 正下方。

其次，他们的 UISearchBar 有一个关联的搜索显示控制器。假设您使用的是故事板文件，它会为您捆绑在一起 - 只需添加 UISearchBar 和搜索显示控制器。这将为您处理到状态栏下方的所有转换。

【讨论】：

您的解决方案确实突出了关键点。我按照您的方式设法找到了 tableView 顶部的搜索栏。我现在唯一的问题是..当搜索文本字段集中时，搜索栏会一直到顶部，甚至覆盖状态栏。我不知道我该如何解决？

最佳解决方案。我在想如何对 UITableViewController 做同样的事情，但事实是：“构造”UITableViewController 和复制样板代码比尝试覆盖“scrollViewDidScroll”更容易

【参考方案2】：

两件事：

1) 将tableView 的sectionIndexBackgroundColor 设置为[UIColor clearColor]。

2) 实现 'viewDidLayoutSubviews' 方法来修复 UISearchBar 的框架

- (void)viewDidLayoutSubviews 
  [super viewDidLayoutSubviews];
  CGRect barFrame = self.searchBar.frame;
  barFrame.size.width = self.view.bounds.size.width;
  self.searchBar.frame = barFrame;