swift仿微博下拉headerView放大效果

前言

微博个人中心头部背景下拉放大效果因为美观并且有意思, 很受开发者们的青睐, 所以今天就用swift来写一个小分类, 具体代码如下(代码比较简单, 就没有放到github上, 直接复制使用即可)

• 效果图

Swift下拉北极放大.gif

• 使用方法

        // 添加header
        let headFrame = CGRect(x: 0, y: 0, width: size.width, height: 150)
        tableView.wg_setHeaderView(frame: headFrame, image: UIImage.init(named: "banner"))

• 分类文件: WGTableViewHeadView.swift

//
//  WGTableViewHeadView.swift
//  WGTableView
//
//  Created by Alex William on 2017/2/15.
//  Copyright © 2017年 ShenZhenQinJin. All rights reserved.
//

import UIKit
import Foundation

var wg_orininalFrame = "wg_orininalFrame"
var wg_imageView = "wg_imageView"
//let WG_CONTENYOFFSET = "WG_CONTENYOFFSET"

extension UITableView {
/*
     // 参数1: 源对象
     // 参数2: 关键字: 关键字是一个void类型的指针. 每一个关联的关键字都需要时唯一的, 所以, 一般都会定义成静态变量来作为关键字
     // 参数3: 关联的对象
     // 参数4: 策略: 表示相关的对象是通过赋值, 保留引用还是复制的方式进行关联的, 或者这种关联是原子性还是非原子性, 关联策略是通过使用宏定义常量来表示的
     objc_setAssociatedObject(id object, const void *key, id value, objc_AssociationPolicy policy)
     
*/
    
    // public: 表示全局共享, 并且能被继承
    public func wg_setHeaderView(frame: CGRect, image: UIImage?) {
    
        // 创建关联(frame)
        objc_setAssociatedObject(self, &wg_orininalFrame, frame, .OBJC_ASSOCIATION_RETAIN)
        
        // 创建headerView
        let header = UIView.init(frame: frame)
        self.tableHeaderView = header
        
        // 背景图片
        let bgImg = UIImageView.init(frame: frame)
        bgImg.image = image
        bgImg.contentMode = .scaleAspectFill
        self.insertSubview(bgImg, at: 0)
        
        // 创建关联(image)
        objc_setAssociatedObject(self, &wg_imageView, bgImg, .OBJC_ASSOCIATION_RETAIN)
        
        // KVC监听(注意:字符串必须是contentOffset)
        self.addObserver(self, forKeyPath: "contentOffset", options: .new, context: nil)
    }
    
    // 只要有新值变化就会调用该方法
    open override func observeValue(forKeyPath keyPath: String?, of object: Any?, change: [NSKeyValueChangeKey : Any]?, context: UnsafeMutableRawPointer?) {
        
        // 获取关联的对象
        let orginal = objc_getAssociatedObject(self, &wg_orininalFrame) as? CGRect
        let img = objc_getAssociatedObject(self, &wg_imageView) as? UIImageView
        
        // 偏移量
        let offset = self.contentOffset.y
        if offset<0 {
            
            img?.frame = CGRect.init(x: offset, y: offset, width: (orginal?.size.width)!-2*offset, height: (orginal?.size.height)!-offset)
        }else{
            img?.frame = orginal!
        }
    }
}

注意点: 项目中有一个地方需要注意: 就是KVO监听方法中的字符串不能写错, 否则就会没有效果

• 控制器文件: ViewController.swift

//
//  ViewController.swift
//  WGTableView
//
//  Created by Alex William on 2017/2/15.
//  Copyright © 2017年 ShenZhenQinJin. All rights reserved.
//

import UIKit

class ViewController: UIViewController {

    var labels = ["秦金客服", "QQ交流群", "微信公众号", "秦金官网", "去评分", "用户协议", "iOS开发", "版本更新", "3G/4G", "非Wifi", ]
    var detialLabels = ["445-66888-333", "1509159596", "grbank", "www.grbank.com", "", "5个", "Alex", "V.1.0", "", ""]
    
    
    override func viewDidLoad() {
        super.viewDidLoad()

        title = "UITableViewCell测试";
        let size = UIScreen.main.bounds.size
        
        let frame = CGRect(x: 0, y: 64, width: self.view.frame.size.width, height: self.view.frame.size.height - 64)
        let tableView = UITableView.init(frame: frame, style: .plain)
        view.addSubview(tableView)
        tableView.delegate = self
        tableView.dataSource = self
        tableView.backgroundColor = UIColor.white
        
        let footer = UIView()
        footer.backgroundColor = UIColor.white
        tableView.tableFooterView = footer
        
        // 添加header
        let headFrame = CGRect(x: 0, y: 0, width: size.width, height: 150)
        tableView.wg_setHeaderView(frame: headFrame, image: UIImage.init(named: "banner"))
    }
}

// MARK: UITableViewDataSource
extension ViewController: UITableViewDataSource {
    
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        
        return labels.count
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        
        let CELLID = "CELLID"
        var cell = tableView.dequeueReusableCell(withIdentifier: CELLID)
        if cell == nil {
            
            cell = UITableViewCell(style: .value1, reuseIdentifier: CELLID)
            cell?.textLabel?.text = labels[indexPath.row]
            cell?.detailTextLabel?.text = detialLabels[indexPath.row]
        }
        
        return cell!
    }
}


// MARK: UITableViewDelegate
extension ViewController: UITableViewDelegate {

    func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        
        print("你点击了第\(indexPath.row)个cell")
    }
}

知识拓展

• 关联objc_setAssociatedObjc

 关联
 1, objc_setAssociatedObject、
 
 2, objc_getAssociatedObject、
 
 3, objc_removeAssociatedObjects
 
 关联: 关联就是把两个对象相互关联起来,从而使得其中的一个对象成为另一个对象的一部分
 注意: 关联只能在版本10.6以及以上的版本才能使用
 
 一, 在类的定义之外为类增加额外的存储空间
 
 关联都是基于关键字的, 所以我们可以为任意的对象添加任意多的关联对象, 注意关联是可以保证被关联对象在整个生命周期都是可用的, 即使在垃圾回收机制下也不会造成资源不可回收的情况.
 同时, 使用关联我们可以不再修改类的定义来为其增加存储空间.
 
 二, 创建关联
 创建关联需要使用到Runtime运行时的函数: objc_setAssocicatedObjc
 使用objc_setAssocicatedObjc将某个对象与另一个对象进行关联,
// 参数1: 源对象
// 参数2: 关键字: 关键字是一个void类型的指针. 每一个关联的关键字都需要时唯一的, 所以, 一般都会定义成静态变量来作为关键字
// 参数3: 关联的对象
// 参数4: 策略: 表示相关的对象是通过赋值, 保留引用还是复制的方式进行关联的, 或者这种关联是原子性还是非原子性, 关联策略是通过使用宏定义常量来表示的
 
 objc_setAssociatedObject(id object, const void *key, id value, objc_AssociationPolicy policy)
 
 获取相关联的对象:objc_getAssociatedObjc
 eg: 
 
 // 参数1:  源对象
 // 参数2:  关键字:
NSString *getAssociatedObjc = (NSString *)objc_getAssociatedObject(id object, const void *key);
 
 断开连接: objc_setAssocicatedObjc, 只需要将关联的对象传入一个nil即可
 objc_setAssociatedObject(源对象, 关键字, nil, 策略)

总结

如何利用好自己的碎片时间, 需要有计划, 有激情. 每天保证自己能学到新东西,将自己的时间充分利用好, 能力才会不断提升.