分组UITableView中第一个和第二个单元格之间的1个像素间隙 [英] 1 pixel gap between first and second cell in grouped UITableView
问题描述
这似乎是一个简单的问题，但我找到了一个解决方案的砖墙，我希望这里有人可以提供帮助......
This seems like an easy problem, but I've hit a brick wall finding a solution and I'm hoping someone on here can help...
I我正在使用UITableViewStyleGrouped创建一个UITableView，我看到我的表视图的每个部分的第一行和第二行之间有一条小的（1像素）白线（见图）
I am making a UITableView using UITableViewStyleGrouped, and I am seeing a small (1 pixel) white line between the first and second row of every section of my table view (see image)
看来这个原因对于这一行，每个部分中的第一个单元格比其他单元格高1个像素。当我将每组的初始单元设置为29像素高（其他组为30）时，间隙消失并且一切都很好。
It seems that the reason for this line is that the first cell in each section is 1 pixel taller than the others. When I set the initial cell of each group to be 29 pixels high (the others are 30) the gap disappears and all is well.
虽然这是成功的解决方法，但我宁愿知道发生这种情况的原因，所以我可以避免使用凌乱的黑客。
While this is workaround is successful, I'd rather know the reason for this occurring so I can avoid using a messy hack.
仅供参考：
- 我已经确定这不是我使用的背景图片的问题 - 它们是所有30px高，我用中间图像替换了顶部图像，结果相同。
- 我通过设置separatorStyle = UITableViewCellSeparatorStyleNone $ b删除了单元格之间的所有边框$ b
- UITableViewStylePlain不会发生此效果
- I have made sure this is not an issue with the background images I have by using - they are all 30px high, and I have replaced the top image with a middle image with the same result.
- I have removed all borders between the cells by setting separatorStyle = UITableViewCellSeparatorStyleNone
- This effect doesn't happen on UITableViewStylePlain
非常感谢任何帮助。
谢谢
表格设置代码：
myTable = [[UITableView alloc] initWithFrame:CGRectMake(TABLE_SHIFT_OFFSET,
DATE_SLIDER_HEIGHT - DATE_SLIDER_SHADOW_HEIGHT,
326,
self.view.frame.size.height - DATE_SLIDER_HEIGHT + DATE_SLIDER_SHADOW_HEIGHT) style:UITableViewStyleGrouped];
myTable.backgroundColor = [UIColor clearColor];
myTable.backgroundView = nil;
myTable.separatorStyle = UITableViewCellSeparatorStyleNone;
[self.view addSubview:myTable];
myTable.dataSource = self;
myTable.delegate = self;
单元格设置代码：
- (float)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
// This is a hack to make sure that a white line doesnt appear between the
// first and second rows in the table, which happens for reasons I dont understand
if (indexPath.row == 0) {
return 29;
}
return 30;
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
MyTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"satCell"];
if (!cell)
{
cell = [[MyTableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"satCell"];
}
cell.backgroundView = nil;
cell.backgroundView = [[UIView alloc] initWithFrame:CGRectZero];
cell.backgroundColor = [UIColor whiteColor];
int numberOfRowsInThisSection = [self tableView:tableView numberOfRowsInSection:indexPath.section];
if (numberOfRowsInThisSection == 1)
{
cell.backingImage = self.singleWhite;
}
else if (indexPath.row == 0)
{
cell.backingImage = self.topWhite;
}
else if (indexPath.row % 2 == 0)
{
// Even row
if (indexPath.row == numberOfRowsInThisSection - 1)
{
// Last row (even)
cell.backingImage = self.botWhite;
}
else
{
// Normal row (even)
cell.backingImage = self.midWhite;
}
}
else if (indexPath.row % 2 == 1)
{
// Odd row
if (indexPath.row == numberOfRowsInThisSection - 1)
{
// Last row (even)
cell.backingImage = self.botDark;
}
else
{
// Normal row (odd)
cell.backingImage = self.midDark;
}
}
// Setup cell text [REMOVED FOR BREVITY]
return cell;
}
在MyTableViewCell中设置支持图像的代码：
The code for setting the backing Image within MyTableViewCell:
- (void)setBackingImage:(UIImage *)backingImage
{
if (self.backingImage != backingImage)
{
_backingImage = nil;
_backingImage = backingImage;
self.backingView.image = backingImage;
}
}
使用以下代码设置self.backingView：
self.backingView is set up using the following code:
[[UIImageView alloc] initWithFrame:CGRectMake(7, 0, 307, 30)];
推荐答案
这是一个已知问题，只发生在你隐藏了分组tableView的分隔符，在另一个中发生了完全相同的事情堆栈溢出问题。
This is kind of a known issue, only happens when you hide the separators of a grouped tableView, the exact same thing happened in this other stack overflow question.
简单地说，顶部和底部单元格使用一个额外的点，但分隔符隐藏它，所以解决方案是：
Simply put, the top and lower cells use one extra point, but the separator hides it, so the solution is:
- 减去额外的间距（正如你已经做过的那样）
- 使背景成为重复图案或可伸缩图像（不是试图提升自己，而是我在上一个链接线程上给出的答案也解释了如何进行可伸缩图像。）
- 不要隐藏分隔符，但匹配是颜色的细胞的背景让它看起来像是隐藏的。
- Substract the additional spacing (as you already did)
- Make the background a repeating pattern or an stretchable image (Not trying to promote myself, but the answer I gave on the previous linked thread also explains how to do stretchable images).
- Don't hide the separator, but match is color with the background of the cells so it looks like its hidden.
选项2似乎是最干净，并增加了支持tableView单元格的可变高度的好处。
Option 2 seems to be the "cleanest" and adds the benefit of supporting variable heights of tableView cells.
为什么它有额外的点？只有Apple知道。
And why does it have that extra point? Only Apple knows.
这篇关于分组UITableView中第一个和第二个单元格之间的1个像素间隙的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
