添加 iOS UITableView HeaderView（不是部分标题）

Adding iOS UITableView HeaderView (not section header)

提问by Assaf b

I want to add a table header (not section headers) like in the contacts app for example:

我想在联系人应用程序中添加一个表格标题（不是节标题），例如：

exactly like that - a label beside an image above of the table.

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

I want the all view be scrollable so I can't place those outside of the table.

我希望所有视图都是可滚动的，所以我不能将它们放在表格之外。

How can I do that?

我怎样才能做到这一点？

回答by peterjb

UITableViewhas a tableHeaderViewproperty. Set that to whatever view you want up there.

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

Use a new UIViewas a container, add a text label and an image view to that new UIView, then set tableHeaderViewto the new view.

使用 newUIView作为容器，向该 new 添加文本标签和图像视图UIView，然后设置tableHeaderView为新视图。

For example, in a UITableViewController:

例如，在一个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];
     // ...
} 

回答by Kirby Todd

You can do it pretty easy in Interface Builder. Just create a view with a table and drop another view onto the table. This will become the table header view. Add your labels and image to that view. See the pic below for the view hierarchy.

您可以在 Interface Builder 中轻松完成。只需创建一个带有表的视图并将另一个视图拖放到表上。这将成为表头视图。将您的标签和图像添加到该视图。有关视图层次结构，请参见下图。

回答by King-Wizard

In 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
}

回答by iansari

You can also simply create ONLY a UIView in Interface builder and drag & drop the ImageView and UILabel (to make it look like your desired header) and then use that.

您也可以简单地在界面构建器中仅创建一个 UIView 并拖放 ImageView 和 UILabel（使其看起来像您想要的标题），然后使用它。

Once your UIView looks like the way you want it too, you can programmatically initialize it from the XIB and add to your UITableView. In other words, you dont have to design the ENTIRE table in IB. Just the headerView (this way the header view can be reused in other tables as well)

一旦你的 UIView 看起来也像你想要的那样，你可以从 XIB 以编程方式初始化它并添加到你的 UITableView。换句话说，您不必在 IB 中设计整个表。只是 headerView （这样标题视图也可以在其他表中重用）

For example I have a custom UIView for one of my table headers. The view is managed by a xib file called "CustomHeaderView" and it is loaded into the table header using the following code in my UITableViewController subclass:

例如，我的表标题之一有一个自定义 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;
}

回答by Priyam

- (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;

}