【问题标题】:Adding a search bar to the top of a UITableView在 UITableView 顶部添加搜索栏
【发布时间】:2014-05-17 04:06:58
【问题描述】:

我有一个 UITableView,目前正致力于在顶部添加一个自定义搜索栏,该搜索栏由一个 UIView 和一个 UITextField 组成。作为 iOS 应用程序的标准,搜索栏应该只在表格视图滚动到顶部时可见 - 向下滚动时,它应该与其他单元格一起从屏幕上消失。

但是,我无法找到实现此效果的方法。如果我将搜索栏放在表格视图的顶部,它将覆盖其下方的单元格。如果我将它放在表格视图上方 50 像素处,用户将无法选择它,因为当用户从屏幕上松开手指时它会自动消失。

有人可以告诉我如何实现这种效果吗?

【问题讨论】:

    标签: ios objective-c uitableview search uitextfield


    【解决方案1】:

    通常您只需将UISearchBar 用作您的表格视图的tableViewHeader。如果您希望在用户进入屏幕时隐藏它(就像在大多数本机应用程序中所做的那样),您只需在 viewWillAppear 中为 tableView 设置 contentOffset
    我很确定他们实际上就是这样做的。如果你仔细想想,这就是 tableHeaderView 的意义所在。

    试试这样的:

    - (void)viewDidLoad
    {
        [super viewDidLoad];
    
        UISearchBar *searchBar = [[UISearchBar alloc] initWithFrame:CGRectMake(0., 0., 320., 44.)];
        self.tableView.tableHeaderView = searchBar;
    }
    
    - (void)viewWillAppear:(BOOL)animated
    {
        [super viewWillAppear:animated];
    
        CGPoint contentOffset = self.tableView.contentOffset;
        contentOffset.y += CGRectGetHeight(self.tableView.tableHeaderView.frame);
        self.tableView.contentOffset = contentOffset;
    }
    

    请注意,在 iOS 7 中,如果您的 viewControllerautomaticallyAdjustsScrollViewInsets 设置为 YES,则不应只将 tableViewcontentOffset 设置为 CGPointMake(0., CGRectGetHeight(self.tableView.tableHeaderView.frame)),因为它可能不会是 CGPointZeroviewWillAppear:

    【讨论】:

    • 很好,但是一旦搜索栏中没有任何内容@dariaa,您将如何触发隐藏?
    【解决方案2】:

    @dariaa 为 Swift 3 更新了答案:

    override func viewDidLoad() {
        super.viewDidLoad()
        let searchBar = UISearchBar(frame: CGRect(x: 0, y: 0, width: self.view.frame.size.width, height: 44))
        self.tableView.tableHeaderView = searchBar
    }
    override func viewWillAppear(_ animated: Bool) {
        super.viewWillAppear(animated)
        var contentOffset: CGPoint = self.tableView.contentOffset
        contentOffset.y += (self.tableView.tableHeaderView?.frame)!.height
        self.tableView.contentOffset = contentOffset
    }
    

    如果你想使用它,你可能需要将 searchBar 设置为一个属性。

    【讨论】:

      【解决方案3】:

      如果您只想在 UITableView 一直滚动到顶部时显示您的搜索,请创建一个包含 UISearchBar 的 UITableViewCell 子类。然后,在 tableView:cellForRowAtIndexPath 中,检查 indexPath 是否为 (0,0)。这是表格视图,告诉您它正在最顶部创建单元格,因此只需创建搜索栏单元格而不是默认单元格。

      代码看起来像这样:

      - (void)viewDidLoad
      {
           [self.tableView registerClass:[SearchBarCell class] forCellReuseIdentifier:@"SearchBarCell"];
      }
      
      - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
      {
          if (indexPath.row == 0 && indexPath.section == 0) {
              //this is the cell that displays the UISearchBar
              SearchBarCell *cell = [tableView dequeueReusableCellWithIdentifier:@"SearchBarCell"];
              return cell;
          }
          else {
              //create your usual table view cell normally
          }
      }
      

      可能有一种更简洁的方法来确定 indexPath 的行和部分,但我是在头脑中写下这段代码,不记得有更好的方法。

      【讨论】:

      • searchBar 不应显示在单元格中,而应显示在 tableView 标题中。
      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多