Question

我创建了一个非常简单的测试用例来重现这个问题。

我正在尝试以编程方式将页脚视图设置为tableview。请注意，我指的是在tableview最底部的页脚 - 而不是部分页脚（大多数堆栈溢出答案会混淆它们）。

这是我非常简单的代码：

- (void)viewDidLoad {
    [super viewDidLoad];
    UIView *footerContainer = [[UIView alloc] initWithFrame:CGRectZero];
    footerContainer.backgroundColor=[UIColor greenColor];
    footerContainer.translatesAutoresizingMaskIntoConstraints=NO;
    [footerContainer addConstraints:@[[NSLayoutConstraint
                                       constraintWithItem:footerContainer attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual
                                       toItem:nil attribute:NSLayoutAttributeNotAnAttribute multiplier:1.0f constant:100
                                       ],
                                      [NSLayoutConstraint
                                       constraintWithItem:footerContainer attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual
                                       toItem:nil attribute:NSLayoutAttributeNotAnAttribute multiplier:1.0f constant:[UIScreen mainScreen].bounds.size.width
                                       ]]];

    self.mytableview.tableFooterView=footerContainer;
    [self.view setNeedsLayout];
    [self.view layoutIfNeeded];
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
    return 10;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cell"];
    cell.textLabel.text=[NSString stringWithFormat:@"%ld",indexPath.row];
    return cell;
}

然而，结果如下：

正如您所注意到的，页脚显示在tableview的顶部。这是一个错误还是我错过了什么？

如果我将tableFooterView更改为tableHeaderView，那么它可以正常工作。所以我也期望同样适用于页脚，但事实并非如此。

Answer 1

我在swift中尝试了相同的显式框架值，我按照你的要求实现了行为，如果你觉得它很好，请尝试使用显式框架值。如果不需要，请删除布局约束。

   @IBOutlet weak var tableView: UITableView!

override func viewDidLoad() {
    super.viewDidLoad()

    tableView.delegate = self
    tableView.dataSource = self

    let footerView = UIView(frame: CGRect.init(x: 0, y: 0, width: tableView.frame.width, height: 50))
    footerView.backgroundColor = UIColor.green
    tableView.tableFooterView = footerView
}

extension ViewController: UITableViewDelegate, UITableViewDataSource {

func numberOfSections(in tableView: UITableView) -> Int {
    return 1
}

func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return 10
}

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "cell")
    cell?.textLabel?.text = "\(indexPath.row)"
    return cell!
}

}

Answer 2

动态大小的UITableView页眉和页脚视图在自动布局方面并不总是很好用，所以你需要给它一些帮助。

这是一个为页脚视图创建简单UIView并添加＆＃34;扩展＆＃34;的示例。 UILabel（行数设置为零）。页脚视图是使用其框架的显式CGRect创建的，并且标签将固定到具有自动布局约束的所有四个边。

在viewDidLayoutSubviews()中，我们告诉自动布局根据内容的约束来计算页脚视图的框架，然后我们更新框架值（好吧，特别是高度）。

//
// this assumes IBOutlet has been set for "theTableView"
//

- (void)viewDidLoad {
    [super viewDidLoad];

    // standard stuff
    [_theTableView registerClass:[UITableViewCell class] forCellReuseIdentifier:@"simpleCell"];
    _theTableView.delegate = self;
    _theTableView.dataSource = self;

    // instantiate a view for the table footer
    // width doesn't matter (it will be stretched to fit the table by default)
    // set height to a big number to avoid a "will attempt to break constraint" warning
    UIView *footerContainer = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 1, 1000)];

    // give it a color so we can see it
    footerContainer.backgroundColor=[UIColor greenColor];

    // set the footer view
    _theTableView.tableFooterView = footerContainer;


    // instantiate a label to add to the footer view
    UILabel *aLabel = [UILabel new];

    // auto-sizing the height, so set lines to zero
    aLabel.numberOfLines = 0;

    // give it a color so we can see it
    aLabel.backgroundColor = [UIColor yellowColor];

    // set the text to 8 lines for demonstration purposes
    aLabel.text = @"Line 1\nLine 2\nLine 3\nLine 4\nLine 5\nLine 6\nLine 7\nLine 8";

    // standard, for auto-sizing
    aLabel.translatesAutoresizingMaskIntoConstraints = NO;

    // add the label to the footer view
    [footerContainer addSubview:aLabel];

    // constraint the label to 8-pts from each edge...
    [aLabel.topAnchor constraintEqualToAnchor:footerContainer.topAnchor constant:8.0].active = YES;
    [aLabel.leftAnchor constraintEqualToAnchor:footerContainer.leftAnchor constant:8.0].active = YES;
    [aLabel.rightAnchor constraintEqualToAnchor:footerContainer.rightAnchor constant:-8.0].active = YES;
    [aLabel.bottomAnchor constraintEqualToAnchor:footerContainer.bottomAnchor constant:-8.0].active = YES;

}

- (void)viewDidLayoutSubviews {
    [super viewDidLayoutSubviews];

    // get a reference to the table's footer view
    UIView *currentFooterView = [_theTableView tableFooterView];

    // if it's a valid reference (the table *does* have a footer view)
    if (currentFooterView) {

        // tell auto-layout to calculate the size based on the footer view's content
        CGFloat newHeight = [currentFooterView systemLayoutSizeFittingSize:UILayoutFittingCompressedSize].height;

        // get the current frame of the footer view
        CGRect currentFrame = currentFooterView.frame;

        // we only want to do this when necessary (otherwise we risk infinite recursion)
        // so... if the calculated height is not the same as the current height
        if (newHeight != currentFrame.size.height) {
            // use the new (calculated) height
            currentFrame.size.height = newHeight;
            currentFooterView.frame = currentFrame;
        }

    }

}

在尝试使自动调整大小的表视图标题视图正常工作时，这也很有用。

Answer 3

您可以使用Autolayout和Xibs创建页脚视图。但是，您必须将自定义视图添加到容器视图中，并将其分配给tableFooterView。

func setupTableFooterView() {
    // Create your footer view from XIB and set constraints (in my case it is historyToolBarView of class HistoryToolBarView)
    let view = Bundle.main.loadNibNamed("HistoryToolBarView", owner: self, options: nil)?.first
    historyToolBarView = view as! HistoryToolBarView
    historyToolBarView.translatesAutoresizingMaskIntoConstraints = false
    historyToolBarView.addConstraints(
        [NSLayoutConstraint.init(item: self.historyToolBarView,
                                 attribute: .height,
                                 relatedBy: .equal,
                                 toItem: nil,
                                 attribute: .notAnAttribute,
                                 multiplier: 1.0,
                                 constant: 60),
         NSLayoutConstraint.init(item: self.historyToolBarView,
                                 attribute: .width,
                                 relatedBy: .equal,
                                 toItem: nil,
                                 attribute: .notAnAttribute,
                                 multiplier: 1.0,
                                 constant: UIScreen.main.bounds.size.width)])

    // Create a container of your footer view called footerView and set it as a tableFooterView
    let footerView = UIView(frame: CGRect.init(x: 0, y: 0, width: tableView.frame.width, height: 60))
    footerView.backgroundColor = UIColor.green
    tableView.tableFooterView = footerView

    // Add your footer view to the container
    footerView.addSubview(historyToolBarView)
}

Answer 4

表视图正在忽略约束。
手动设置height，它将起作用：

tableView.tableFooterView?.frame.size.height = 20

Answer 5

第一组tableView.tableFooterView = customView

然后，在updateTableFooterViewSize()或viewDidLayoutSubviews中调用layoutSubviews函数

private func updateTableFooterViewSize() {
    let width: CGFloat = view.frame.width // required width
    let height: CGFloat = 50 // required height 
    tableView.tableFooterView?.frame.size = CGSize(width: width, height: height)
}

Answer 6

为表格设置分组样式，为标题CGFloat.leastNonzeroMagnitude设置高度

tableView.style = .grouped

func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
    return CGFloat.leastNonzeroMagnitude
}

UITableView tableFooterView显示在UITableView的顶部 - 错误

6 个答案: