这个是最近才写的,本以为实现起来很有难度,需要更高深的理论,

写完之后,才发现自己错误的离谱;

之所以能用一个imageview 实现轮播 基于两点:::

  1. 使用 imageview 的layer 层设置,也就是动用的是imageview的重新绘制---- 这个是视图切换的原因
  2. 使用 CATransition 动画 ------ 这个动画模拟了轮播的效果

就是简单:::

.h 的声明

@interface ImageViewShuffling : UIView
@property (nonatomic,strong)NSArray *array; @end

.m 实现,和理论解释

@interface ImageViewShuffling ()

@property (nonatomic,strong)UIImageView *imageView;
@property (nonatomic,assign)NSInteger currentIndex; @end @implementation ImageViewShuffling
@synthesize array = _array; -(instancetype)initWithFrame:(CGRect)frame{ if (self == [super initWithFrame:frame]) {
[self addSubview:self.imageView];
}
return self;
} -(void)setArray:(NSArray *)array{ NSAssert(array.count != , @"传入的滚动数组是 空的");
_array = array;
self.imageView.backgroundColor = array.firstObject;
} -(UIImageView *)imageView{ if (_imageView == nil) {
_imageView =[[UIImageView alloc]initWithFrame:CGRectMake(, , self.frame.size.width, self.frame.size.height)];
_imageView.contentMode = UIViewContentModeScaleAspectFit;
_imageView.userInteractionEnabled = YES;
/*
imageview 添加左右滑动的手势
*/
UISwipeGestureRecognizer *left = [[UISwipeGestureRecognizer alloc]initWithTarget:self action:@selector(leftSwifAction:)];
left.direction = UISwipeGestureRecognizerDirectionLeft;
[_imageView addGestureRecognizer:left];
UISwipeGestureRecognizer *right = [[UISwipeGestureRecognizer alloc]initWithTarget:self action:@selector(rigthSwifAction:)];
right.direction = UISwipeGestureRecognizerDirectionRight;
[_imageView addGestureRecognizer:right];
}
return _imageView;
}
/*
根据手势判断 左右的滑动 判断 显示的index
*/
-(void)rigthSwifAction:(UISwipeGestureRecognizer*)swip{ self.currentIndex = (self.currentIndex+) % (self.array.count);
[self changeImageWithIndex:self.currentIndex andDirection:@"right"];
}
-(void)leftSwifAction:(UISwipeGestureRecognizer*)swip{ self.currentIndex = (self.currentIndex - + self.array.count)%(self.array.count);
[self changeImageWithIndex:self.currentIndex andDirection:@"left"];
}

/*
这个是唯一的重点::
使用 CATransition 添加动画
*/
-(void)changeImageWithIndex:(NSInteger)integer andDirection:(NSString*)direction{ self.imageView.backgroundColor = self.array[integer]; CATransition *transition = [[CATransition alloc]init];
transition.type = kCATransitionPush; if ([direction isEqualToString:@"right"]) { transition.subtype = kCATransitionFromLeft;
}else{// if left transition.subtype = kCATransitionFromRight;
} [self.imageView.layer addAnimation:transition forKey:@"direction"];
}

有木有发现,这个实现很简单呀…………

主要是CATransition 动画的功劳…………

调用:::

-(void)prepareImageViewShuffling{

        ImageViewShuffling *imageViewShuffling = [[ImageViewShuffling alloc]initWithFrame:CGRectMake(, , self.view.frame.size.width -, )];
[self.view addSubview:imageViewShuffling];;
imageViewShuffling.array = self.arr;
}

01.轮播图之五 :一个 imageView也能 作 轮播的更多相关文章

  1. 自己动手丰衣足食之轮播图一动态修改marginTop属性实现轮播图

    引言 学习jQuery有年头了,刚开始学习时自己动手写过轮播图,放的久了以至于忘了大致思路了.现在转而做前端,抽空把jquery轮播图拿出来写一写,把各种思路都自己练习练习,这里主要使用动态修改mar ...

  2. swiper轮播问题之一:轮播图内容为动态数据生成时轮播图无法自动轮播

    本人在用H5做移动端项目中使用Swiper遇到的两个问题,因此加深了对Swiper的掌握,分享出来对刚开始接触Swiper的童鞋们或多或少会有帮助.        首先,new Swiper的初始化最 ...

  3. 【云开发】10分钟零基础学会做一个快递查询微信小程序,快速掌握微信小程序开发技能(轮播图、API请求)

    大家好,我叫小秃僧 这次分享的是10分钟零基础学会做一个快递查询微信小程序,快速掌握开发微信小程序技能. 这篇文章偏基础,特别适合还没有开发过微信小程序的童鞋,一些概念和逻辑我会讲细一点,尽可能用图说 ...

  4. android 轮播图

    轮播图是很常用的一个效果 核心功能已经实现 没有什么特殊需求 自己没事研究的 所以封装的不太好 一些地方还比较糙 为想要研究轮播图的同学提供个参考 目前测试图片为mipmap中的图片 没有写从网络加载 ...

  5. Android轮播图

    轮播图是很常用的一个效果 核心功能已经实现 没有什么特殊需求 自己没事研究的 所以封装的不太好 一些地方还比较糙 为想要研究轮播图的同学提供个参考目前测试图片为mipmap中的图片 没有写从网络加载图 ...

  6. Android轮播图Banner的实现

    从慕课网上学了一门叫做“不一样的自定义实现轮播图效果”的课程,感觉实用性较强,而且循序渐进,很适合初学者.在此对该课程做一个小小的笔记. 实现轮播思路: 1.一般轮播图是由一组图片和底部轮播圆点组成, ...

  7. 使用jq深入研究轮播图特性

    网站轮播图 太耳熟的词了  基本上做pc端的 主页绝壁会来一个轮播图的特效 轮播图他一个页面页面的切换,其实的原理是通过css的定位 ,定位到一起,第一张首先显示,其余默认隐藏. 今天我实现的这个轮播 ...

  8. 原生js实现轮播图

    原生js实现轮播图 很多网站上都有轮播图,但找到一个系统讲解的却很难,因此这里做一个简单的介绍,希望大家都能有所收获,如果有哪些不正确的地方,希望大家可以指出. 原理: 将一些图片在一行中平铺,然后计 ...

  9. JQ万能轮播图

    lunbotu.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8">  ...

随机推荐

  1. Spring Cloud Eureka 注册中心高可用机制

    一.Eureka 正常工作流程 Service 服务作为 Eureka Client 客户端需要在启动的时候就要向 Eureka Server 注册中心进行注册,并获取最新的服务列表数据. Eurek ...

  2. 39、扩展原理-BeanFactoryPostProcessor

    39.扩展原理-BeanFactoryPostProcessor BeanPostProcessor:bean后置处理器,bean创建对象初始化前后进行拦截工作的 BeanFactoryPostPro ...

  3. 关于 sublime 的插件 AdvancedNewFile 新建文件/文件夹 插件

    新建文件的插件: 快捷键:Ctrl + N 路径:当前目录下进行创建:js/index.js      表示在当前js目录下面创建index.js box      表示直接在当前目录下面创建一个bo ...

  4. [USACO08FEB]酒店Hotel 线段树

    [USACO08FEB]酒店Hotel 线段树 题面 其实就是区间多维护一个lmax,rmax(表示从左开始有连续lmax个空房,一直有连续rmax个空房到最右边),合并时讨论一下即可. void p ...

  5. Luogu5071 [Ynoi2015]此时此刻的光辉 【莫队】

    题目链接:洛谷 这个跟上上个Ynoi题目是一样的套路,首先我们知道\(n=\prod p_i^{\alpha_i}\)时\(d(n)=\prod (\alpha_i+1)\). 首先对所有数分解质因数 ...

  6. js 将网络图片格式转为base64 canvas 跨域

    function getBase64Image(img) { var canvas = document.createElement("canvas"); canvas.width ...

  7. Java学习日记基础篇(三-下)——流程控制之循环控制

    循环控制 for循环 语法: for(循环初值;循环条件;步长) { 语句; //循环体 } 例子: import java.io.*; public class Demo4 { public sta ...

  8. 探究机器码,深入研究C语言程序的机制

    用C高级编程语言写的程序,都要经过编译链接成本机可执行的程序.这个可执行程序究竟是什么呢?在Linux上,我们可以用objdump命令很方便地查看一个可执行程序的机器码.我们从一个简单的示例开始,说一 ...

  9. avalon里面倒计时功能2

    // 转格式 timeStamp: function (second_time) { var time = parseInt(second_time) + "秒"; ) { ; ) ...

  10. 教你如何快速定制 SpringBoot banner

    之前说过如何快速创建SpringBoot项目,不知道的同学可以查看之前的文章 5分钟学会如何创建spring boot项目. 为了让大家脱单,码哥简直费尽心思,今天这个技能或许可以让你脱单! 今天我们 ...