在UITableView中自定义标头

我正在尝试在UITableView中自定义标题。 我无法在故事板中找到它，所以我开始添加UIView和UILabel。

这是我的代码：

func tableView(tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? { let headerView = UIView(frame: CGRectMake(0,0, tableView.frame.size.width, 60)) headerView.backgroundColor = UIColor.cyanColor() headerView.layer.borderColor = UIColor.whiteColor().CGColor headerView.layer.borderWidth = 1.0; let headerLabel = UILabel(frame: CGRectMake(5,2, tableView.frame.size.width - 5, 30)) headerLabel.text = sectionTitle (this is a variable) headerLabel.textAlignment = NSTextAlignment.Center headerLabel.font = UIFont(name: "AvenirNext", size: 18) headerLabel.textAlignment = NSTextAlignment.Center; headerView.addSubview(headerLabel) return headerView } func tableView(tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat { return 60 } 

它产生如下视图：

我正在寻找一种方法来垂直和水平地定位UILabel视图的中心。 我该怎么办？ 每当我改变字体和大小时它会不会改变？

另外，无论如何我会在故事板中做到这一点吗？ 以编程方式制作标题真的很难。

Answer 1

您可以在故事板中的UITableView上拖动UIView。 该视图将自动添加为您的UITableView标头。 请参见下图中的视图层次结构。

接下来在标题视图中创建UILabel并设置自动布局约束：

• 在superview中垂直居中
• 在superview中水平居中

你最终会得到这样的东西：

编辑：

编辑我的答案以回复您的评论。 如果你想为每个部分都有一个自定义标题视图，你可以覆盖func tableView(tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? 就像你已经在做的那样。

然后创建一个@IBOutlet UIView *headerView; 您将在上面提到的委托方法中返回。 转到故事板并将UIView从对象选项板拖到UIViewController/UITableViewController的顶部栏（请参阅附图）。

接下来将您的sockets连接到创建的UIView 。 您可以在故事板中设计视图，并为UILabel添加IBOutlet ，以便为您创建的每个节标题视图更新其文本内容。

Answer 2

只需创建自定义视图并以首选方式提供布局约束。

例如：

 - (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section { UIView *container = [UIView new]; UILabel *label = [UILabel new]; label.translatesAutoresizingMaskIntoConstraints = NO; [container addSubview:label]; [container addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-(20)-[label]-(10)-|" options:0 metrics:nil views:@{@"label" : label }]]; [container addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-(15)-[label]-(3)-|" options:0 metrics:nil views:@{@"label" : label}]]; label.text = [NSString stringWithFormat:@"Section %ld", section]; return container; } 

此外，您可以将此代码放在单独的类中，并且可以在XIB中布局视图。

迅速：

 let xConstraint = NSLayoutConstraint(item: label, attribute: .CenterX, relatedBy: .Equal, toItem: container, attribute: .CenterX, multiplier: 1.0, constant: 0.0); container.addConstraint(xConstraint); let yConstraint = NSLayoutConstraint(item: label, attribute: .CenterY, relatedBy: .Equal, toItem: container, attribute: .CenterY, multiplier: 1.0, constant: 0.0); container.addConstraint(yConstraint); let hConstraint = NSLayoutConstraint(item: label, attribute: .Height, relatedBy: .Equal, toItem: container,attribute: .Height, multiplier: 1.0, constant: 0.0); container.addConstraint(hConstraint); let wConstraint = NSLayoutConstraint(item: label, attribute: .Width, relatedBy: .Equal, toItem: container, attribute: .Width, multiplier: 1.0, constant: 0.0); container.addConstraint(wConstraint); 

Answer 3

您不能在storyboard中使用表头，但是如果需要自定义，则需要创建自定义类及其相应的xib文件