CYLTableViewPlaceHolder - 一行代码完成“空TableView占位视图”管理

jopen 9年前

导航

  1. 与其他框架的区别
  2. 集成后的效果
  3. 使用CYLTableViewPlaceHolder
  4. 运行Demo
  5. 适用于多种应用应用场景
    1. 网络故障
    2. 暂无数据
    </li> </ol>

    与其他框架的区别

    - 特点 解释
    1 轻量级、无污染 基于 UITableView 分类,无污染,比基于子类化、继承的框架更加轻量级
    2 低耦合 自定义占位视图的可自行实现,通过协议传递,耦合性极低。
    3 简单,无学习成本 一行代码完成,仅需使用 cyl_reloadData 代替 reloadData 即可。自动检测是否需要 addSubviewremoveFromSuperview ,省去学习繁琐的 add 和 remove 的调用时机。
    4 使用方法简单 CYLTableViewPlaceHolder 基于 dataSource 数据源,所以只需操作 dataSource 数据源,即可完成占位视图的 addSubviewremoveFromSuperview 的时机,更加直观。搭配 MJRefresh 使用十分方便,demo 中也给出了搭配使用方法。
    5 支持CocoaPods 容易集成

    (学习交流群:523070828)

    集成后的效果

    集成后的效果

    使用CYLTableViewPlaceHolder

    三步完成:

    1. 第一步:使用cocoaPods导入CYLTableViewPlaceHolder
    2. 第二步:遵循协议
    3. 第三步:使用cyl_reloadData代替reloadData

    第一步:使用CocoaPods导入CYLTableViewPlaceHolder

    Podfile 中进行如下导入:

    pod 'CYLTableViewPlaceHolder'

    然后使用 cocoaPods 进行安装:

    如果尚未安装 Cocoapods, 运行以下命令进行安装:

    gem install cocoapods

    安装成功后就可以安装依赖了:

    建议使用如下方式:

    # 禁止升级CocoaPods的spec仓库,否则会卡在 Analyzing dependencies ,非常慢    pod update --verbose --no-repo-update

    如果提示找不到库,则可去掉 --no-repo-update

    pod update

    第二步:遵循协议

    导入头文件

    #import "CYLTableViewPlaceHolder.h"

    遵循协议

    @interface ViewController ()<CYLTableViewPlaceHolderDelegate>

    实现协议方法:

    仅一个必须实现的协议方法:

    创建一个自定义的占位视图并返回

    @required  /*!   @brief  make an empty overlay view when the tableView is empty   @return an empty overlay view   */  - (UIView *)makePlaceHolderView;

    这里注意两点:

    1. CYLTableViewPlaceHoldercyl_reloadData方法内部会重新将该占位视图的 frame 进行设置,设置为与当前的的 TableView 一致:包括 xy 坐标和宽高。防止 TableView 位置或尺寸的变更。
    2. 以上步骤,包括遵循协议实现协议方法,既可以在自定义的 TableView 中去做,也可以在 TableView 的代理中去做。

      既可以让代理遵循协议,实现协议方法:

      @interface ViewController ()<CYLTableViewPlaceHolderDelegate>

      也可以让自定义的 TableView 遵循协议,实现协议方法:

      @interface MyTableView ()<CYLTableViewPlaceHolderDelegate>

      这里推荐在自定义的 TableView 中实现,以降低耦合性,同时也可以为 Controller 瘦身。

    占位视图的点击事件等,请自行在 - (UIView *)makePlaceHolderView; 中所创建的 View 中实现。

    另外,占位视图默认的设置是不能滚动的,也就不能下拉刷新了,但是如果想让占位视图可以滚动,则需要实现下面的可选代理方法。

    @optional  /*!   @brief enable tableView scroll when place holder view is showing,it is disabled by default.   @attention There is no need to return  NO , it will be NO by default   @return enable tableView scroll, you can only return YES   */  - (BOOL)enableScrollWhenPlaceHolderViewShowing;

    第三步:使用cyl_reloadData代替reloadData

    使用方法:

    仅需使用 cyl_reloadData 代替 reloadData 即可。

    [self.tableView cyl_reloadData];

    注意: cyl_reloadData 内部已经实现了 [self.tableView reloadData]; 方法,请避免重复调用。

    运行Demo

    demo 的刷新组件使用的是 MJRefresh,所以需要导入相应的 CocoaPods 库

    # 打开终端,进入 clone 的文件夹  cd /Users/YourUserName/Documents/CYLTableViewPlaceHolder  # 如果提示找不到库,则可去掉 --no-repo-update  pod install --verbose --no-repo-update   open CYLTableViewPlaceHolder.xcworkspace

    适用于多种应用应用场景

    CYLTableViewPlaceHolder 是基于 dataSource 数据源是否为空,所以只需操作 dataSource 数据源,即可完成占位视图的 。只要为空就会触发。并且每次在操作占位视图的addSubviewremoveFromSuperview时,每次都会将旧的销毁,并触发- (UIView *)makePlaceHolderView` 创建一个新的视图。如果在该方法中进行 if 判断,也就能适用于不同的场景。

    1. 网络故障
      1. 网络不可用,禁止重新加载
      </li>
    2. 暂无数据
    3. </ol>

      网络故障

      适用于那些造成 dataSource 为空的原因只能是网络故障,比如首页、团购列表、商品列表等

      比如

      携程 网络故障 携程 网络故障 携程 网络故障
      应用场景之加载失败--携程 应用场景之加载失败--携程 应用场景之加载失败--携程

      代码实现时直接返回网络故障占位视图,用伪代码表示则是:

      - (UIView *)makePlaceHolderView {          return NetNotAvailableView;  }

      网络不可用,禁止重新加载

      如果此时检测到网络断开可以禁止用户刷新的行为,比如:

      QQ空间 苏宁易购 嘟嘟美甲
      应用场景之加载失败 应用场景之加载失败 应用场景之加载失败

      暂无数据

      适用于那些造成 dataSource 为空的原因不仅有网络故障,也可能是确实是服务端也没有数据,这种场景下需要判断下当前网络再返回占位视图,比如:

      App 暂无数据 网络故障
      百度传课 应用场景之暂无数据 应用场景之加载失败
      暂无数据 暂无数据(美团)
      应用场景之暂无数据 应用场景之暂无数据

      代码实现,用伪代码表示则是:

      - (UIView *)makePlaceHolderView {      if (NetNotAvailable) {          return NetNotAvailableView;      } else {          return NoDataView;      }  }

      网络不可达场景

      - 应用场景之加载失败 ---
      应用场景之加载失败 应用场景之加载失败 应用场景之加载失败
      应用场景之加载失败 应用场景之加载失败 应用场景之加载失败
      应用场景之加载失败 应用场景之加载失败 应用场景之加载失败
      应用场景之加载失败 应用场景之加载失败 应用场景之加载失败
      应用场景之加载失败 应用场景之加载失败 应用场景之加载失败
      应用场景之加载失败 应用场景之加载失败 应用场景之加载失败
      应用场景之加载失败 应用场景之加载失败 应用场景之加载失败
      应用场景之加载失败 应用场景之加载失败 应用场景之加载失败
      应用场景之加载失败 应用场景之加载失败 应用场景之加载失败
      应用场景之加载失败 应用场景之加载失败 应用场景之加载失败
      应用场景之加载失败 应用场景之加载失败 应用场景之加载失败

      (更多iOS开发干货,欢迎关注 微博@iOS程序犭袁


      Posted by 微博@iOS程序犭袁
      原创文章,版权声明:自由转载-非商用-非衍生-保持署名 | Creative Commons BY-NC-ND 3.0



      项目地址: https://github.com/ChenYilong/CYLTableViewPlaceHolder