更改UITableView节标题的字体大小


138

有人可以指导我以最简单的方法更改UITableView节标题中文本的字体大小吗?

我使用以下方法实现了节标题:

- (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section

然后,我了解了如何使用此方法成功更改节标题高度:

- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section

我有使用此方法填充的UITableView单元格:

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath

但是,我对如何实际增加节标题文本的字体大小(或就此而言的字体样式)感到困惑?

有人可以帮忙吗?谢谢。


Answers:


118

不幸的是,您可能必须重写此方法:

在Objective-C中:

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

在Swift中:

func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView?

尝试这样的事情:

在Objective-C中:

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

    UILabel *myLabel = [[UILabel alloc] init];
    myLabel.frame = CGRectMake(20, 8, 320, 20);
    myLabel.font = [UIFont boldSystemFontOfSize:18];
    myLabel.text = [self tableView:tableView titleForHeaderInSection:section];

    UIView *headerView = [[UIView alloc] init];
    [headerView addSubview:myLabel];

    return headerView;
}

在Swift中:

func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {

    let myLabel = UILabel()
    myLabel.frame = CGRect(x: 20, y: 8, width: 320, height: 20)
    myLabel.font = UIFont.boldSystemFont(ofSize: 18)
    myLabel.text = self.tableView(tableView, titleForHeaderInSection: section)

    let headerView = UIView()
    headerView.addSubview(myLabel)

    return headerView
}

1
谢谢。这工作得很好。非常感激。
JRD8

5
虽然这是一个正确的解决方案,但是请谨慎使用此方法。对于长度超过一行的标头,您将不得不对标头的高度进行计算,tableView:heightForHeaderInSection:这可能很麻烦。
Leo Natan 2014年

3
尝试了此操作,并且在向上滚动表格时可以使用,但是“标题标签”保留在屏幕上并覆盖单元格。:(
等离子

2
@trss我想您会发现这不是预期的行为。我不是说标题部分留在那里,只有标签,并且当它们通过下方时,它们对单元格的叠加使它看起来真是一团糟。我确实找到了一种更好的方法来实现这一目标,并在找到后将其重新发布。
Plasma

1
@ mosca1337无需创建另一个视图,您可以获取显示的实际“ UITableViewHeaderFooterView”并调整参数。
Juan Boero'7

366

做到这一点的另一种方法是响应该UITableViewDelegate方法willDisplayHeaderView。传递的视图实际上是的实例UITableViewHeaderFooterView

下面的示例更改字体,并使标题文本在单元格中垂直和水平居中。请注意,您还应该响应heightForHeaderInSection在表格视图的布局中考虑到标题高度的任何更改。(也就是说,如果您决定用此willDisplayHeaderView方法更改标题高度。)

然后,您可以响应该titleForHeaderInSection方法,以将此配置的标头与不同的节标题一起重用。

目标C

- (void)tableView:(UITableView *)tableView willDisplayHeaderView:(UIView *)view forSection:(NSInteger)section {
    UITableViewHeaderFooterView *header = (UITableViewHeaderFooterView *)view;

    header.textLabel.textColor = [UIColor redColor];
    header.textLabel.font = [UIFont boldSystemFontOfSize:18];
    CGRect headerFrame = header.frame;
    header.textLabel.frame = headerFrame;
    header.textLabel.textAlignment = NSTextAlignmentCenter;
}

斯威夫特1.2

(注意:如果您的视图控制器是a的后代,则UITableViewController需要将其声明为override func。)

override func tableView(tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int) 
{
    let header:UITableViewHeaderFooterView = view as! UITableViewHeaderFooterView

    header.textLabel.textColor = UIColor.redColor()
    header.textLabel.font = UIFont.boldSystemFontOfSize(18)
    header.textLabel.frame = header.frame
    header.textLabel.textAlignment = NSTextAlignment.Center
}

斯威夫特3.0

此代码还确保如果您的标题视图不是UITableViewHeaderFooterView之外的其他东西,则应用程序不会崩溃:

override func tableView(_ tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int) {
    guard let header = view as? UITableViewHeaderFooterView else { return }
    header.textLabel?.textColor = UIColor.red
    header.textLabel?.font = UIFont.boldSystemFont(ofSize: 18)
    header.textLabel?.frame = header.frame
    header.textLabel?.textAlignment = .center
}

3
这种方法对我来说比上面的方法好得多
Plasma

6
我见过的最好的答案。
帕特曼2014年

2
假设没有其他原因可以子类化(例如,添加视图),这将是调整信息的“适当”方法。此外,此方法可用于更新动态类型的标题文本。只需使用:header.textLabel.font = [UIFont preferredFontForTextStyle:UIFontTextStyleHeadline];和/或header.detailTextLabel.font = [UIFont preferredFontForTextStyle:UIFontTextStyleHeadline];所需的其他步骤(请参阅此处:captechconsulting.com/blog/john-szumski/…
leanne

3
这不会调整标题视图的大小,因此,如果您的字体较大或明显不同(例如Zapfino)(不要问为什么),它将切出文本。如果您必须自己计算大小,那是一团糟,您不应该这样做。
Leo Natan 2014年

@CocoaPriest在我的beta版本中,请不要崩溃。(GM种子2)
Patrick Bassut 2014年

96

尽管mosca1337的答案是正确的解决方案,但请谨慎使用该方法。对于文本长于一行的标题,您将不得不执行标题高度的计算,tableView:heightForHeaderInSection:这可能很麻烦。

一种更可取的方法是使用外观API:

[[UILabel appearanceWhenContainedIn:[UITableViewHeaderFooterView class], nil] setFont:[UIFont boldSystemFontOfSize:28]];

这将更改字体,同时仍然保留表格来管理高度本身。

为了获得最佳结果,请对表视图进行子类化,然后将其添加到包含链(在中appearanceWhenContainedIn:),以确保仅针对特定的表视图更改了字体。


1
如果是子类化,那么您无论如何都会- tableView:viewForHeaderInSection:从右返回自定义视图?在这种情况下,可以在此处设置字体。无论如何,这就是@ mosca1337的解决方案。
trss 2014年

1
哈哈,好吧,昨天以后我是个笨蛋。子类化表视图并将其添加到容器列表。;-)
Leo Natan 2014年

2
此解决方案在计算实际页脚/页眉大小时会导致许多错误。我可以显示一些示例,这些示例是在设置自定义字体时将标题切掉的。
kas-kad 2014年

5
斯威夫特3UILabel.appearance(whenContainedInInstancesOf: [UITableViewHeaderFooterView.self]).font = UIFont.boldSystemFont(ofSize: 28)
埃里克·霍奇斯

3
这不能正确调整标签的大小以适合iOS 11上的字体。此外,加载视图后向上和向下滚动会将其重置为默认字体。
nickdnk

25

对于iOS 7,我使用此功能


-(void)tableView:(UITableView *)tableView willDisplayHeaderView:(UIView *)view forSection:(NSInteger)section
{
    UITableViewHeaderFooterView *header = (UITableViewHeaderFooterView *)view;

    header.textLabel.font = [UIFont boldSystemFontOfSize:10.0f];
    header.textLabel.textColor = [UIColor orangeColor];
}

这是带有标头大小调整的Swift 3.0版本

override func tableView(_ tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int) {
    if let header = view as? UITableViewHeaderFooterView {
        header.textLabel!.font = UIFont.systemFont(ofSize: 24.0)
        header.textLabel!.textColor = UIColor.orange          
    }
}

6
这不会调整标题视图的大小以适合新字体。
Leo Natan

@LeoNatan我们如何调整标题视图的大小以适合新字体-可以用这种方法吗?
SAHM 2015年

我想澄清的是,我确实看到了您的上述答案,但是我只想在用户选择的字体(可访问性)超过一定大小(因此,并非始终)时更改字体以限制大小。我相信我需要检查并可能会更改willDisplayHeaderView中的字体,所以如果更改了字体,有没有一种方法可以重新计算视图高度?
SAHM 2015年

19

斯威夫特3:

调整大小的最简单方法:

func tableView(_ tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int) {

    let header = view as! UITableViewHeaderFooterView

    if let textlabel = header.textLabel {
        textlabel.font = textlabel.font.withSize(15)
    }
}

那是我寻找的最简单的方法。
瑞安

迅速运行4!不要忘记“重写函数”
。– Matvey

8

Swift 2.0

  1. 用完全可自定义的UILabel替换默认的节标题。

实现viewForHeaderInSection,如下所示:

  override func tableView(tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {

    let sectionTitle: String = self.tableView(tableView, titleForHeaderInSection: section)!
    if sectionTitle == "" {
      return nil
    }

    let title: UILabel = UILabel()

    title.text = sectionTitle
    title.textColor = UIColor(red: 0.0, green: 0.54, blue: 0.0, alpha: 0.8)
    title.backgroundColor = UIColor.clearColor()
    title.font = UIFont.boldSystemFontOfSize(15)

    return title
  }
  1. 更改默认标题(保留默认值)。

实现willDisplayHeaderView,如下所示:

  override func tableView(tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int) {

    if let view = view as? UITableViewHeaderFooterView {
      view.backgroundView?.backgroundColor = UIColor.blueColor()
      view.textLabel!.backgroundColor = UIColor.clearColor()
      view.textLabel!.textColor = UIColor.whiteColor()
      view.textLabel!.font = UIFont.boldSystemFontOfSize(15)
    }
  }

请记住:如果您使用的是静态单元格,则由于UITableView的顶部,第一节的标题比其他节的标题要高填充。解决此问题:

实现heightForHeaderInSection,如下所示:

  override func tableView(tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {

    return 30.0 // Or whatever height you want!
  }

4

Swift 4版本的Leo Natan的答案

UILabel.appearance(whenContainedInInstancesOf: [UITableViewHeaderFooterView.self]).font = UIFont.boldSystemFont(ofSize: 28)

如果要设置自定义字体,可以使用

if let font = UIFont(name: "font-name", size: 12) {
    UILabel.appearance(whenContainedInInstancesOf: [UITableViewHeaderFooterView.self]).font = font
}

不幸的是,这不会调整框架的大小。
nickdnk

3

使用此方法,您还可以设置字体大小,字体样式和标题背景。有两种方法

第一种方法

- (void)tableView:(UITableView *)tableView willDisplayHeaderView:(UIView *)view forSection:(NSInteger)section{
        UITableViewHeaderFooterView *header = (UITableViewHeaderFooterView *)view;
        header.backgroundView.backgroundColor = [UIColor darkGrayColor];
        header.textLabel.font=[UIFont fontWithName:@"Open Sans-Regular" size:12];
        [header.textLabel setTextColor:[UIColor whiteColor]];
    }

第二种方法

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section{
    UILabel *myLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, tableView.frame.size.width, 30)];
//    myLabel.frame = CGRectMake(20, 8, 320, 20);
    myLabel.font = [UIFont fontWithName:@"Open Sans-Regular" size:12];
    myLabel.text = [NSString stringWithFormat:@"   %@",[self tableView:FilterSearchTable titleForHeaderInSection:section]];

    myLabel.backgroundColor=[UIColor blueColor];
    myLabel.textColor=[UIColor whiteColor];
    UIView *headerView = [[UIView alloc] init];
    [headerView addSubview:myLabel];
    return headerView;
}

1

斯威夫特2:

按照OP的要求,调整大小,而不将其设置为系统粗体或任何其他方式:

func tableView(tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int) {
        if let headerView = view as? UITableViewHeaderFooterView, textLabel = headerView.textLabel {

            let newSize = CGFloat(16)
            let fontName = textLabel.font.fontName
            textLabel.font = UIFont(name: fontName, size: newSize)
        }
    }

0

这是我的快速解决方案5。

要完全控制页眉节视图,您需要在控制器中使用tableView(:viewForHeaderInsection::)方法,如前一篇文章所示。但是,还有一个步骤:为了提高性能,Apple建议不要每次都生成一个新视图,而是像重用表单元格一样重新使用头视图。这是通过tableView.dequeueReusableHeaderFooterView(withIdentifier:)方法实现的。但是我遇到的问题是,一旦您开始使用此重用功能,字体将无法按预期运行。其他诸如颜色,对齐方式等都很好,但只是字体。进行了一些讨论,但是我像下面这样使它工作。

问题是tableView.dequeueReusableHeaderFooterView(withIdentifier :)与总是返回一个单元格的tableView.dequeneReuseCell(:)不同。如果没有人,前者将返回nil。即使返回一个重用头视图,它也不是您原来的类类型,而是一个UITableHeaderFooterView。因此,您需要做出判断并按照自己的代码行事。基本上,如果为零,则获得一个全新的标题视图。如果不为零,则强制施放,以便您可以控制。

override func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
        let reuse_header = tableView.dequeueReusableHeaderFooterView(withIdentifier: "yourHeaderID")
        if (reuse_header == nil) {
            let new_sec_header = YourTableHeaderViewClass(reuseIdentifier:"yourHeaderID")
            new_section_header.label.text="yourHeaderString"
            //do whatever to set color. alignment, etc to the label view property
            //note: the label property here should be your custom label view. Not the build-in labelView. This way you have total control.
            return new_section_header
        }
        else {
            let new_section_header = reuse_section_header as! yourTableHeaderViewClass
            new_sec_header.label.text="yourHeaderString"
            //do whatever color, alignment, etc to the label property
            return new_sec_header}

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