现在大多数App都有这种效果,实现原理大同小异。都是监听UITableView scrollViewDidScroll
方法去动态改变header frame。
1.懒加载定义UITableView
lazy var tableview:UITableView = {
var mytable = UITableView.init(frame: CGRect.init(x: 0, y: 0, width: UIScreen.main.bounds.width, height: UIScreen.main.bounds.height), style: .grouped)
mytable.register(UITableViewCell.self, forCellReuseIdentifier: "cell")
mytable.delegate = self
mytable.dataSource = self
return mytable
}()
2.定义Header 背景图片
lazy var headerView:UIImageView = {
var header:UIImageView = UIImageView.init(frame: CGRect.init(x: 0, y: 0, width: UIScreen.main.bounds.width, height: 300))
header.image = UIImage.init(named: "headbg")
header.contentMode = .scaleAspectFill
header.backgroundColor = UIColor.red
return header
}()
3. 给 tableHeaderView创建view视图
override func viewDidLoad() {
super.viewDidLoad()
//自定义view 头像/登录/注册 按钮都可以放在上面
let back:UIView = UIView.init(frame: CGRect.init(x: 0, y: 0, width: UIScreen.main.bounds.width, height: 300))
back.backgroundColor = UIColor.green
back.addSubview(headerView)
self.tableview.tableHeaderView = back
self.view.addSubview(self.tableview)
// Do any additional setup after loading the view.
}
4.创建监听scrollViewDidScroll
func scrollViewDidScroll(_ scrollView: UIScrollView) {
//照片宽度
let width = self.view.frame.size.width
//偏移量y
let yoffset = scrollView.contentOffset.y
if yoffset<0 {
let totalOffset = 300 + abs(yoffset)
let f = totalOffset/300 //计算缩放比例
self.headerView.frame = CGRect.init(x: -(width*f-width), y: yoffset, width: width*f, height: totalOffset)
}
}
上例是UIViewController 没有 UINavigationBar 的情况。如果有UINavigationBar 可将navigationbar 设置成透明 然后 适当设置 uitableview contentOffset
,让uitableview 在 navigationbar下面。
override func viewWillAppear(_ animated: Bool) {
//1.判断登录状态,load data
//2.设置透明
self.navigationController?.navigationBar.isTranslucent = true
self.navigationController?.navigationBar.setBackgroundImage(UIImage.init(), for: .default)
self.navigationController?.navigationBar.shadowImage = UIImage.init()
self.navigationController?.navigationBar.barStyle = .blackTranslucent
}
取消透明
override func viewWillDisappear(_ animated: Bool) {
self.navigationController?.navigationBar.setBackgroundImage(nil, for: .default)
self.navigationController?.navigationBar.shadowImage = nil
self.navigationController?.navigationBar.barStyle = .default
self.navigationController?.navigationBar.isTranslucent = false
}
网友评论