Stretchy Header用于以编程方式创建的UITAbleView - Swift

时间:2016-08-25 18:23:51

标签: ios swift uitableview uitableviewsectionheader

我以编程方式创建了UITableView。我没有使用故事板。 我阅读并观看了大量有关如何创建弹性标题的教程,但所有这些教程都使用了Storyboard。

据我了解,要实现弹性效果,您必须将tableViewHeader添加为子视图,然后使用.sendSubviewToBack将其移至后面,然后应用其余逻辑。

但是我无法弄清楚在以编程方式创建标头时必须发送到子视图的内容。使用故事板时,您可以为变量分配自定义标题类,然后将其添加到子视图中。所以这是我的TableViewcontroller:

import UIKit

private let reuseIdentifier = "contentCellId"
private let headerIdentifier = "headerCellId"

class ItemDetailViewController: UITableViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        // Uncomment the following line to preserve selection between presentations
        // self.clearsSelectionOnViewWillAppear = false

        tableView.registerClass(ItemDetailsContentCell.self, forCellReuseIdentifier: reuseIdentifier)
        tableView.registerClass(ItemDetailsHeaderCell.self, forHeaderFooterViewReuseIdentifier: headerIdentifier)

        let headerView = tableView.tableHeaderView
        print(headerView) // returns NIL     

        tableView.separatorStyle = .None

        // TableView heights
        tableView.rowHeight = UITableViewAutomaticDimension
        tableView.estimatedRowHeight = 500.0

    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    // MARK: - Table view data source

    override func numberOfSectionsInTableView(tableView: UITableView) -> Int {
        // #warning Incomplete implementation, return the number of sections
        return 1
    }

    override func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        // #warning Incomplete implementation, return the number of rows
        return 1
    }


    override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCellWithIdentifier(reuseIdentifier, forIndexPath: indexPath) as! ItemDetailsContentCell

        // Configure the cell...

        return cell
    }

    override func tableView(tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
        let headerView = tableView.dequeueReusableHeaderFooterViewWithIdentifier(headerIdentifier)
        return headerView
    }

    override func tableView(tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
        let cell = tableView.dequeueReusableHeaderFooterViewWithIdentifier(headerIdentifier) as! ItemDetailsHeaderCell

        let width = view.frame.width
        let imageRatio = (cell.itemImage.image?.size.height)! / (cell.itemImage.image?.size.width)!

        let newHeight = width * imageRatio

        return newHeight
    }

//    override func tableView(tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat {
//        return UITableViewAutomaticDimension
//    }
//    
//    override func tableView(tableView: UITableView, estimatedHeightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat {
//        return 500
//    }

}

它没什么特别的。 这是我尝试复制的代码示例:

 @IBOutlet weak var tableView:UITableView!
@IBOutlet weak var headerView:ArticleHeaderView!

var article: Article?

// Header view configuration
private var defaultTableHeaderHeight:CGFloat = 250.0
private var lastContentOffset:CGFloat = 0.0
private let defaultHeaderImageName = "bg-pattern"


override func viewDidLoad() {
    super.viewDidLoad()

    tableView.separatorStyle = .None
    tableView.rowHeight = UITableViewAutomaticDimension

    // Add the header view to the table view background
    defaultTableHeaderHeight = headerView.frame.size.height
    lastContentOffset = -defaultTableHeaderHeight

    print(defaultTableHeaderHeight)
    print(tableView.tableHeaderView!.frame.height)


    tableView.tableHeaderView = nil
    tableView.addSubview(headerView)
    tableView.sendSubviewToBack(headerView)

    tableView.contentInset = UIEdgeInsets(top: defaultTableHeaderHeight, left: 0, bottom: 0, right: 0)
    tableView.contentOffset = CGPoint(x: 0, y: -defaultTableHeaderHeight)

    // Disable content inset adjustment
    self.automaticallyAdjustsScrollViewInsets = false

我的代码中的headerView:ArticleHeaderView!等同于什么?

这可能听起来很愚蠢,但我被卡住了。帮助!

1 个答案:

答案 0 :(得分:3)

你可以在这里看到一个例子:

https://medium.com/@jeremysh/creating-a-sticky-header-for-a-uitableview-40af71653b55

文章的作者讨论了如何创建自定义标题视图并使用代码中的约束并使用UITableView继承的scrollView的委托来应用转换。

他讨论了向下和向上滚动以使headerView更小或更大。

    func animateHeader() {
      self.headerHeightConstraint.constant = 150
      UIView.animateWithDuration(0.4, delay: 0.0, 
       usingSpringWithDamping: 0.7, initialSpringVelocity: 0.5, 
       options: .CurveEaseInOut, animations: {
     self.view.layoutIfNeeded()
    }, completion: nil)
   }

    func scrollViewDidEndDragging(scrollView: UIScrollView, willDecelerate decelerate: Bool) {
if self.headerHeightConstraint.constant > 150 {
animateHeader()
}
}
func scrollViewDidEndDecelerating(scrollView: UIScrollView) {
if self.headerHeightConstraint.constant > 150 {
animateHeader()
}
}