使用Facebook开源代码FBShimmering封装进度显示的ShimmeCircleView

效果图:

静态图:

源码:

ShimmeCircleView.h 与 ShimmeCircleView.m

//
//  ShimmeCircleView.h
//  YouXianMingClock
//
//  Created by YouXianMing on 14-10-13.
//  Copyright (c) 2014年 YouXianMing. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface ShimmeCircleView : UIView

/**
 *  时候开启闪光效果,默认是 NO
 */
@property (nonatomic, assign) BOOL             shimmering;

/**
 *  当 shimmering 开启时,进入到闪光状态中的动画时间,默认值是 0.3.
 */
@property (nonatomic, assign) CFTimeInterval   shimmeringBeginFadeDuration;

/**
 *  当 shimmering 结束时,从闪光动画退出到正常的时间,默认值是 0.3.
 */
@property (nonatomic, assign) CFTimeInterval   shimmeringEndFadeDuration;

/**
 *  The opacity of the content before it is shimmering. Defaults to 0.3.
 */
@property (nonatomic, assign) CGFloat          shimmeringOpacity;

/**
 *  The time interval between shimmerings in seconds. Defaults to 0.6.
 */
@property (nonatomic, assign) CFTimeInterval   shimmeringPauseDuration;

/**
 *  圆的颜色,默认为红色
 */
@property (nonatomic, assign) UIColor         *shapeColor;

/**
 *  圆的线宽度,默认为1
 */
@property (nonatomic, assign) CGFloat          shapeLineWidth;

/**
 *  动画时间间隔
 */
@property (nonatomic, assign) CFTimeInterval   strokeAnimationDuration;

/**
 *  更新shapeLayer(修改后必须更新path才能够生效)
 */
- (void)updateShapeLayer;

- (void)doPOPBasicEndAnimationToValue:(CGFloat)value;
- (void)doPOPBasicStartAnimationToValue:(CGFloat)value;

@end
//
//  ShimmeCircleView.m
//  YouXianMingClock
//
//  Created by YouXianMing on 14-10-13.
//  Copyright (c) 2014年 YouXianMing. All rights reserved.
//

#import "ShimmeCircleView.h"
#import "FBShimmering.h"
#import "FBShimmeringLayer.h"
#import "FBShimmeringView.h"
#import "POP.h"

/**
 *  将角度转换为弧度
 *
 *  @param d 角度
 *
 *  @return 弧度
 */
#define DEGREES__TO__RADIANS(d)  ((d) * M_PI / 180.f)

@interface ShimmeCircleView ()

{
    CAShapeLayer       *_shapeLayer; // 形状的layer
    FBShimmeringLayer  *_showLayer;  // 辉光的layer
}

@end

@implementation ShimmeCircleView

- (instancetype)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        // 创建FBShimmeringLayer
        if (_showLayer == nil) {
            _showLayer                             = [FBShimmeringLayer new];
            _showLayer.frame                       = self.bounds;
            _showLayer.position                    = self.center;
            _showLayer.shimmering                  = NO;          // 默认设置关闭
            _showLayer.shimmeringBeginFadeDuration = 0.3;         // 开始进入闪光时候的时间
            _showLayer.shimmeringEndFadeDuration   = 0.3;         // 从闪光进入没有闪光时候的时间
            _showLayer.shimmeringOpacity           = 0.3;
            _showLayer.shimmeringPauseDuration     = 0.6f;
            [self.layer addSublayer:_showLayer];
        }

        // 制造形状的layer
        if (_shapeLayer == nil) {
            _shapeLayer             = [CAShapeLayer layer];
            _shapeLayer.lineWidth   = 1.f;
            _shapeLayer.strokeEnd   = 0.f;
            _shapeLayer.strokeColor = [UIColor redColor].CGColor;
            _shapeLayer.fillColor   = [UIColor clearColor].CGColor;   // 设置填充颜色为透明
            _shapeLayer.path        = [self createCirclePath].CGPath;
            _showLayer.contentLayer = _shapeLayer;
        }
    }
    return self;
}

- (void)updateShapeLayer
{
    if (_shapeColor) {
        _shapeLayer.strokeColor = _shapeColor.CGColor;
    }

    if (_shapeLineWidth > 0) {
        _shapeLayer.lineWidth = _shapeLineWidth;
        _shapeLayer.path      = [self createCirclePath].CGPath; // 更新path
    }
}

- (void)doPOPBasicEndAnimationToValue:(CGFloat)value
{
    [self doStrokeEndAnimationFromValue:_shapeLayer.strokeEnd
                                toValue:value
                             shapeLayer:_shapeLayer
                               duration:(_strokeAnimationDuration > 0 ? _strokeAnimationDuration : 0.4f)
                     timingFunctionName:nil];
}

- (void)doPOPBasicStartAnimationToValue:(CGFloat)value
{
    [self doStrokeStartAnimationFromValue:_shapeLayer.strokeStart
                                  toValue:value
                               shapeLayer:_shapeLayer
                                 duration:(_strokeAnimationDuration > 0 ? _strokeAnimationDuration : 0.4f)
                       timingFunctionName:nil];
}

/**
 *  根据frame值创建圆形的贝塞尔曲线
 *
 *  @return 圆形的贝塞尔曲线
 */
- (UIBezierPath *)createCirclePath
{
    UIBezierPath *path =         [UIBezierPath bezierPathWithArcCenter:CGPointMake(self.bounds.size.height / 2.f,
                                                          self.bounds.size.width / 2.f)
                                       radius:self.bounds.size.height / 2.f - _shapeLayer.lineWidth / 2.f
                                   startAngle:DEGREES__TO__RADIANS(-90)
                                     endAngle:DEGREES__TO__RADIANS(270)
                                    clockwise:YES];

    return path;
}

#pragma mark - 重写各种setter方法
/**
 *  重写shimmering的setter,getter方法
 */
@synthesize shimmering = _shimmering;
- (BOOL)shimmering {
    return _shimmering;
}
- (void)setShimmering:(BOOL)shimmering {
    _shimmering = shimmering;
    _showLayer.shimmering = shimmering;
}

/**
 *  重写shimmeringBeginFadeDuration的setter,getter方法
 */
@synthesize shimmeringBeginFadeDuration = _shimmeringBeginFadeDuration;
- (CFTimeInterval)shimmeringBeginFadeDuration {
    return _shimmeringBeginFadeDuration;
}
- (void)setShimmeringBeginFadeDuration:(CFTimeInterval)shimmeringBeginFadeDuration {
    _shimmeringBeginFadeDuration = shimmeringBeginFadeDuration;
    _showLayer.shimmeringBeginFadeDuration = shimmeringBeginFadeDuration;
}

/**
 *  重写shimmeringEndFadeDuration的setter,getter方法
 */
@synthesize shimmeringEndFadeDuration = _shimmeringEndFadeDuration;
- (CFTimeInterval)shimmeringEndFadeDuration {
    return _shimmeringEndFadeDuration;
}
- (void)setShimmeringEndFadeDuration:(CFTimeInterval)shimmeringEndFadeDuration {
    _shimmeringEndFadeDuration = shimmeringEndFadeDuration;
    _showLayer.shimmeringEndFadeDuration = shimmeringEndFadeDuration;
}

/**
 *  重写shimmeringOpacity的setter,getter方法
 */
@synthesize shimmeringOpacity = _shimmeringOpacity;
- (CGFloat)shimmeringOpacity {
    return _shimmeringOpacity;
}
- (void)setShimmeringOpacity:(CGFloat)shimmeringOpacity {
    _shimmeringOpacity = shimmeringOpacity;
    _showLayer.shimmeringOpacity = shimmeringOpacity;
}

/**
 *  重写shimmeringPauseDuration的setter,getter方法
 */
@synthesize shimmeringPauseDuration = _shimmeringPauseDuration;
- (CFTimeInterval)shimmeringPauseDuration {
    return _shimmeringPauseDuration;
}
- (void)setShimmeringPauseDuration:(CFTimeInterval)shimmeringPauseDuration {
    _shimmeringPauseDuration = shimmeringPauseDuration;
    _showLayer.shimmeringPauseDuration = shimmeringPauseDuration;
}

#pragma mark - 私有方法

/**
 *  StrokeEnd动画
 *
 *  @param fromValue 初始值
 *  @param toValue   结束值
 *  @param layer     被动画的CAShapeLayer
 *  @param duration  动画时间
 *  @param name      动画时间类型,可以选择的类型如下:kCAMediaTimingFunctionLinear kCAMediaTimingFunctionEaseIn kCAMediaTimingFunctionEaseOut kCAMediaTimingFunctionEaseInEaseOut kCAMediaTimingFunctionDefault
 */
- (void)doStrokeEndAnimationFromValue:(CGFloat)fromValue
                              toValue:(CGFloat)toValue
                           shapeLayer:(CAShapeLayer *)layer
                             duration:(CFTimeInterval)duration
                   timingFunctionName:(NSString *)name
{
    POPBasicAnimation *pathAnimation = [POPBasicAnimation animationWithPropertyNamed:kPOPShapeLayerStrokeEnd];
    pathAnimation.duration           = duration;
    if (name) {
        pathAnimation.timingFunction = [CAMediaTimingFunction functionWithName:name];
    }
    pathAnimation.fromValue          = [NSNumber numberWithFloat:fromValue];
    pathAnimation.toValue            = [NSNumber numberWithFloat:toValue];
    [layer pop_addAnimation:pathAnimation forKey:nil];
}

/**
 *  StrokeStart动画
 *
 *  @param fromValue 初始值
 *  @param toValue   结束值
 *  @param layer     被动画的CAShapeLayer
 *  @param duration  动画时间
 *  @param name      动画时间类型,可以选择的类型如下:kCAMediaTimingFunctionLinear kCAMediaTimingFunctionEaseIn kCAMediaTimingFunctionEaseOut kCAMediaTimingFunctionEaseInEaseOut kCAMediaTimingFunctionDefault
 */
- (void)doStrokeStartAnimationFromValue:(CGFloat)fromValue
                                toValue:(CGFloat)toValue
                             shapeLayer:(CAShapeLayer *)layer
                               duration:(CFTimeInterval)duration
                     timingFunctionName:(NSString *)name
{
    POPBasicAnimation *pathAnimation = [POPBasicAnimation animationWithPropertyNamed:kPOPShapeLayerStrokeStart];
    pathAnimation.duration           = duration;
    if (name) {
        pathAnimation.timingFunction = [CAMediaTimingFunction functionWithName:name];
    }
    pathAnimation.fromValue          = [NSNumber numberWithFloat:fromValue];
    pathAnimation.toValue            = [NSNumber numberWithFloat:toValue];
    [layer pop_addAnimation:pathAnimation forKey:nil];
}

@end

以下是需要注意的地方:

以下是使用细节:

时间: 2024-11-05 06:24:41

使用Facebook开源代码FBShimmering封装进度显示的ShimmeCircleView的相关文章

bmp格式图像的读写函数(对一个开源代码的封装)

在网上看到一段读写bmp格式图像的代码,本文对这段代码分成两个函数封装起来方便使用,一个函数是读取bmp格式的图像,一个是向指定文件写入bmp格式的图像. 前提 我们不需要知道这段代码是如何读取bmp格式图像的,不需要知道bmp格式的图像时如何存储的,我们只需要知道有三个参数可以确定图像的尺寸大小,他们是图像的宽度.高度.通道数(例如灰度图像有一个通道,rgb图像有三个通道(rgb)).图像包含高度X宽度个像素,每个像素有相同的通道,他们在内存中按照一定的顺序存储,例如三通道bmp图像,在内存中

代码内存泄露检测(1) MLeaksFinder (Wechat开源) + FBRetainCycleDetector (FaceBook开源)

每次项目编译完成之后,都被内存搞得头昏脑胀,压力甚大. 利用两周时间,稍微研究了 微信开源的 MLeaksFinder 和 facebook 开源的 FBMemoryProfiler, 这两个开源三方,在编写过程中就可以检测内存泄露,实在是不要太方便-- 希望自己在下一个项目能用的得心应手-- 1.  微信 MLeaksFiner 如果对它,你还是不是很了解 ,可以到查阅这里:  http://wereadteam.github.io/2016/07/20/MLeaksFinder2/ ; 1.

160多个android开源代码汇总

第一部分 个性化控件(View) 主要介绍那些不错个性化的View,包括ListView.ActionBar.Menu.ViewPager.Gallery.GridView.ImageView.ProgressBar.TextView.ScrollView.TimeView.TipView.FlipView.ColorPickView.GraphView.UI Style等等..其他 一.ListView android-pulltorefresh一个强大的拉动刷新开源项目,支持各种控件下拉刷新

Android开源代码汇总

第一部分 个性化控件(View) 主要介绍那些不错个性化的View,包括ListView.ActionBar.Menu.ViewPager.Gallery.GridView.ImageView.ProgressBar.TextView.ScrollView.TimeView.TipView.FlipView.ColorPickView.GraphView.UI Style等等. .其他 一.ListView Android-pulltorefresh 一个强大的拉动刷新开源项目,支持各种控件下拉

iOS流行的开源代码库

本文介绍一些流行的iOS的开源代码库 1.AFNetworking 更新频率高的轻量级的第三方网络库,基于NSURL和NSOperation,支持iOS和OSX.https://github.com/AFNetworking/AFNetworking 2.GPUImage 图像处理库,基于OpenGL ES,图像处理效率高.https://github.com/BradLarson/GPUImage 3.Masonry 自动布局库.https://github.com/SnapKit/Mason

nginx上传模块nginx_upload_module和nginx_uploadprogress_module模块进度显示,如何传递GET参数等。

ownload:http://www.grid.net.ru/nginx/download/nginx_upload_module-2.2.0.tar.gzconfigure and make : ./configure --user=www --group=www --prefix=/usr/local/nginx --with-http_stub_status_module --with-http_ssl_module   --add-module=/data/software/lnmp1.

22个值得收藏的Android开源代码-UI篇

  FileBrowserView 一个强大的文件选择控件.界面比较漂亮,使用也很简单.特点:可以自定义UI:支持复制.剪切.删除.移动文件:可以用在Fragment.ativity.DialogFragment中:支持快速切换目录. 项目地址: https://github.com/psaravan/FileBrowserView MultiItemRowListAdapter 多列效果的ListView,采用重新包装adapter的方式,使你的ListView可以显示成多列,跟普通的List

android studio 打开github开源代码

1.最近下载的开源代码全是github来的,一直用eclipse开发,对于android studio来说是全新的 2.在eclipse导入一个工程那是so eassy, import选择一下就可以. 3.到了android studio里面,import 那就费多了. 导入几次都跟死了一样,只看到进度条动,其实Android Studio是在下载文件Gradle 尝试: 全新建一个Hello工程,搞定,没有任何问题,编译成功 工程的目录就是上面所示 打开工程,发现有几个地方跟下载的github

facebook开源项目集合

Facebook的开源大手笔 1. 开源Facebook平台代码 Facebook在2008年选择将该平台上的重要部分的代码和应用工具开源.Facebook称,平台已经基本发展成熟,此举可以让开发者更全面地理解整个Facebook平台,更容易地为Facebook开发应用软件,并可以回报社区. 该项目代号为“FBOpen”,其中包含了实现Facebook平台的一些基础设施.功能等,如API架构.FQL分析器.FBML分析器.FBJS,以及许多常用方法和标签的实现,代码基于PHP.这意味着其他开发者