TableView 中的滚动委托 [英] Scrolling Delegate in TableView

问题描述

我想制作一个类似这个链接的动画:

在我的例子中，我希望当我向上滑动时，蓝色的标题视图会消失，导航栏会变成蓝色.

这是我的代码:

导入 UIKit类 ViewController: UIViewController, UITableViewDataSource, UITableViewDelegate {@IBOutlet var tableView:UITableView！@IBOutlet var headerView:UIView！var dataSource: [String] = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14].map {"\($0)"}覆盖 func viewDidLoad() {super.viewDidLoad()tableView.dataSource = selftableView.delegate = selfheaderView.backgroundColor = UIColor.blueColor()}func numberOfSectionsInTableView(tableView: UITableView) ->整数{返回 1}func tableView(tableView: UITableView, numberOfRowsInSection 部分: Int) ->整数{返回数据源.count}func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) ->UITableViewCell {let cell = tableView.dequeueReusableCellWithIdentifier("cell", forIndexPath: indexPath)cell.textLabel!.text = dataSource[indexPath.row]返回单元格}}

我可以用这样的动画更改视图，包括:导航栏、TableView 的标题视图、状态栏.

但是如何检查TableView向下滚动时，Header View是否会发生变化.

解决方案

您必须在 tableView 中使用 UIScrollViewDelegate 来拦截 scrollView 操作:

class YourClass: YourType, UIScrollViewDelegate {}

查看

第二个状态:

您可以通过选择 UIViewController 类型来组织您的控制器.这个 UIViewController 必须由:

• -UINavigationController(如您在图像顶部看到的，选择是要嵌入它还是链接导航控制器并将您的 viewController 设置为导航rootViewController)
• -UIPageView(您可以在主视图控制器中使用 UIPageViewControllerDataSource 和 UIPageViewControllerDelegate，注意尺寸，它覆盖了控制器顶部的 30%)
• -UITableView(这是最后一个布局部分，每次页面滚动时数据源都可以更改并刷新到表格)

附言tableViewHeader 可以是带有日期的灰色标签:2016 年 1 月 21 日星期四，因为您可以看到尺寸在动画期间不会改变.

I want to make an animation like this link:

https://www.pinterest.com/pin/420523683937443901/sent/?sender=335307272165049646&invite_code=f63f81c77d28a48e6181db7df90b423a

Here is my simple screenshot:

In my case, I want when I swiping up, the blue Header View will disappear and the navigation bar will change to blue color.

Here is my code:

import UIKit

class ViewController: UIViewController, UITableViewDataSource, UITableViewDelegate {

    @IBOutlet var tableView: UITableView!
    @IBOutlet var headerView: UIView!

    var dataSource: [String] = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14].map {"\($0)"}

    override func viewDidLoad() {
        super.viewDidLoad()

        tableView.dataSource = self
        tableView.delegate = self
        headerView.backgroundColor = UIColor.blueColor()
    }

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

    func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return dataSource.count
    }

    func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCellWithIdentifier("cell", forIndexPath: indexPath)
        cell.textLabel!.text = dataSource[indexPath.row]
        return cell
    }

}

I can change the views with animation like this, include: Navigation Bar, Header View of TableView, Status Bar.

But how to check when the TableView scroll down, then the Header View will change.

解决方案

You must use UIScrollViewDelegate in your tableView to intercept scrollView actions with:

class YourClass: YourType, UIScrollViewDelegate {}

Check the official apple documentation

You can handle scrollview looking for scrollViewDidScroll(_:) method.

This is just an example to add more network data when the user scroll to the end, you can use it to trigger your header animation..

let threshold = 100.0 // threshold from bottom of tableView
var isLoadingMore = false // flag

func scrollViewDidScroll(scrollView: UIScrollView) {
    let contentOffset = scrollView.contentOffset.y
    let maximumOffset = scrollView.contentSize.height - scrollView.frame.size.height;

    if !isLoadingMore && (maximumOffset - contentOffset <= threshold) {
        // Get more data - API call
        self.isLoadingMore = true

        // Update UI
        dispatch_async(dispatch_get_main_queue()) {
            tableView.reloadData()
            self.isLoadingMore = false
        }
    }
}

UPDATE:

By analizying your animation, it's not simple but not impossible :) I can see two different states:

And the second state:

You can organize your controller by choose a UIViewController type. This UIViewController must be composed by:

• -UINavigationController (as you can see on the top of the images , choose if you want to embedded it or link a navigation controller and set your viewController as the navigation rootViewController)
• -UIPageView (you can use in your main viewController with the UIPageViewControllerDataSource and UIPageViewControllerDelegate, pay attention to the dimension , it cover the 30% of the top of your controller)
• -UITableView (this is the last layout part, everytime page scroller the datasource can be changed and refreshed to the table)

P.S. The tableViewHeader can be the gray label with the date: Thursday 21 January 2016, as you can see the dimension dont change during animation.

这篇关于TableView 中的滚动委托的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！