Swift 使用SnapKit实现 UICollectionViewCell 高度自适应

来源:互联网 发布:javascript教程 编辑:程序博客网 时间:2024/05/17 01:47

问题

在我们的日常开发中,经常会使用到UICollectionViewCell、UITableViewCell的自适应。

解决方案

之前的MVC开发中,使用SnapKit 处理UICollectionViewCell 高度自适应的问题后,一直想抽时间整理一下,下面就用部分的代码,解释一下 我这边处理的思路。

Controller

////  TaskVC.swift//  BossClient////  Created by qingxun on 2017/12/12.//  Copyright © 2017年 吕陈强. All rights reserved.//import UIKitclass TaskVC: BaseViewController {    fileprivate var dataArr:[TaskItemModel] = {        var data = [TaskItemModel]()        let model1 = TaskItemModel()        model1.name = "123"        model1.content = "123123123123123123123123123123123123123123123123123123123123123123";        data.append(model1);        let model2 = TaskItemModel()        model2.name = "5446"        model2.content = "3453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453451231345345345345345345345";        data.append(model2);        let model3 = TaskItemModel()        model3.name = "123"        model3.content = "123123123123123123123123123123123123123123123123123123123123123123";        data.append(model3);        let model4 = TaskItemModel()        model4.name = "5446"        model4.content = "3453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453453451231345345345345345345345";        data.append(model4);        let model5 = TaskItemModel()        model5.name = "qweqwe"        model5.content = "qweqweqwedasdqwewqeasdasdwqeqweasdasdqweqweasdasdweqweadasdqweqweasdasdqweqweasdadwqeqwasdasdadasdasdweqweqweqasdasdasdasdasdweqeqweqasd";        data.append(model5);        return data;    }()    //MARK:-滚动视图    lazy var collectionView:UICollectionView = { [unowned self] in        let flow = UICollectionViewFlowLayout();        //垂直滚动        flow.scrollDirection = .vertical        //最小行间距(当垂直布局时是行间距,当水平布局时可以理解为列间距)        flow.minimumLineSpacing = NEWHEIGHT(10);        //两个单元格之间的最小间距        flow.minimumInteritemSpacing = NEWWIDTH(10);        flow.estimatedItemSize = CGSize(width: kScreenW, height: NEWHEIGHT(150));//        flow.itemSize =         let collectionView = UICollectionView(frame: M_RECT(0, y: NEWHEIGHT(100), w: kScreenW, h: kScreenH - 64 - NEWHEIGHT(100)), collectionViewLayout: flow);        collectionView.delegate = self;        collectionView.dataSource = self;        collectionView.isScrollEnabled = true;        //        collectionView.alwaysBounceVertical = false;//        collectionView.contentInset = UIEdgeInsets(top: 0, left:0, bottom: NEWHEIGHT(20), right: NEWWIDTH(0));        collectionView.showsVerticalScrollIndicator = false;        collectionView.showsHorizontalScrollIndicator  = false;        collectionView.backgroundColor = UIColor.white;        collectionView.register(TaskItemCell.self, forCellWithReuseIdentifier: "TaskItemCell");        return collectionView;        }();    override func viewDidLoad() {        super.viewDidLoad()        self.navigationItem.title = "任务列表";        setupUI();        // Do any additional setup after loading the view.    }    override func didReceiveMemoryWarning() {        super.didReceiveMemoryWarning()        // Dispose of any resources that can be recreated.    }}extension TaskVC{    fileprivate func setupUI(){        self.view.addSubview(self.collectionView);        self.collectionView.snp.makeConstraints { (make) in            make.left.right.top.bottom.equalTo(self.view);        }    }}//MARK:-滚动视图的代理事件extension TaskVC:UICollectionViewDelegate,UICollectionViewDataSource,UICollectionViewDelegateFlowLayout{    //集合视图的协议方法 dataSource    /**     返回每个分组有几个数据     */    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int{        return self.dataArr.count;    }    /**     返回有几个分组     */    func numberOfSections(in collectionView: UICollectionView) -> Int    {        return 1;    }    /**     返回cell     */    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell    {        let model = self.dataArr[indexPath.row];        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "TaskItemCell", for: indexPath) as! TaskItemCell;        cell.valueData = model;        return cell;    }    //选中的cell    func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath)    {    }//    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize//    {//        //        return  CGSize(width: kScreenW, height:NEWHEIGHT(150));//    }   }

Model

import UIKitclass TaskItemModel: BaseModel {    var name:String = ""    var content:String = ""    var time:String = ""}

View

////  TaskItemCell.swift//  BossClient////  Created by qingxun on 2017/12/18.//  Copyright © 2017年 吕陈强. All rights reserved.//import UIKitclass TaskItemCell: UICollectionViewCell {    var valueData:TaskItemModel! {        didSet{            self.nameLab.text = valueData.name;            self.messageLab.text = valueData.content;        }    }   fileprivate lazy var iconImageV:UIImageView = {        let imageV = UIImageView()        imageV.image = #imageLiteral(resourceName: "user_icon");        return imageV;    }()   fileprivate lazy var nameLab:UILabel = {        let lab = UILabel()        lab.textColor = UIColor.black;        lab.font = FONT(14);        lab.text = "黄君";        return lab;    }()   fileprivate lazy var messageLab:UILabel = {        let lab = UILabel()        lab.textColor = kTextPlaceHolderColor;        lab.font = FONT(14);        lab.text = "捐献爱心"        lab.textAlignment = .left        lab.lineBreakMode = .byClipping;        lab.numberOfLines = 0;        //        lab.backgroundColor = UIColor.red        return lab;    }()   fileprivate lazy var timeLab:UILabel = {        let lab = UILabel()        lab.textColor = kTextPlaceHolderColor;        lab.font = FONT(22);        lab.text = "五分钟前"        lab.textAlignment = .right        lab.lineBreakMode = .byClipping;        return lab;    }()    fileprivate  lazy  var bottomLine:UIView = {        let line = UIView()        line.backgroundColor = kLineColor;        return line;    }()    override init(frame: CGRect) {        super.init(frame: frame);                setupUI();    }    override func preferredLayoutAttributesFitting(_ layoutAttributes: UICollectionViewLayoutAttributes) -> UICollectionViewLayoutAttributes {     return super.preferredLayoutAttributesFitting(layoutAttributes);    }    required init?(coder aDecoder: NSCoder) {        fatalError("init(coder:) has not been implemented")    }}//MARK:初始化UIextension TaskItemCell{    fileprivate func setupUI(){        self.addSubview(self.iconImageV);        self.iconImageV.snp.makeConstraints { (make) in            make.leftMargin.equalTo(kLeftMargin);            make.topMargin.equalTo(kTopMargin);            make.width.height.equalTo(NEWWIDTH(80));        }        self.addSubview(self.nameLab);        self.nameLab.snp.makeConstraints { (make) in            make.left.equalTo(self.iconImageV.snp.right).offset(NEWWIDTH(20));            make.top.equalTo(self.iconImageV.snp.top);            make.height.equalTo(NEWHEIGHT(30));            make.width.equalTo(NEWWIDTH(400));        }        self.addSubview(self.messageLab);        self.messageLab.snp.makeConstraints { (make) in            make.left.right.equalTo(self.nameLab);            make.top.equalTo(self.nameLab.snp.bottom).offset(NEWHEIGHT(10));            make.height.greaterThanOrEqualTo(NEWHEIGHT(30));            make.bottom.equalTo(self.snp.bottom).offset(-NEWHEIGHT(20));        }        self.addSubview(self.bottomLine);        self.bottomLine.snp.makeConstraints { (make) in            make.left.right.bottom.equalTo(self)            make.height.equalTo(1);        }    }}

在上面的代码中,我们在Controller中,
这里写图片描述

这里写图片描述

这里写图片描述

这里写图片描述

这里写图片描述

Model中就没有什么介绍的了。

在View中,介绍几点就是
这里写图片描述

这里写图片描述

这里写图片描述

最终的UI效果

这里写图片描述

原创粉丝点击