如何正确设置分组表格视图的背景图片？

Question

我是一名新手iPhone开发者。

我知道有很多与我的问题相关的答案，但都没有帮助到我。

根据标题，我有一个风格为Grouped的UITableView。我想设置背景图片，但我无法正确设置它。

问题在于如图所示。

好吧，我只想在UITableView（分组）的单元格描述的区域中显示我的图像视图。

以下是我的代码：

self.tblView = [[UITableView alloc]initWithFrame:CGRectMake(0, 125, 320, 320) style:UITableViewStyleGrouped];

    UIImageView *bgTableImageView = [[UIImageView alloc]initWithFrame:CGRectMake(0,0, 320, 320)];
    bgTableImageView.image = [UIImage imageNamed:@"bgImage.png"];

    self.tblView.backgroundColor=[UIColor clearColor];
    [self.tblView setBackgroundView:bgTableImageView];

    //self.tblView.backgroundView = nil;
   // self.tblView.opaque = NO;
    //self.tblView.bounces = NO;
    //self.tblView.scrollEnabled = YES;
    self.tblView.delegate=self;
    self.tblView.dataSource=self;
    self.tblView.separatorColor = [UIColor darkGrayColor];
    self.tblView.separatorStyle = UITableViewCellSeparatorStyleSingleLine;
    [self.view addSubview:self.tblView];

其他都工作得很好，我只遇到了如何设置UITableViewStyleGrouped的背景图片的问题。

- user2289379

Answer 1

试试这个：

UIImageView *av = [[UIImageView alloc] initWithFrame:CGRectMake(20, 20, 277, 58)];
av.backgroundColor = [UIColor clearColor];
av.opaque = NO;
av.image = [UIImage imageNamed:@"categorytab1.png"];
cell.backgroundView = av;

- sai

---

OP不想设置单元格的背景，但它想要设置样式为分组的TableView的背景。你的代码为每行的每个单元格设置了ImageView。 - iPatel

我不想将UIImageView设置为单元格的背景，而是想将其设置为UITableView的背景。 - user2289379

但是，您在添加图像中说您只想在分组表视图的单元格上显示图像视图。而在上面的评论中，您又说您想为TableView设置背景？先澄清混淆。 - viral

Answer 2

首先，让我们了解一下表格的工作原理：

1. UITableView 有一个背景。这是你在单元格后面看到的。
2. 每个单元格都有三个特殊的视图：contentView、backgroundView 和 selectedBackgroundView。
3. backgroundView 在单元格内容下方显示，当选中单元格时，会使用 selectedBackgroundView 代替。
4. 通常所有的内容都应该放在 contentsView 中。将背景与内容分离使得表格能够正确地动画显示未选中/选中的转换。当单元格进入编辑模式时，这一点也很重要——内容会缩小/移动，编辑控件（如删除按钮或单元格选择）可以独立于内容显示。
5. 单元格还直接包含分隔线视图（通常是底部单元格的高度为1或2像素的视图，具体取决于 separatorStyle）。这就是为什么单元格总是比其 contentsView 高至少1像素。

其次，让我们了解一下分组表格的工作原理。

1. 表格有一个特殊的默认背景。您可以使用 backgroundView 和 backgroundColor 来删除或更改它。
2. 分组表格视图中的单元格具有较小的 contentView。单元格仍然与整个表格具有相同的宽度，但是 contentView 在左侧和右侧有偏移量（在 iPhone 上大约为 10 点）。
3. backgroundView 被修改，并包括一个绘制边框的层，根据单元格位置进行不同的绘制（对于第一个、最后一个和中间单元格不同）。边框的颜色由表格的 separatorColor 指定。

你可以在代码中修改所有内容！

最简单的方法之一是将 separatorColor 设置为 [UIColor clearColor]。这将删除单元格分隔线，但您可以添加自己的分隔线，例如：

cell = ...
UIView* separator = [[UIView alloc] init];
separator.backgroundColor = ...
separator.frame = CGRectMake(0.0f, table.bounds.size.width, table.rowHeight - 1.0f, 1.0f);
separator.autoresizingMask = (UIViewAutoresizingMaskFlexibleTopMargin | UIViewAutoresizingMaskFlexibleWidth);
[cell addSubview:separator]; //note we are adding it directly to the cell, not to contentsView

除了使用单色视图之外，您还可以使用图像（UIImageView）作为分隔符。

另一种方法是将每个单元格的 backgroundView 设置为 nil。

实际上，您可以完全忽略 contentsView 并直接将所有内容添加到单元格中。然后，您可以自定义以下单元格方法以在其状态更改时更新单元格。

- (void)setSelected:(BOOL)selected animated:(BOOL)animated {
    //update the cell text colors, backgrounds etc for the selected/not selected state
    //you don't have to call super
    // (the default implementation changes between backgroundView and selectedBackgroundView)
}

- (void)setHighlighted:(BOOL)highlited animated:(BOOL)animated {
    //update the cell text colors, backgrounds etc for the selected/not highlighted state
    //you don't have to call super
    // (the default implementation changes between backgroundView and selectedBackgroundView)
    //by giving empty implementation, you will block highlighting of cells
}

- (void)setEditing:(BOOL)highlited animated:(BOOL)animated {
  //you can use this method to add custom editing controls
}

- (void)willTransitionToState:(UITableViewCellStateMask)state {
  //use this method to change the layout of your contents
  //when the cells goes into one of the editing states
}

- (void)layoutSubviews {
  //update the frames of cell contents to match the new cell size
  //note that the cell doesn't have the correct size until it is added to the table,
  //this method is called when the cell already has the final size

  //you can also use this method to change the size/position of the `contentsView`
}

编辑： 为了解决你的具体问题，最好的解决方案可能是：

1. 从表格中删除默认的backgroundView，并补充自己的背景（例如透明颜色、白色、从图案创建的颜色或一个UIImageView到backgroundView）。
2. 从每个单元格中删除默认的backgroundView，并用UIImageView替换它。您需要三个特殊的图像，用于第一个、最后一个和中间的单元格。

- Sulthan

Answer 3

如果您想制作自定义单元格UI，则可以尝试使用以下方法：

 _tblNews.backgroundColor = [UIColor clearColor];
        _tblNews.backgroundView = nil;
        _tblNews.separatorColor = [UIColor clearColor];
        _tblNews.separatorStyle = UITableViewCellSeparatorStyleNone;

根据您的要求创建自己的单元格nib，然后在数据源方法中加载该单元格。

加载xib的方法如下：

+ (id)loadNibNamed:(NSString *)NibName {
    NSObject *cl = nil;
    if (NSClassFromString(NibName) != nil) {
        NSArray *arr = [[NSBundle mainBundle] loadNibNamed:NibName owner:self options:nil];
        for (id cls in arr) {
            if([cls isKindOfClass:NSClassFromString(NibName)])
            {
                cl = cls;
                break;
            }
        }
    }
    return cl;
}

确保在XIB文件中为单元格设置了可重用的标识符。 使用它，您可以轻松自定义单元格布局。

- chirag

Answer 4

使用以下代码，而不是使用UIImageView。

self.tblView.backgroundView.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"YourImage.png"]];

否则，

self.tblView.backgroundView.inputView.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"tblbg.png"]];

第二种选择（当您不依赖于UITableView样式时，此选项很有帮助）

1）更改您的UITableView样式，style:UITableViewStylePlain。
2）添加#import <QuartzCore/QuartzCore.h>框架
3）更改UITableView的框架，例如，CGRectMake(10, "asYouNeed", 300, "asYouNeed")
4）为您的UITableView提供圆角半径

self.tblView.layer.cornerRadius = 10; // set Radius as you need

将UIImageView设置为UITableView的BackGroundView。（遵循您在此问题中放置的代码）

以上步骤创建了带有圆角的UITableView。请注意，如果您依赖于UITableView样式，则此代码不适用于您，如果TableView Style:Gropped对您很重要，则此选项无法帮助您。

谢谢 :)

- iPatel

Answer 5

将UITableView的背景视图设置为 nil 即可使其透明。

[tableView setBackgroundColor:[UIColor colorWithPatternImage:[UIImage imageNamed:@"backgroundImage.png"]]];
tableView.opaque = NO;
tableView.backgroundView = nil;

希望这能对您有所帮助。

- Nishant Tyagi

Answer 6

您想要这样吗

以下是代码:-

设置UITableView的背景视图，可以在任何地方设置。我已经在viewDidload中完成了它。

[_tblView setBackgroundView:[[UIImageView alloc] initWithImage:[UIImage imageNamed:@"url.jpg"]]];

在cellForRowAtIndexPath中将tableViewCellBackground颜色设置为透明。

    static NSString *cellIdentifier=@"cellIdentifier";
UITableViewCell *cell=[tableView dequeueReusableCellWithIdentifier:cellIdentifier];

if (cell ==nil) {
    cell=[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellIdentifier];
}
cell.backgroundColor=[UIColor clearColor];
cell.textLabel.text=@"goup styled";
return cell;

- Prince Kumar Sharma

Answer 7

请尝试此代码，

UIView *backgroundView = [[UIView alloc] init];
[backgroundView setBackgroundColor:[UIColor colorWithPatternImage:[UIImage imageNamed:@"imageName.png"]]];

在tableview中，请设置此属性。

UITableView *tableView = [[UITableView alloc] init];
[tableView setBackgroundView:backgroundView];

希望这对您有用。

- Ashok