添加iOS UITableView HeaderView(不是节标题)


167

我想添加一个表头(而不是节头),例如在联系人应用程序中: 在此处输入图片说明

完全一样-表格上方图片旁边的标签。

我希望所有视图都是可滚动的,所以我不能将它们放在桌子外面。

我怎样才能做到这一点?

Answers:


245

UITableView有一个tableHeaderView属性。将其设置为您想要在那里的任何视图。

将新UIView容器用作容器,向该新容器添加文本标签和图像视图UIView,然后进行设置tableHeaderView为新视图。

例如,在中UITableViewController

-(void)viewDidLoad
{
     // ...
     UIView *headerView = [[UIView alloc] initWithFrame:CGRectMake(XXX, YYY, XXX, YYY)];
     UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(XXX, YYY, XXX, YYY)];
     [headerView addSubview:imageView];
     UILabel *labelView = [[UILabel alloc] initWithFrame:CGRectMake(XXX, YYY, XXX, YYY)];
     [headerView addSubview:labelView];
     self.tableView.tableHeaderView = headerView;
     [imageView release];
     [labelView release];
     [headerView release];
     // ...
} 

大!谢谢工作。有没有使表格单元格与内部文本一样大的属性?
阿萨夫b

为此,您需要能够计算给定字符串的单元格的高度,并将该值传递给heightForRowAtIndexPath。您可以使用NSString的方法sizeWithFont:constrainedToSize:函数来确定约束大小时文本的高度。
标记

在布局后添加它,否则它的大小将不是您想要的。而且viewDidLoad是一个好地方。
BollMose 2015年

在viewDidLoad阶段设置视图的几何形状是一种好习惯吗?
Nandish

1
好的,如果您在表格源中设置标题视图似乎可行,请确保同时设置高度:示例:public override UIView GetViewForHeader(UITableView tableView, nint section) { return headerView; } public override nfloat GetHeightForHeader(UITableView tableView, nint section) { return headerView.Frame.Height; }
panthor314

193

您可以在Interface Builder中轻松完成此操作。只需使用表创建视图,然后将另一个视图放到表上。这将成为表标题视图。将标签和图像添加到该视图。有关视图层次结构,请参见下面的图片。 在Interface Builder中查看层次结构


12
我更喜欢这个答案,因为当我可以整齐地设置代码并将其放置在IB中时为什么还要编写代码
Besi 2012年

1
非常感谢您的提示。顺便说一句,如果其他人想知道或尝试这样做,则标题中不需要滚动视图。它使用UITableView的ScrollView作为标头,因为标头从技术上讲是UITableView的一部分
Rob R.13年

2
值得一提的是它现在在StoryBoard编辑器中的工作方式:stackoverflow.com/q/7841167/926907
Dmitry Zaytsev

不要为此使用笔尖。加载时间更长。用代码编写。为了实现可重用性,请创建一个自定义类并实例化...
Charles Robertson

1
它不会让我向标题视图添加高度限制。
伊恩·沃伯顿

14

Swift中

override func viewDidLoad() {
    super.viewDidLoad()

    // We set the table view header.
    let cellTableViewHeader = tableView.dequeueReusableCellWithIdentifier(TableViewController.tableViewHeaderCustomCellIdentifier) as! UITableViewCell
    cellTableViewHeader.frame = CGRectMake(0, 0, self.tableView.bounds.width, self.heightCache[TableViewController.tableViewHeaderCustomCellIdentifier]!)
    self.tableView.tableHeaderView = cellTableViewHeader

    // We set the table view footer, just know that it will also remove extra cells from tableview.
    let cellTableViewFooter = tableView.dequeueReusableCellWithIdentifier(TableViewController.tableViewFooterCustomCellIdentifier) as! UITableViewCell
    cellTableViewFooter.frame = CGRectMake(0, 0, self.tableView.bounds.width, self.heightCache[TableViewController.tableViewFooterCustomCellIdentifier]!)
    self.tableView.tableFooterView = cellTableViewFooter
}

在iOS 7或更高版本上使用此方法将触发运行时警告:“表单元没有索引路径被重用”。为避免此错误,请参考链接
baskInEminence

11

您也可以仅在“界面”构建器中仅创建一个UIView,然后拖放ImageView和UILabel(使其看起来像所需的标题),然后使用它。

一旦UIView看起来也像您想要的方式一样,您就可以从XIB以编程方式对其进行初始化,并将其添加到UITableView中。换句话说,您不必在IB中设计ENTIRE表。只是headerView(这样,标题视图也可以在其他表中重用)

例如,对于我的表头之一,我有一个自定义UIView。该视图由名为“ CustomHeaderView”的xib文件管理,并使用我的UITableViewController子类中的以下代码将其加载到表头中:

-(UIView *) customHeaderView {
    if (!customHeaderView) {
        [[NSBundle mainBundle] loadNibNamed:@"CustomHeaderView" owner:self options:nil];
    }

    return customHeaderView;
}

- (void)viewDidLoad
{
    [super viewDidLoad];

    // Set the CustomerHeaderView as the tables header view 
    self.tableView.tableHeaderView = self.customHeaderView;
}

-36
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
    {

    UIView *headerView = [[UIView alloc] initWithFrame:CGRectMake(0,0,tableView.frame.size.width,30)];
    headerView.backgroundColor=[[UIColor redColor]colorWithAlphaComponent:0.5f];
    headerView.layer.borderColor=[UIColor blackColor].CGColor;
    headerView.layer.borderWidth=1.0f;

    UILabel *headerLabel = [[UILabel alloc] initWithFrame:CGRectMake(10, 5,100,20)];

    headerLabel.textAlignment = NSTextAlignmentRight;
    headerLabel.text = @"LeadCode ";
    //headerLabel.textColor=[UIColor whiteColor];
    headerLabel.backgroundColor = [UIColor clearColor];


    [headerView addSubview:headerLabel];

    UILabel *headerLabel1 = [[UILabel alloc] initWithFrame:CGRectMake(60, 0, headerView.frame.size.width-120.0, headerView.frame.size.height)];

    headerLabel1.textAlignment = NSTextAlignmentRight;
    headerLabel1.text = @"LeadName";
    headerLabel.textColor=[UIColor whiteColor];
    headerLabel1.backgroundColor = [UIColor clearColor];

    [headerView addSubview:headerLabel1];

    return headerView;

}

不明白你的问题吗?
2015年

2
错了 他只需要一个表头,而不是节头。这两件事非常不同。请阅读问题。
Charles Robertson
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.