如何为UITableView标题视图设置动画

时间:2013-05-13 09:19:10

标签: iphone ios objective-c uitableview core-animation

我需要设置tableview标题视图的插入动画。我希望表格行在标题视图扩展其框架时向下滑动 到目前为止,我得到的最好结果是使用以下代码:

[self.tableView beginUpdates];  
[self.tableView setTableHeaderView:self.someHeaderView];  
[self.tableView endUpdates];

此解决方案的问题在于标题本身不会动画,其框架不会展开。

所以我得到的效果是表格行向下滑动(如我所愿),但标题视图立即显示,我希望它用动画扩展它的框架。

有什么想法吗?

感谢。

7 个答案:

答案 0 :(得分:17)

标题框位于CGRectZero 并使用动画

设置其框架
[self.tableView beginUpdates];  
[self.tableView setTableHeaderView:self.someHeaderView];  

[UIView animateWithDuration:.5f animations:^{
  CGRect theFrame = someBigger.frame;
  someHeaderView.frame = theFrame;
}];

[self.tableView endUpdates];  

答案 1 :(得分:12)

这是我在Swift中工作的原因,初始帧高度为零,并在动画闭包中将其更新为完整高度:

// Calculate new frame size for the table header
var newFrame = tableView.tableHeaderView!.frame
newFrame.size.height = 42

// Get the reference to the header view
let tableHeaderView = tableView.tableHeaderView

// Animate the height change
UIView.animate(withDuration: 0.6) {
    tableHeaderView.frame = newFrame
    self.tableView.tableHeaderView = tableHeaderView
})

答案 2 :(得分:7)

选择的答案对我没有用。不得不做以下事情:

[UIView animateWithDuration: 0.5f
                 animations: ^{
                     CGRect frame = self.tableView.tableHeaderView.frame;
                     frame.size.height = self.headerViewController.preferredHeight;
                     self.tableView.tableHeaderView.frame = frame;
                     self.tableView.tableHeaderView = self.tableView.tableHeaderView;
                   }];

真正奇特的部分是它在一个视图中工作,但不在同一视图控制器/视图层次结构的子类中。

答案 3 :(得分:1)

我找到了在tableHeaderView s上实现真实动画的权威方法!

•首先,如果您在Autolayout,请将Margin系统保留在标题视图中。现在可以使用Xcode 8(最后!),只是不要对任何标题子视图设置任何约束。您必须设置正确的边距。

•然后使用beginUpdatesendUpdates,但将endUpdate 放入动画块中。

// [self.tableView setTableHeaderView:headerView]; // not needed if already there
[self.tableView beginUpdates]; 
CGRect headerFrame = self.tableView.tableHeaderView.bounds;
headerFrame.size.height = PLAccountHeaderErrorHeight;

[UIView animateWithDuration:0.2 animations:^{
    self.tableView.tableHeaderView.bounds = headerFrame;

    [self.tableView endUpdates];
}];

注意:我只在iOS10中试过,我会在下载iOS9模拟器时发布更新。

修改

不幸的是,它在iOS9以及iOS10中都不起作用:标题本身不会改变其高度,但标题子视图似乎移动,好像标题边界发生了变化。

答案 4 :(得分:0)

带有不同标题的SWIFT 4解决方案

如果您想要这种动画,那就是我使用的解决方案:(即使在我的情况下,我也不得不对对象的不透明度进行一些调整,因为我正在加载另一个完全不同的标头) / p>

fileprivate func transitionExample() {

    let oldHeight = tableView.tableHeaderView?.systemLayoutSizeFitting(UILayoutFittingCompressedSize).height ?? 0

    let newHeader = YourCustomHeaderView()
    newHeader.hideElements() // If you want to play with opacity.

    let smallHeaderFrame = CGRect(x: 0, y: 0, width: newHeader.frame.width, height: oldHeight)
    let fullHeaderFrame = newHeader.frame

    newHeader.frame = smallHeaderFrame

    UIView.animate(withDuration: 0.4) { [weak self] in
        self?.tableView.beginUpdates()
        newHeader.showElements() // Only if have hided the elements before.
        self?.tableView.tableHeaderView = newHeader
        self?.tableView.tableHeaderView?.frame = fullHeaderFrame
        self?.tableView.endUpdates()
    }
}

因此,基本上,所有操作都与更改.animate闭包内的框架有关。为了移动和更新tableView的其他元素,需要进行边更新/结束更新。

答案 5 :(得分:0)

这是一个Swift 5 UITableView扩展,用于更改headerView或更改其高度,并使用AutoLayout进行动画处理

extension UITableView {

func animateTableHeader(view: UIView? = nil, frame: CGRect? = nil) {
    self.tableHeaderView?.setNeedsUpdateConstraints()
    UIView.animate(withDuration: 0.2, animations: {() -> Void in
        let hView = view ?? self.tableHeaderView
        if frame != nil {
            hView?.frame = frame!
        }
        self.tableHeaderView = hView
        self.tableHeaderView?.layoutIfNeeded()
    }, completion: nil)
}

}

答案 6 :(得分:-1)

使用以下代码可以使用

extension UITableView {

 func hideTableHeaderView() -> Void {
    self.beginUpdates()
    UIView.animate(withDuration: 0.2, animations: {
        self.tableHeaderView = nil
    })
    self.endUpdates()
}

func showTableHeaderView(header: UIView) -> Void {
    let headerView = header
    self.beginUpdates()
    let headerFrame = headerView.frame
    headerView.frame = CGRect()
    self.tableHeaderView = headerView
    UIView.animate(withDuration: 0.2, animations: {
        self.tableHeaderView?.frame = headerFrame
        self.tableHeaderView?.alpha = 0
        self.endUpdates()
    }, completion: { (ok) in
        self.tableHeaderView?.alpha = 1
    })
   }
}