54

Apple 的 iPhone 应用程序(例如 Music 和 Contants)使用 UITableView 中的搜索栏。当您向下滚动以使搜索栏向下移动时,滚动视图内容上方的空白区域具有浅灰色背景色(参见屏幕截图)。

显示浅灰色背景的联系人应用程序的屏幕截图

(请注意,搜索栏的顶部有一条稍暗的边缘线。默认的 UISearchBar 不存在这一点,但子类化应该会解决这个问题。)

我尝试设置 UITableView 的背景颜色,但这也会影响行。有谁知道如何达到这个效果?我将不得不重写实现 drawRect: 还是有内置的方式?

4

16 回答 16

39

设置透明胶片对性能不利。您想要的是搜索栏上方的灰色区域,但它应该在列表末尾之外仍然是白色的。

您可以向UITableView内容上方添加一个子视图。

CGRect frame = self.list.bounds;
frame.origin.y = -frame.size.height;
UIView* grayView = [[UIView alloc] initWithFrame:frame];
grayView.backgroundColor = [UIColor grayColor];
[self.listView addSubview:grayView];
[grayView release];

如果你愿意,你可以在视图中添加更多花哨的东西,也许是淡入淡出,或者没有子类化的分隔线UISearchBar

于 2009-08-29T10:48:17.830 回答
30

这是我最喜欢的技巧之一。

UIView *topview = [[[UIView alloc] initWithFrame:CGRectMake(0,-480,320,480)] autorelease];
topview.backgroundColor = [UIColor colorWithRed:226.0/255.0 green:231.0/255.0 blue:238.0/255.0 alpha:1];

[self.tableView addSubview:topview];

基本上,您正在创建一个屏幕大小的大视图并将其放置在内容区域的“上方”。您将永远无法向上滚动过去。

并且不要担心 320x480 像素的 UIView 对内存的影响,它不会消耗任何显着的内存,因为 CALayer 没有任何有意义的内容。

注意:当“接受”的答案如此简单时,为什么这个答案是相关的?为什么不直接设置backgroundView桌面视图?这是因为,在原始问题中显示的联系人应用程序的情况下,表格视图“上方”的区域具有与表格视图“下方”区域(白色)不同的背景颜色(浅蓝色)。这种技术允许您在表格视图的上方和下方拥有两种不同的颜色,这是简单的背景无法实现的。

编辑 1/2018:正如 Tom 在评论中指出的那样,这个答案已经很老了,并假设所有 iOS 设备都具有相同的屏幕尺寸(看起来很疯狂,但在 2009 年我回答这个问题时就是这种情况)。我在这里介绍的概念仍然有效,但是您应该使用UIScreen.main.bounds来确定实际的屏幕尺寸,或者您可以进入一些花哨的自动布局的东西(欢迎提出建议)。我不建议tableView.bounds在另一个答案中使用 as ,因为通常viewDidLoad视图的大小不一定是控制器调整它们大小后它们将变为的大小。有时它们以 0x0 开头!

于 2009-09-28T01:28:55.963 回答
24

扩展HusseinB 的建议

斯威夫特 3

let bgView = UIView()
bgView.backgroundColor = UIColor.white
self.tableView.backgroundView = bgView

目标 C

UIView *bgView = [UIView new];
bgView.backgroundColor = [UIColor whiteColor];
[self.tableView setBackgroundView:bgView];
于 2015-07-22T11:59:50.363 回答
23

从 iOS 7 开始,您可以通过更改 tableview 背景视图来解决这个问题。

[self.tableView setBackgroundView:view];

使视图的背景颜色与父视图颜色相同。

于 2014-04-30T10:33:55.560 回答
9

此代码适用于Swift fot UITableView

var frame = self.tableView.bounds
frame.origin.y = -frame.size.height
frame.size.height = frame.size.height
frame.size.width = UIScreen.mainScreen().bounds.size.width
let blueView = UIView(frame: frame)
blueView.backgroundColor = UIColor.headerBlueColor()
self.tableView.addSubview(blueView)
于 2016-07-05T17:26:45.450 回答
7

Swift中(在 iOS9 上测试)

    let backView = UIView(frame: self.tableView.bounds)
    backView.backgroundColor = UIColor.clearColor() // or whatever color
    self.tableView.backgroundView = backView
于 2015-10-02T14:36:34.077 回答
5

最简单的解决方案

在表格视图的弹跳区域的底部和顶部创建不同颜色的最简单方法是设置表格视图的键tableHeaderBackgroundColor。这样做可以设置顶部颜色。我不确定,但也许页脚还有另一个键,看看。如果您没有找到任何东西,您只需将表格视图的背景设置为您想要在底部显示的颜色。上面你可以看到一个示例代码:

self.table.setValue(UIColor.blue , forKey: "tableHeaderBackgroundColor")

希望对您有所帮助。如果是,请让其他人知道这种简单的方法放弃答案:)

于 2017-04-10T11:33:58.740 回答
4

我只找到了一种方法来做到这一点。您必须将 UITableView 的 backgroundColor 设置为透明,将单元格的 contentView 的 backgroundColor 设置为您希望实际单元格的颜色,然后至关重要的是,您必须让浅灰色出现在 UITableView 后面。最后一步,您可以通过设置 UIWindow 的 backgroundColour 或任何包含的内容或您的 tableViewController 来完成。

所以,假设你有一个从 UITableViewController 派生的视图控制器,在 -(void)viewDidLoad 方法中插入这些行:-

// sets the background of the table to be transparent
self.tableView.backgroundColor = [UIColor colorWithWhite:1.0 alpha:0.0];
// assuming we are inside a navigation or tab controller, set the background
self.parentViewController.view.backgroundColor = [UIColor lightGrayColor];

然后在 tableView:cellForRowAtIndexPath: 创建新单元格的部分内,添加:-

// set an opaque background for the cells 
cell.contentView.backgroundColor = [UIColor whiteColor];
于 2009-08-04T22:58:07.743 回答
4

我自己也遇到了这个问题并找到了解决方案。

原因

我使用Spark Inspector检查表格视图的布局——这确实很有帮助。

问题是,在这种情况下 UITableView 有 3 个子视图:

  1. UITableViewWrapperView
  2. UIView-backgroundColor设置为浅灰色
  3. UISearchBar

当您向下滑动表格视图内容时,第二个子视图高度会动态增加以填充框架原点UITableViewWrapperViewUITableView框架原点之间的空间。

解决方案

设置backgroundColororbackgroundView属性不会影响第二个子视图。您需要做的是找到第二个视图并更改其颜色,如下所示:

if (_tableView.subviews.count > 1) {
    _tableView.subviews[1].backgroundColor = THE_TARGET_COLOR;
}

在我的情况下,我需要所有视图都是白色的,所以我使用了以下内容,这不太容易UITableView受到 Apple 未来视图层次结构的更改:

for (UIView *subview in _tableView.subviews) {
    subview.backgroundColor = [UIColor whiteColor];
}
于 2014-03-27T09:45:04.410 回答
3

我会给你最好的方法来做到这一点。
首先在界面生成器中将表格视图的背景颜色设置为您想要的颜色。
然后像这样响应 UITableView 委托tableView:willDisplayCell:ForIndexPath:方法

- (void)tableView:(UITableView*)tableView willDisplayCell:(UITableViewCelll*)cell forIndexPath:(NSINdexPath*)indexPath
{
     [cell setBackgroundColor:[UIColor whiteColor]];
}


另一种方法是:
ViewDidLoad方法中(或您喜欢的任何地方)将tableView背景颜色设置为清除颜色,如下所示:

self.tableView.backgroundColor = [UIColor clearColor];

然后将superview颜色设置为白色

self.tableView.superview.backgroundColor = [UIColor whiteColor];
于 2013-04-17T11:04:45.960 回答
1

我认为您不想覆盖drawRect。您所看到的最有可能是另一个视图或窗口的背景颜色,它位于表格视图的“后面”(即,它的超级视图)。Apple 的 UI 小部件中通常有相当复杂的 UIView 层。探索 GDB 中的视图层次结构,查看 [myView superview] 然后 [someSuperView subviews] 并尝试在调试器中操作它们的 BG 颜色,看看你是否能找到它。但是,如果您以这种方式实施修复,请注意它可能与未来不兼容。

您也可以尝试设置 Interface Builder 中 tableview 后面的视图之一(或窗口本身)的 BG 颜色。

于 2009-07-23T00:35:39.440 回答
0

如果您使用的是 tableviewcell,则可以将视图背景设置为不透明的白色。然后使用

self.tableView.backgroundColor = [UIColor grayColor];

在视图中确实加载了方法。

于 2009-07-31T16:12:17.547 回答
0

我确定那是 [UITableView backgroundColor]。您影响了行,因为行具有 backgroundColor == 清晰(或半透明)。所以,如果你让行不透明,一切都会正常工作。这将是解决方案。

于 2009-07-31T16:18:52.417 回答
0

我遵循 Peylow 为 UITableView 概述的提示,只需添加一个子视图。我对代码的唯一更改是获取更接近 Apple 应用程序中使用的颜色的颜色,此外,通过将帧原点 y 坐标减少一个像素,我使它更接近 Apple 在 UISearchbar 上方有一条线的外观:

frame.origin.y = -frame.size.height - 1
于 2010-01-22T17:02:55.557 回答
0

对于想知道如何对底部弹跳区域执行相同操作的任何人:

首先将具有所需背景颜色的子视图添加到表视图的背景视图中:

self.bottomView = [[UIView alloc] initWithFrame:CGRectOffset(self.tableView.frame, 0, self.tableView.frame.size.height)];
self.bottomView.backgroundColor = whateverColorYouLike;

[self.tableView.backgroundView addSubview:self.bottomView];

然后在您的表视图的委托中:

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    CGRect frame = self.bottomView.frame;
    frame.origin.y = self.tableView.contentSize.height - self.tableView.contentOffset.y;
    self.bottomView.frame = frame;
}
于 2013-07-13T14:03:37.697 回答
0

在我的情况下,解决方案是为表格创建一个标题视图并分配一种颜色,它解决了我的应用程序在黑暗模式下反弹区域的黑色背景。我对它的 tableFooterView 做了同样的事情。

 table.tableHeaderView = UIView()
 table.tableHeaderView!.backgroundColor = UIColor.white
    
于 2020-07-21T20:14:38.233 回答