zoukankan      html  css  js  c++  java
  • 自定义下拉刷新控件-CBStoreHouseRefreshControl

    本文转载至 http://www.cocoachina.com/ios/20141110/10177.html

    iOS开发自定义刷新CBStoreHouseRefres

    介绍

    这是一款在Storehouse启发下创作出来的控件,下拉刷新的时候可以完全定制自己想要的效果。来看效果图:

    1.gif

    通过plist文件你可以使用任何想要的形状,下面这张是作者所在公司的logo:

    2.gif

    安装

    CBStoreHouseRefreshControl依赖于CocoaPods,通过在你的Podfile中添加下面这行命令来安装:

    1
    pod "CBStoreHouseRefreshControl"

    当然你也可以直接把CBStoreHouseRefreshControl (.h .m) 和 BarItem (.h .m)文件直接拖到你的工程中去。

    用法

    只需要简单的使用下面这个方法你就可以将其添加到你的UIScrollView中,像使用UITableView和UICollectionView那样:

    1
    2
    3
    4
    5
    + (CBStoreHouseRefreshControl*)attachToScrollView:(UIScrollView *)scrollView
                                               target:(id)target
                                        refreshAction:(SEL)refreshAction
                                                plist:(NSString *)plist;
    self.storeHouseRefreshControl = [CBStoreHouseRefreshControl attachToScrollView:self.tableView target:self refreshAction:@selector(refreshTriggered:) plist:@"storehouse"];

    还可以设定更多的参数:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    + (CBStoreHouseRefreshControl*)attachToScrollView:(UIScrollView *)scrollView
                                               target:(id)target
                                        refreshAction:(SEL)refreshAction
                                                plist:(NSString *)plist
                                                color:(UIColor *)color
                                            lineWidth:(CGFloat)lineWidth
                                           dropHeight:(CGFloat)dropHeight
                                                scale:(CGFloat)scale
                                 horizontalRandomness:(CGFloat)horizontalRandomness
                              reverseLoadingAnimation:(BOOL)reverseLoadingAnimation
                              internalAnimationFactor:(CGFloat)internalAnimationFactor;
    self.storeHouseRefreshControl = [CBStoreHouseRefreshControl attachToScrollView:self.tableView target:self refreshAction:@selector(refreshTriggered:) plist:@"storehouse" color:[UIColor whiteColor] lineWidth:1.5 dropHeight:80 scale:1 horizontalRandomness:150 reverseLoadingAnimation:YES internalAnimationFactor:0.5];

    接下来就是在你的UIViewController中实现UIScrollViewDelegate,假如实现过就不必了。然后在刷新控件里传递调用。

    1
    2
    3
    4
    5
    6
    7
    8
    - (void)scrollViewDidScroll:(UIScrollView *)scrollView
    {
        [self.storeHouseRefreshControl scrollViewDidScroll];
    }
    - (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
    {
        [self.storeHouseRefreshControl scrollViewDidEndDragging];
    }

    最后,确保你已经实现了之前用来监听刷新触发器的refreshAction。

    1
    2
    3
    4
    5
    6
    - (void)refreshTriggered
    {
        //call your loading method here
        //Finshed loading the data, reset the refresh control
        [self.storeHouseRefreshControl finishedLoading];
    }

    想了解更多请看源码

    使用自定义图形

    CBStoreHouseRefreshControl中的图形使用BarItem来实现动画,每个BarItem会有自己的动画,你仅需要使用plist文件为其指定开始点starPoint和结束点endPoint。

    所有的BarItem共享的是以屏幕左上角为原点的坐标系,比如你要绘制一个正方形的话,plist文件就该这么写:

    3.png

    效果如下:

    4.gif

    注意

    确保为开始点startPoint和结束点endPoint都设置了正确的值。

    确保坐标的书写是{x,y}的形式

    使用loading或者是highlight的动画都会使得plist中所有BarItem按顺序高亮,而使用reverseLoadingAnimation则相反。

    @isaced同学提到,使用PaintCode来生成开始点和结束点会更轻松得多,具体介绍看这里

    配置方法

    color参数用于设置Baritem的颜色

    lineWidth则可以设置Baritem的宽度

    dropHeight用来设置控件的高度

    scale可以设置控件比例

    horizontalRandomness能改变Baritme的散开方式

    reverseLoadAnimation设置为YES的话可以Baritem的高亮顺序会颠倒

    internalAnimationFactor用于改变Baritem动画时间,如果设置为1,则所有Baritem一同消失或者出现。

  • 相关阅读:
    macOS 常用配置
    maven 常用配置
    log4j(1.x)最全配置!!!
    Python2 中 input() 和 raw_input() 的区别
    用 Maven 构建 Java-Scala 混合项目
    trim() 的秘密
    【目录】一起来学 Kafka 吧
    Spring in Action.4th
    Hibernate快速入门
    html2canvas 跨域图片无法正常加载问题解决办法
  • 原文地址:https://www.cnblogs.com/Camier-myNiuer/p/4116003.html
Copyright © 2011-2022 走看看