用POP动画编写带富文本的自定义动画效果

【源码】

https://github.com/YouXianMing/UI-Component-Collection

【效果】

【特点】

* 支持富文本

* 可定制型强(继承父类重写父类的startAnimation方法即可)

* 支持动画的中断与持续

* 支持CAMediaTimingFunction

* 数据与UI隔离,便于你封装属于你的类

【核心】

//
// POPNumberCount.h
// POP
//
// Created by XianMingYou on 15/4/10.
// Copyright (c) 2015年 XianMingYou. All rights reserved.
// #import <Foundation/Foundation.h>
#import "POP.h" @class POPNumberCount; @protocol POPNumberCountDelegate <NSObject>
@optional
/**
* 最原始的方法
*
* @param numberCount 对象自己
* @param number 变化的值
*/
- (void)numberCount:(POPNumberCount *)numberCount currentNumber:(NSNumber *)number; /**
* 子类可以实现的方法
*
* @param numberCount 对象自己
* @param string 子类返回的富文本
*/
- (void)numberCount:(POPNumberCount *)numberCount currentAttributedString:(NSAttributedString *)string; /**
* 子类可以实现的方法
*
* @param numberCount 对象自己
* @param string 子类返回的文本
*/
- (void)numberCount:(POPNumberCount *)numberCount currentString:(NSString *)string; @end @interface POPNumberCount : NSObject @property (nonatomic, weak) id<POPNumberCountDelegate> delegate; // 代理 @property (nonatomic, assign) CGFloat fromValue; // 开始值
@property (nonatomic, assign) CGFloat toValue; // 结束值
@property (nonatomic, assign) CGFloat currentValue; // 当前值
@property (nonatomic, assign) NSTimeInterval duration; // 持续时间 @property (nonatomic, strong) CAMediaTimingFunction *timingFunction; // 时间函数
@property (nonatomic, strong) POPBasicAnimation *conutAnimation; /*
* 存储值(执行动画之前,请先将设置的值进行存储)
*/
- (void)saveValues; /*
* 开始动画(继承的子类需要重写本方法来,然后与代理一起配合使用)
*/
- (void)startAnimation; /*
* 停止动画
*/
- (void)stopAnimation; @end
//
// POPNumberCount.m
// POP
//
// Created by XianMingYou on 15/4/10.
// Copyright (c) 2015年 XianMingYou. All rights reserved.
// #import "POPNumberCount.h"
#import "ConfigAttributedString.h" @implementation POPNumberCount - (instancetype)init {
self = [super init];
if (self) {
self.conutAnimation = [POPBasicAnimation animation];
}
return self;
} - (void)saveValues {
self.conutAnimation.fromValue = @(self.fromValue);
self.conutAnimation.toValue = @(self.toValue);
self.conutAnimation.duration = (self.duration <= ? 0.4f : self.duration);
if (self.timingFunction) {
self.conutAnimation.timingFunction = self.timingFunction;
}
} - (void)startAnimation {
// 只有执行了代理才会执行计数引擎
if (self.delegate && [self.delegate respondsToSelector:@selector(numberCount:currentNumber:)]) {
/* 将计算出来的值通过writeBlock动态给控件设定 */
self.conutAnimation.property = \
[POPMutableAnimatableProperty propertyWithName:@"conutAnimation"
initializer:^(POPMutableAnimatableProperty *prop) {
prop.writeBlock = ^(id obj, const CGFloat values[]) {
NSNumber *number = @(values[]);
_currentValue = values[]; /* ------------- 子类重写父类的这个方法 ------------- */
[_delegate numberCount:self currentNumber:number];
/* ---------------------------------------------- */
};
}]; // 添加动画
[self pop_addAnimation:self.conutAnimation forKey:nil];
}
} - (void)stopAnimation {
[self pop_removeAllAnimations];
} @end

【说明】

父类  POPNumberCount 的设计类似于设计模式中的策略模式,提供接口让子类重写来实现不一样的功能,父类基本不会修改,具体到某个子类,只需要修改子类中的特定实现即可。(父类中的协议类似于一个个策略,具体由子类来实现)

用POP动画编写带富文本的自定义动画效果的更多相关文章

  1. Think PHP 完整的带富文本格式以及图片上传,并且在页面上分页展示

    Think php6.0官网网址:序言 · ThinkPHP6.0完全开发手册 · 看云 (kancloud.cn) 下面是基础配置 第一步:创建TP框架,命名为tp composer create- ...

  2. 关于百度Editor富文本编辑器 自定义上传位置

    因为要在网站上编辑富文本数据,所以直接采用百度的富文本编辑器,但是这个编辑器有个缺点,默认情况下,文件只能上传到网站的根目录,不能自定义路径. 而且json配置文件只能和controller.jsp在 ...

  3. UI设计篇·入门篇·简单动画的实现,透明动画/旋转动画/移动动画/缩放动画,混合动画效果的实现,为动画设置监听事件,自定义动画的方法

    基本的动画构成共有四种:透明动画/旋转动画/移动动画/缩放动画. 配置动画的方式有两种,一种是直接使用代码来配置动画效果,另一种是使用xml文档配置动画效果 相比而言,用xml文档写出来的动画效果,写 ...

  4. 适用于 Mpvue 的微信小程序富文本解析自定义组件

    废话不多说,直接上方法: 首先 npm 安装 mpvue-wxparse npm i mpvue-wxparse 接下来:使用 <template> <div> <wxP ...

  5. Extjs6 编写自己的富文本组件(以ueditor为基础)

    一.下载ueditor 地址:http://ueditor.baidu.com/website/ 二.将ueitor资源引入自己的项目 在index.html中引入ueditor.config.js. ...

  6. 富文本编辑器UEditor自定义工具栏(二、插入图片、音频、视频个性化功能按钮和弹层及自定义分页符)

    导读:本篇将简单探讨插入图片.音频.视频的功能按钮实现方式 传送门:富文本编辑器UEditor自定义工具栏(一.基础配置与字体.背景色.行间距.超链接实现) 一.效果图 1.UEditor自定义工具栏 ...

  7. java通过freemarker导出包含富文本图片的word文档

    废话不多说,进入正题! 本文重点在于:对富文本图片的导出(基础的freemarker+word模板导出这里不做详细解说哈) 参考文章:http://www.cnblogs.com/liaofeifig ...

  8. 编写带有点击特效的UIButton

    编写带有点击特效的UIButton 效果: 源码: // // ViewController.m // Button // // Created by XianMingYou on 15/1/18. ...

  9. django2集成DjangoUeditor富文本编辑器

    富文本编辑器,在web开发中可以说是不可缺少的.django并没有自带富文本编辑器,因此我们需要自己集成,在这里推荐大家使用DjangoUeditor,因为DjangoUeditor封装了我们需要的一 ...

随机推荐

  1. Android开源项目xUtils HttpUtils模块分析(转)

    xUtils是github上的一个Android开源工具项目,其中HttpUtils模块是处理网络连接部分,刚好最近想整理下Android网络编程知识,今天学习下xUtils中HttpUtils. x ...

  2. linux安装教程以及使用时遇到的问题和解决方法

    以后开发都是要用linux,所以就安装了ubuntu,也是第一次用linux的系统.装的是win7+Ubuntu16.04的双系统. 安装过程如下:我用的是U盘安装,参看http://www.jian ...

  3. Object的原型拷贝-create、assign、getPrototypeOf 方法的结合

    一.实现原型拷贝 1.1.代码         tips:为了体现原型链,写了继承实现的代码,这部分可跳过- <script> /* 创建包含原型链的实验对象obj1-- start */ ...

  4. JAVA 方法 和Scanner

    方法:包含于类或对象中,是解决一类问题步骤的有序组合. 算法:解决一类问题的思想. Scanner next()与nextLine()区别 next(): 1.一定要读取到有效字符后才可以结束输入. ...

  5. [转]关于NTLM认证的.NET,php,python登录

    本文转自:http://www.cnblogs.com/myx/archive/2013/03/25/php-ntlm-python-net.html 早期SMB协议在网络上传输明文口令.后来出现 L ...

  6. Rsyslog+ELK日志分析系统

    转自:https://www.cnblogs.com/itworks/p/7272740.html Rsyslog+ELK日志分析系统搭建总结1.0(测试环境) 因为工作需求,最近在搭建日志分析系统, ...

  7. [SQL Server] 无法连接到本地数据库

    打开SQL Server配置管理器 启用下图两个协议 打开SQL Server服务 这一步可能出现这种情况: 故障原因是,安装Visual Studio 2012的时候,自动安装“Microsoft ...

  8. SearchRequestBuilder常用方法说明

    SearchRequestBuilder常用方法说明 (1) setIndices(String... indices):上文中描述过,参数可为一个或多个字符串,表示要进行检索的index: (2) ...

  9. Orchard源码:缓存设计

    概述 从缓存失效的几种方式开始了解Orchard缓存设计 1.设置失效时间 Func<int> retrieve = () => _cacheManager.Get("te ...

  10. PHP项目学习——控件

    主要是在项目学习中总结的一些东西 动态效果 flashbar滚动条,增加动态效果,直接嵌入html中 <!--flash滚动条--> <object classid="cl ...