AutoLayout实现Parallax Header

2018-04-07  本文已影响76人  青山不改
类似个人中心效果

xib里设置table的约束,背景色为clear,imageview的高度为200
代码里这样设置:

import UIKit

class ViewController: UIViewController {
    @IBOutlet weak var tableView: UITableView!{
        didSet{
//这里设置一些table的属性
            tableView.dataSource = self
            tableView.delegate = self
            tableView.backgroundColor = .clear
            tableView.register(UITableViewCell.self, forCellReuseIdentifier: NSStringFromClass(UITableViewCell.self))
            //设置table的contentInset可以显示被table挡住的image
            tableView.contentInset = UIEdgeInsetsMake(self.height!, 0, 0, 0)
        }
    }
    @IBOutlet weak var imageView: UIImageView!
    var height: CGFloat?
    @IBOutlet weak var imageViewHeight: NSLayoutConstraint!{
        didSet{
//记住image的原始高度,这是图片的高度约束
            height = imageViewHeight.constant
        }
    }
    

    override func viewDidLoad() {
        super.viewDidLoad() 
    }
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
}
extension ViewController: UITableViewDataSource{
    func numberOfSections(in tableView: UITableView) -> Int {
        return 1
    }
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 30
    }
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: NSStringFromClass(UITableViewCell.self), for: indexPath)
        
        return cell
        
    }
    
}
extension ViewController: UITableViewDelegate{
    func scrollViewDidScroll(_ scrollView: UIScrollView) {
        print(scrollView.contentOffset.y)
//根据滚动的y值设置图片的高
        if scrollView.contentOffset.y < -self.height! {
            self.imageViewHeight.constant =  -scrollView.contentOffset.y
        }else{
            self.imageViewHeight.constant = self.height!
        }
    }
}
上一篇 下一篇

猜你喜欢

热点阅读