粘性搜索栏和部分标题行为类似于本机联系人应用程序

时间:2013-02-07 19:36:01

标签: iphone ios uitableview uisearchbar

我想在iPhone通讯录应用中复制搜索栏的粘性行为。

Normal stage

当用户向下滚动视图时,搜索栏也会随视图一起显示

User scrolls the view down

如果用户向上滚动,则表格会相应滚动,具有以下两种行为:

(1)搜索栏仍然固定在顶部,并且
(2)后续部分标题在搜索栏下方适当停止

User scrolls up

当下一个标题标题出现时,前一个标题会在搜索栏下方消失:

User scroll up

注意:部分索引控件(右侧的a-z)也会出现在搜索栏顶部上。因此,摆弄contentInset会将部分索引控制同时推下去。

我创建了一个自定义UIViewController,添加了UITableView,将其contentInset设置为搜索栏的高度。我创建了UIView,将搜索栏添加为子视图,然后将UIView添加到UITableView。然而,如上所述,当用户滚动时,区段标题仍然保持在y位置零,而不是标题高度。此外,节标题索引控制​​位置受到不利影响。

我很感激这个问题的解决方案。

2 个答案:

答案 0 :(得分:16)

完成所有事情已经做了相当多的工作,但我必须证明可以重新创建这种行为,至少几乎。 看看我创建的这个GitHub项目:https://github.com/fabiankr/TableViewSearchBar

实际上,它甚至不复杂:
1)将搜索栏直接添加到表格视图并设置tableView的contentInset
2)在-scrollViewDidScroll:中调整搜索栏的框架

但是你需要注意一些注意事项:
1)当将表格视图滚动到顶部时,部分标题会很快出现在搜索栏上方。要解决此问题,请在滚动到顶部时设置搜索栏的zPosition 2)您的内容控制器需要是UIViewController的子类而不是UITableViewController,因为UISearchDisplayController将调光视图添加到控制器的视图中。由于表视图控制器“view是表格视图,因此在滚动表格视图时,调光视图将处于错误的位置。”

仅使用公共API无法实现的一件事是使表右侧的节索引控件与搜索栏重叠。这只是一个小问题,即使没有它,行为也非常类似于联系人应用程序中的行为。

为了实现完全相同的行为,您必须使用私有API。需要使用名为UITableView的{​​{1}}上的方法。示例项目包含以下两者的实现:1)仅公共API和2)私有API,以使段索引控件与搜索栏重叠。
提醒:当您计划将应用程序提交到App Store时,不应使用私有API!

答案 1 :(得分:0)

我实现这种行为的方法是从UITableView中分离我的浮动单元格,并使其成为UITableView的子视图,并在scrollViewDidScroll中为浮动单元格设置动画。 只是这样,UITableView向下滚动足够远以显示浮动单元格我还在桌面视图中粘贴了一个不可见的单元格,当调用scrollViewDidScroll时,该单元格被浮动单元格覆盖。

- (void)viewDidLoad {
   // add floating cell to tableview
   FloatingCell *cell = [[FloatingCell alloc] init];
   [self.tableView addSubview:cell];
   self.floatingCell = cell; 
}
// overwrite scrollViewDidScroll
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
    CGRect floatingCellFrame = floatingCell.frame;
    CGFloat floatingCellHeight = floatingCellFrame.size.height;

    // when contentOffset is is more then cellHeight scroll floating cell
    if (scrollView.contentOffset.y > floatingCellHeight) {
       floatingCellFrame.origin.y = -scrollView.contentOffset.y + floatingCellHeight; 

    // when contentOffset is less then cellHeight stick it to the top of UITableView
    else if (scrollView.contentOffset.y < floatingCellHeight)
       floatingCellFrame.origin.y = 0;

   floatingCell.frame = floatingCellFrame;
}

滚动时你可能需要添加一些角落情况条件,这样浮动单元格似乎没有跳跃但是这应该开始了。祝你好运!