ios 更改 UITableView 部分标题的默认滚动行为

Change Default Scrolling Behavior of UITableView Section Header

提问by davidjhinson

I have a UITableView with two sections. It is a simple table view. I am using viewForHeaderInSection to create custom views for these headers. So far, so good.

我有一个包含两个部分的 UITableView。这是一个简单的表格视图。我正在使用 viewForHeaderInSection 为这些标题创建自定义视图。到现在为止还挺好。

The default scrolling behavior is that when a section is encountered, the section header stays anchored below the Nav bar, until the next section scrolls into view.

默认的滚动行为是，当遇到某个部分时，该部分标题保持锚定在导航栏下方，直到下一部分滚动到视图中。

My question is this: can I change the default behavior so that the section headers do NOT stay anchored at the top, but rather, scroll under the nav bar with the rest of the section rows?

我的问题是：我可以更改默认行为，以便节标题不会固定在顶部，而是在导航栏下方与节行的其余部分一起滚动吗？

Am I missing something obvious?

我错过了一些明显的东西吗？

Thanks.

谢谢。

回答by awulf

The way I solved this problem is to adjust the contentOffsetaccording to the contentInsetin the UITableViewControllerDelegate(extends UIScrollViewDelegate) like this:

我解决这个问题的方法是contentOffset根据(extends )contentInset中的UITableViewControllerDelegate(extends UIScrollViewDelegate)进行调整，如下所示：

- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
       CGFloat sectionHeaderHeight = 40;
   if (scrollView.contentOffset.y<=sectionHeaderHeight&&scrollView.contentOffset.y>=0) {
       scrollView.contentInset = UIEdgeInsetsMake(-scrollView.contentOffset.y, 0, 0, 0);
   } else if (scrollView.contentOffset.y>=sectionHeaderHeight) {
       scrollView.contentInset = UIEdgeInsetsMake(-sectionHeaderHeight, 0, 0, 0);
   }
}

Only problem here is that it looses a little bit of bounce when scrolling back to the top.

这里唯一的问题是它在滚动回顶部时会失去一点弹跳。

---

---

{NOTE: The "40" should be the exact height of YOUR section 0 header. If you use a number that is bigger than your section 0 header height, you'll see that finger-feel is affected (try like "1000" and you'll see the bounce behaviour is sort of weird at the top). if the number matches your section 0 header height, finger feel seems to be either perfect or near-perfect.}

{注意：“40”应该是您的第 0 部分标题的确切高度。如果您使用大于第 0 部分标题高度的数字，您会看到手指感觉受到影响（尝试使用“1000”，您会看到顶部的弹跳行为有点奇怪）。如果数字与您的第 0 部分标题高度匹配，则手指感觉似乎是完美的或接近完美的。}

回答by voidStern

You can also add a section with zero rows at the top and simply use the footer of the previous section as a header for the next.

您还可以在顶部添加零行的部分，然后简单地使用上一部分的页脚作为下一部分的页眉。

回答by Colin Barrett

Were it me doing this, I'd take advantage of the fact that UITableViews in the Plain style have the sticky headers and ones in the Grouped style do not. I'd probably at least try using a custom table cell to mimic the appearance of Plain cells in a Grouped table.

如果是我这样做，我会利用这样一个事实，即普通样式中的 UITableViews 具有粘性标题，而分组样式中的则没有。我可能至少会尝试使用自定义表格单元格来模拟分组表格中普通单元格的外观。

I haven't actually tried this so it may not work, but that's what I'd suggest doing.

我还没有真正尝试过这个，所以它可能不起作用，但这就是我建议做的。

回答by LocoMike

I know it comes late, but I have found the definitive solution!

我知道它来晚了，但我找到了最终的解决方案！

What you want to do is if you have 10 sections, let the dataSource return 20. Use even numbers for section headers, and odd numbers for section content. something like this

您想要做的是，如果您有 10 个部分，则让 dataSource 返回 20。部分标题使用偶数，部分内容使用奇数。像这样的东西

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    if (section%2 == 0) {
        return 0;
    }else {
        return 5;
    }
}

-(NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section {
    if (section%2 == 0) {
        return [NSString stringWithFormat:@"%i", section+1];
    }else {
        return nil;
    }
}

Voilá! :D

瞧！:D

回答by Neil Gall

There are several things that need done to solve this problem in a non-hacky manner:

有几件事需要以一种非hacky的方式解决这个问题：

1. Set the table view style to UITableViewStyleGrouped
2. Set the table view backgroundColorto [UIColor clearColor]
3. Set the backgroundViewon each table view cell to an empty view with backgroundColor [UIColor clearColor]
4. If necessary, set the table view rowHeightappropriately, or override tableView:heightForRowAtIndexPath:if individual rows have different heights.

1. 将表格视图样式设置为 UITableViewStyleGrouped
2. 将表视图设置backgroundColor为[UIColor clearColor]
3. 将backgroundView每个表视图单元格设置为空视图backgroundColor [UIColor clearColor]
4. 如有必要，rowHeight适当地设置表格视图，或者tableView:heightForRowAtIndexPath:如果个别行具有不同的高度，则覆盖。

回答by Doc

Originally posted Here, a quick solution using the IB. The same can be done programmatically though quite simply.

最初发布在这里，使用 IB 的快速解决方案。虽然很简单，但可以通过编程方式完成相同的操作。

A probably easier way to achieve this (using IB):

Drag a UIView onto your TableView to make it its header view.

1. Set that header view height to 100px
2. Set the tableview contentInset (top) to -100
3. Section headers will now scroll just like any regular cell.

实现此目标的一种可能更简单的方法（使用 IB）：

将 UIView 拖到您的 TableView 上以使其成为标题视图。

1. 将该标题视图高度设置为 100px
2. 将 tableview contentInset (top) 设置为 -100
3. 部分标题现在将像任何常规单元格一样滚动。

Some people commented saying that this solution hides the first header, however I have not noticed any such issue. It worked perfectly for me and was by far the simplest solution that I've seen so far.

有些人评论说这个解决方案隐藏了第一个标题，但是我没有注意到任何这样的问题。它对我来说非常有效，并且是迄今为止我见过的最简单的解决方案。

回答by Thomas Kekeisen

I was not happy with the solutions described here so far, so I tried to combine them. The result is the following code, inspired by @awulf and @cescofry. It works for me because I have no real table view header. If you already have a table view header, you may have to adjust the height.

到目前为止，我对这里描述的解决方案并不满意，所以我尝试将它们结合起来。结果是以下代码，灵感来自@awulf 和@cescofry。它对我有用，因为我没有真正的表格视图标题。如果您已经有一个表格视图标题，则可能需要调整高度。

// Set the edge inset
self.tableView.contentInset = UIEdgeInsetsMake(-23.0f, 0, 0, 0);

// Add a transparent UIView with the height of the section header (ARC enabled)
[self.tableView setTableHeaderView:[[UIView alloc] initWithFrame:CGRectMake(0.0f, 0.0f, 100.0f, 23.0f)]];

回答by Arthur S

Just change TableView Style:

只需更改 TableView 样式：

self.tableview = [[UITableView alloc] initwithFrame:frame style:UITableViewStyleGrouped];

UITableViewStyle Documentation:

UITableViewStyle 文档：

UITableViewStylePlain- A plain table view. Any section headers or footers are displayed as inline separators and float when the table view is scrolled.

UITableViewStyleGrouped- A table view whose sections present distinct groups of rows. The section headers and footers do not float.

UITableViewStylePlain - 一个普通的表格视图。任何部分的页眉或页脚都显示为行内分隔符，并在滚动表格视图时浮动。

UITableViewStyleGrouped- 一个表视图，其部分呈现不同的行组。节页眉和页脚不浮动。

回答by Arjun Shukla

Select Grouped Table View style from your tableView's Attribute Inspector in storyboard.

从故事板中 tableView 的 Attribute Inspector 中选择 Grouped Table View 样式。

回答by cescofry

Set the headerView of the table with a transparent view with the same height of the header in section view. Also initi the tableview with a y frame at -height.

将表格的headerView 设置为与剖面视图中标题高度相同的透明视图。还在 -height 处使用 y 框架初始化 tableview。

self.tableview = [[UITableView alloc] initWithFrame:CGRectMake(0, - height, 300, 400)];

UIView *headerView = [[[UIView alloc] initWithFrame:CGRectMake(0, 0, width, height)] autorelease];
[self.tableView setTableHeaderView:headerView];