iOS开发——高级篇——图片轮播及其无限循环效果
平时APP中的广告位、或者滚动的新闻图片等用到的就是图片轮播这种效果,实现方式主要有两种,一种是ScrollView+ImageView,另一种则是通过CollectionView,今天总结的是ScrollView这种方式。
1.图片轮播效果实现
主要实现思路是:根据图片总数及宽高设置好ScrollView的大小,每切换一张图片相当于在ScrollView上进行一个图片宽度的移动行为,并加入定时器,实现自动轮播。
如图所示,设置好ScrollView及PageControl,ScrollView的contentSize根据图片数量确定,注意启用pagingEnabled这个属性,确保整页移动,同样pageControl也是根据图片数量来确定,每一页代表一张图片。
图片命名采用数字序号方式,方便使用,需要注意的是,pageControl是由0开始的,也就是0对应image1,1对应image2...依次类推
加载图片并将准备好的图片在ScrollView里设置好位置,即将这些图片一张紧挨着一张排列在ScrollView中。
通过ScrollView的代理方法,在ScrollView滚动结束的时候根据 contentOffset更新页码。
定时器设置,这里设置为每隔2秒滚动更新一次,实际上就是每隔2秒更新一次页码,根据页码的变化,让ScrollView跟着移动,每次移动一张图片的距离
这里还需要注意的是,由于加入定时器有自动轮播的效果了,会与手动拖拽ScrollView冲突,即手动拖拽ScrollView过程中可能ScrollView可能自动移动更新图片了,显然这种效果是不符合用户习惯的,这时需要在ScrollView的代理事件中进行处理,即开始拖拽ScrollView时停止定时器,拖拽结束后再开启定时器。
那到这里是不是就结束了呢?我们看看效果图:
这里有两个问题:
(1)首先是移动到最后一张图片时无法移动了,如果是制作APP的新特性页面,这样的滚动效果已经可以了,但如果在广告位或者是滚动新闻这些场景下这种效果是不够好的,一般滚动到最后一张图片时,继续拖拽都会移动到第一张图片,实现一种滚动循环效果。
(2)定时器自动轮播图片时,确实图片循环轮播了,但是仔细看会发现,ScrollView是由最后一种图片位置生硬得拉回到第一张图片的位置,效果也不够理想。
解决办法下面接着说。
2.图片轮播无限循环效果实现
刚刚说到第一个问题,ScrollView移动到最后一张图片时无法移动了,这是因为ScrollView已经移动到最后,而图片又是依次排列,自然也就无法移动。
解决办法是,我们换一个思路实现图片轮播效果,ScrollView上只放三个ImageView,屏幕始终显示中间的ImageView,左边和右边的ImageView分别代表前一张图片和后一张图片,屏幕移动的时候,中间的ImageView变化,同时左右两边的ImageView也随之变化,两种边界情况:
(1)当屏幕显示最后一张图片时,右边的ImageView也也即下一站图片应该是最开始的第一张图片;
(2)当屏幕显示最开始的第一张图片时,左边的ImageView也即上一张图片应该是最后一张图片。
这样三个ImageView不断变化就造成一种图片轮播无限循环的效果。 参考: http://www.cnblogs.com/kenshincui/p/3913885.html
相对于之前的效果,有一些改变,主要有:
(1)ScrollView只需要设置三个ImageView即可,并且默认显示中间的ImageView
(2)根据ScrollView的移动情况,迅速变化三个ImageView中图片数据
(3)ImageView更新完毕后,偷偷把ScrollView拉回到中间的ImageView位置,这样视觉效果上就实现了无限循环的效果
效果图:
但是,这里在加入定时器后实现图片轮播自动循环时遇到了问题,主要是初始化显示第一张图片与根据定时器设置自动移动ScrollView有一些冲突,在code4App上找到其他人一个工程,采用的思路相同,单独封装了ScrollView进行处理,已经解决该问题。
可参考:http://code4app.com/ios/AdScrollerView/54955a78933bf0f2168b45b4
iOS开发——高级篇——图片轮播及其无限循环效果的更多相关文章
- iOS开发笔记6:图片轮播及其无限循环效果
平时APP中的广告位或者滚动的新闻图片等用到的就是图片轮播这种效果,实现方式主要有两种,一种是ScrollView+ImageView,另一种则是通过CollectionView,今天总结的是Scro ...
- iOS开发——高级篇——iOS开发之网络安全密码学
一.非对称加密 - RSA : + 公钥加密,私钥解密: + 私钥加密,公钥解密: + 只能通过因式分解来破解 二.对称加密 - DES - 3DES - AES (高级密码标准,美国国家安全局使用, ...
- iOS开发——高级篇——线程同步、线程依赖、线程组
前言 对于iOS开发中的网络请求模块,AFNet的使用应该是最熟悉不过了,但你是否把握了网络请求正确的完成时机?本篇文章涉及线程同步.线程依赖.线程组等专用名词的含义,若对上述名词认识模糊,可先进行查 ...
- iOS开发——高级篇——地图 MapKit
一.简介 1.在移动互联网时代,移动app能解决用户的很多生活琐事,比如周边:找餐馆.找KTV.找电影院等等导航:根据用户设定的起点和终点,进行路线规划,并指引用户如何到达 在上述应用中,都用到了定位 ...
- iOS开发——高级篇——iPad开发、iPad开发中的modal
一.iPad简介 1.什么是iPad一款苹果公司于2010年发布的平板电脑定位介于苹果的智能手机iPhone和笔记本电脑产品之间跟iPhone一样,搭载的是iOS操作系统 2.iPhone和iPadi ...
- iOS开发——高级篇——地理定位 CoreLocation
一.CoreLocation 在移动互联网时代,移动app能解决用户的很多生活琐事,比如周边:找餐馆.找KTV.找电影院等等导航:根据用户设定的起点和终点,进行路线规划,并指引用户如何到达 在上述应用 ...
- 【iOS开发-55】图片轮播案例:scrollView的分页、滚动栏、利用代理控制定时器和Page Control以及多线程问题
案例: (1)用storyboard布局,这里用了三样东西. --UIScrollView就是我们准备存放滚动图片的容器. --Page Control就是控制页数的那几个小点点.能够设置有多少个点. ...
- iOS开发——高级篇——iOS 项目的目录结构
最近闲来无事去面试一下iOS开发,让我感到吃惊的,面试官竟然问怎么分目录结构,还具体问每个子目录的文件名. 目录结构确实非常重要,面试官这么问,无疑是想窥探开发经验.清晰的目录结构,可让人一眼明白相应 ...
- iOS开发——高级篇——Parse 教程:网络后台基础
本教程已针对Swift, iOS 8.3, Xcode 6.3及最新的Parse SDK(1.7.1版本)更新. 网络后台支持可以为你的App添加许多崭新的功能:不论是数据同步,社交分享,还是云端存储 ...
随机推荐
- POJ3368Frequent values[RMQ 游程编码]
Frequent values Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 17581 Accepted: 6346 ...
- Unity3D脚本行尾(Line Endings)
行尾不一致(inconsistent line endings ) 开发环境 有时候编辑Unity的脚本文件,代码diff之后,或者从svn更新文件之后,Unity中会出现行尾不一致的信息. 我的开发 ...
- GO语言总结(1)——基本知识
1.注释(与C++一样) 行注释:// 块注释:/* ... */ 2.标识符 可以这么说,除了数字开头的不允许,符号开头的不允许,关键字不允许,其他的Unicode字符组合都可以.“_33”也可以是 ...
- gradle项目中如何支持java与scala混合使用?
之前写过一篇maven项目中java与scala如何混用,今天来看看gradle项目中如何达到同样的效果: 一.目录结构 基本上跟maven一样,tips:这一堆目录结构不用死记,后面会讲如何用gra ...
- jetty 9 嵌入式开发示例
jetty 9 嵌入应用程序后,小型的web应用直接打成一个单独的jar包,就可以直接运行,非常适合做Demo演示或云端集群部署. 主要代码: JettyServer的封装类 package yjmy ...
- textarea去掉右侧滚动条,去掉右下角拖拽
代码: <TEXTAREA style= "overflow:hidden; resize:none; "> </TEXTAREA> 当使用背景图片的时候, ...
- 获取用户SID
BOOL GetUserSID(CString &Sid) { HANDLE hProcess = GetCurrentProcess(); if (hProcess) { HANDLE hT ...
- docker搭建ros-indigo-arm交叉编译环境
ROS运行环境:ARM ubuntu14.04 + ROS indigo在arm环境下编译ros应用程序,速度极慢,无法忍受,尝试在x86机器上搭建docker+ros交叉编译环境. 交叉编译环境的搭 ...
- p2p网贷系统即将上线
等有时间了,我将此项目的详细设计与开发流程进行陈述,想学习的朋友敬请期待 先上界面:首页 后台:
- JS系列——Linq to js使用小结
前言:前面几篇介绍了下C#基础技术中的几个:反射.特性.泛型.序列化.扩展方法.Linq to Xml等,本来还有两三个知识点没有写完,比如委托.多线程.异步等,后面会陆续将它们补起来,以便作为一套完 ...