LiveChangedImageView

效果

说明

切换图片的时候自动根据图片的尺寸进行渐变式切换,效果很不错,使用非常容易。

源码

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

//
// LiveChangedImageView.h
// LiveImageView
//
// Created by YouXianMing on 15/5/1.
// Copyright (c) 2015年 YouXianMing. All rights reserved.
// #import <UIKit/UIKit.h> @interface LiveChangedImageView : UIView /**
* 动画持续时间(默认值为0.3s)
*/
@property (nonatomic) NSTimeInterval duration; /**
* 原始的图片(只需要赋值一次,重写了setter方法,要注意)
*/
@property (nonatomic, strong) UIImage *image; /**
* 变化到的图片
*/
@property (nonatomic, strong) UIImage *changeToImage; /**
* 边框大小
*/
@property (nonatomic) CGFloat borderWidth; /**
* 边框颜色
*/
@property (nonatomic, strong) UIColor *borderColor; /**
* 变化时候的动画
*
* @param animated 是否执行动画
*/
- (void)changedAnimation:(BOOL)animated; /* ==========================
----- 简化操作的方法 -----
========================== */ /**
* 便利构造器
*
* @param frame frame值
* @param duration 动画持续时间
* @param image 原始的图片
*
* @return 实例对象
*/
+ (instancetype)liveChangedImageViewWithFrame:(CGRect)frame
duration:(NSTimeInterval)duration
startImage:(UIImage *)image; /**
* 切换到其他图片
*
* @param image 被切换的图片
* @param animated 是否执行动画
*/
- (void)changeToImage:(UIImage *)image animated:(BOOL)animated; @end
//
// LiveChangedImageView.m
// LiveImageView
//
// Created by YouXianMing on 15/5/1.
// Copyright (c) 2015年 YouXianMing. All rights reserved.
// #import "LiveChangedImageView.h" @interface LiveChangedImageView () @property (nonatomic, strong) UIImageView *imageView; @end @implementation LiveChangedImageView /**
* 创建出imageView
*
* @param frame imageView的frame值
*/
- (void)createImageView:(CGRect)frame { self.imageView = [[UIImageView alloc] initWithFrame:frame];
[self addSubview:self.imageView]; } - (instancetype)initWithFrame:(CGRect)frame {
self = [super initWithFrame:frame];
if (self) { [self createImageView:self.bounds]; self.duration = 0.3f; }
return self;
} - (void)changedAnimation:(BOOL)animated { if (_changeToImage == nil) {
return;
} // 如果设定了动画
if (animated) { // 设定切换动画
CABasicAnimation *contentsAnimation = [CABasicAnimation animationWithKeyPath:@"contents"];
contentsAnimation.duration = _duration;
contentsAnimation.fromValue = (__bridge id)(_imageView.image.CGImage);
contentsAnimation.toValue = (__bridge id)(_changeToImage.CGImage);
_imageView.layer.contents = (__bridge id)(_changeToImage.CGImage); // 设定尺寸动画
CGRect startRect = CGRectMake(, , _imageView.image.size.width, _imageView.image.size.height);
CGRect endRect = CGRectMake(, , _changeToImage.size.width, _changeToImage.size.height); CABasicAnimation *boundsAnimation = [CABasicAnimation animationWithKeyPath:@"bounds"];
boundsAnimation.duration = _duration;
boundsAnimation.fromValue = [NSValue valueWithCGRect:startRect];
boundsAnimation.toValue = [NSValue valueWithCGRect:endRect];
_imageView.layer.bounds = endRect; // 动画组
CAAnimationGroup *group = [CAAnimationGroup animation];
group.duration = _duration;
group.animations = @[contentsAnimation, boundsAnimation];
group.delegate = self; // 加载动画
[_imageView.layer addAnimation:group forKey:nil]; } else { _imageView.image = _changeToImage;
_imageView.bounds = CGRectMake(, , _changeToImage.size.width, _changeToImage.size.height); }
} #pragma mark - 动画代理
- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag {
_imageView.image = _changeToImage;
} + (instancetype)liveChangedImageViewWithFrame:(CGRect)frame
duration:(NSTimeInterval)duration
startImage:(UIImage *)image {
LiveChangedImageView *changedView = [[LiveChangedImageView alloc] initWithFrame:frame];
changedView.image = image;
changedView.duration = duration; return changedView;
} - (void)changeToImage:(UIImage *)image animated:(BOOL)animated {
self.changeToImage = image;
[self changedAnimation:animated];
} #pragma mark - 重写setter,getter方法
@synthesize image = _image;
- (void)setImage:(UIImage *)image {
_image = image;
_imageView.image = image;
_imageView.bounds = CGRectMake(, , image.size.width, image.size.height);
} - (UIImage *)image {
return _imageView.image;
} @synthesize borderColor = _borderColor;
- (void)setBorderColor:(UIColor *)borderColor {
_imageView.layer.borderColor = borderColor.CGColor;
_borderColor = borderColor;
} - (UIColor *)borderColor {
return _borderColor;
} @synthesize borderWidth = _borderWidth;
- (void)setBorderWidth:(CGFloat)borderWidth {
_imageView.layer.borderWidth = borderWidth;
_borderWidth = borderWidth;
} - (CGFloat)borderWidth {
return _borderWidth;
} @end

设计细节

[控件] LiveChangedImageView的更多相关文章

  1. JS调用Android、Ios原生控件

    在上一篇博客中已经和大家聊了,关于JS与Android.Ios原生控件之间相互通信的详细代码实现,今天我们一起聊一下JS调用Android.Ios通信的相同点和不同点,以便帮助我们在进行混合式开发时, ...

  2. HTML5 progress和meter控件

    在HTML5中,新增了progress和meter控件.progress控件为进度条控件,可表示任务的进度,如Windows系统中软件的安装.文件的复制等场景的进度.meter控件为计量条控件,表示某 ...

  3. 百度 flash html5自切换 多文件异步上传控件webuploader基本用法

    双核浏览器下在chrome内核中使用uploadify总有302问题,也不知道如何修复,之所以喜欢360浏览器是因为帮客户控制渲染内核: 若页面需默认用极速核,增加标签:<meta name=& ...

  4. JS与APP原生控件交互

    "热更新"."热部署"相信对于混合式开发的童鞋一定不陌生,那么APP怎么避免每次升级都要在APP应用商店发布呢?这里就用到了混合式开发的概念,对于电商网站尤其显 ...

  5. UWP开发必备:常用数据列表控件汇总比较

    今天是想通过实例将UWP开发常用的数据列表做汇总比较,作为以后项目开发参考.UWP开发必备知识点总结请参照[UWP开发必备以及常用知识点总结]. 本次主要讨论以下控件: GridView:用于显示数据 ...

  6. 【踩坑速记】开源日历控件,顺便全面解析开源库打包发布到Bintray/Jcenter全过程(新),让开源更简单~

    一.写在前面 自使用android studio开始,就被它独特的依赖方式:compile 'com.android.support:appcompat-v7:25.0.1'所深深吸引,自从有了它,麻 ...

  7. 对百度WebUploader开源上传控件的二次封装,精简前端代码(两句代码搞定上传)

    前言 首先声明一下,我这个是对WebUploader开源上传控件的二次封装,底层还是WebUploader实现的,只是为了更简洁的使用他而已. 下面先介绍一下WebUploader 简介: WebUp ...

  8. Windows API 设置窗口下控件Enable属性

    参考页面: http://www.yuanjiaocheng.net/webapi/create-crud-api-1-put.html http://www.yuanjiaocheng.net/we ...

  9. VB.NET设置控件和窗体的显示级别

    前言:在用VB.NET开发射频检测系统ADS时,当激活已存在的目标MDI子窗体时,被其他子窗体遮住了,导致目标MDI子窗体不能显示. 这个问题怎么解决呢?网上看到一篇帖子VB.NET设置控件和窗体的显 ...

随机推荐

  1. Tensorflow 方法记录

    1.tf.convert_to_tensor:传入的list必须是一个有固定长度的list,如果为2维的list,第二维的list的长度必须是固定. 2.tf.layers.conv1d(),默认宽卷 ...

  2. redis-springdata-api

    使用StringRedisTempalte操作redis五种数据类型 spring-data中继承了redisTemplate, 提供redis非切片连接池 代码github地址: https://g ...

  3. Mahout实战---评估推荐程序

    推荐程序的一般评测标准有MAE(平均绝对误差),Precision(查准率),recall(查全率) 针对Mahout实战---运行第一个推荐引擎 的推荐程序,将使用上面三个标准分别测量 MAE(平均 ...

  4. Nodejs学习笔记(一)—简介及安装Node.js开发环境

    一.简介 Node.js是让Javascript脱离浏览器运行在服务器的一个平台,不是语言: Node.js采用的Javascript引擎是来自Google Chrome的V8:运行在浏览器外不用考虑 ...

  5. 【云+社区极客说】新一代大数据技术:构建PB级云端数仓实践

    本文来自腾讯云技术沙龙,本次沙龙主题为构建PB级云端数仓实践 在现代社会中,随着4G和光纤网络的普及.智能终端更清晰的摄像头和更灵敏的传感器.物联网设备入网等等而产生的数据,导致了PB级储存的需求加大 ...

  6. Redis debugging guide---官方

    Redis debugging guide Redis is developed with a great stress on stability: we do our best with every ...

  7. Python urllib简单使用

    Python的urllib和urllib2模块都做与请求URL相关的操作. 它们最显著的差异为: urllib2可以接受一个Request对象,并以此可以来设置一个URL的headers,但是urll ...

  8. hadoop2.x学习笔记(一):YARN

    一.YARN产生的背景 MapReduce1.x存在的问题:单点故障&节点压力大不易扩展. 资源利用率&成本 催生了YARN的诞生  不同计算框架可以共享同一个HDFS集群上的数据,享 ...

  9. mac系统终端sudo免输入密码技能get

    1.需要在/etc/sudoers中配置. 这个文件的权限是r/r/n,配置之前需要加写权限. sudo chmod u-w /etc/sudoers 2.打开命令窗口sudo visudo 或者 s ...

  10. CentOS 忘记root密码(重置root密码)

    首先开机选择Advanced options for ****这一行按回车: 然后选中最后是(recovery mode)这一行按"E"进入编辑页面: 将ro recovery改为 ...