IOS 实现banner循环轮播
在项目中把banner图片UIImageView一张一张的放入UIScrollView中,通过设置UIScrollView的pagingEnabled属性为YES,则可以做到当用户滑动banner时图片一张一张的显示,但当用户想从第一张图到最后一张图,或者从最后一张图到第一张图的时候就会卡住,简单点的做法就是判断用户swipe的方向,然后让UIScrollView自动滑动到最后一张或者第一张,这样做在动画中又显得不够自然,一下是解决办法
假设banner图片有3张,在banner的UIScrollView中用以下的方式进行排列
| 第三张 | 第一张 | 第二张 | 第三张 | 第一张 |
UIScrollView默认滚动到第二张图片的位置,当用户滑动到第一张时,则UIScrollView自动滚动到第4张去,同理当用户滑动到最后一张时,UIScrollView自动滚动到第二张去,这些滚动都设置动画效果为NO
代码如下
h文件
#import <UIKit/UIKit.h> @interface ViewController : UIViewController @property (weak, nonatomic) IBOutlet UIScrollView *mainScroll;
@property (weak, nonatomic) IBOutlet UIPageControl *pageControl; @end
m文件
#import "ViewController.h" @interface ViewController ()<UIScrollViewDelegate>
{
CGFloat w;
NSMutableArray *imgArr;
NSMutableArray *pageArr;
} @end @implementation ViewController - (void)viewDidLoad {
[super viewDidLoad];
w = self.view.frame.size.width;
//page的个数
pageArr = [NSMutableArray array];
for (int i = ; i <= ; i++) {
[pageArr addObject:[NSString stringWithFormat:@"%d.jpg",i]];
}
//重新获取imgView的个数,将显示的第最后一张图片放在第一张,而在最后一张放置显示的第一张图片
imgArr = [NSMutableArray array];
[imgArr addObject:pageArr[pageArr.count - ]];
for (NSString *imgSrc in pageArr) {
[imgArr addObject:imgSrc];
}
[imgArr addObject:pageArr[]];
self.mainScroll.contentSize = CGSizeMake(w*imgArr.count, );
//开始塞入图片
for (int i = ; i < imgArr.count; i++) {
NSString *imgSrc = imgArr[i];
UIImageView *imgView = [[UIImageView alloc] initWithFrame:CGRectMake(i*w, , w, self.mainScroll.frame.size.height)];
[imgView setImage:[UIImage imageNamed:imgSrc]];
[self.mainScroll addSubview:imgView];
}
self.pageControl.numberOfPages = pageArr.count;
self.mainScroll.bounces = NO;
self.mainScroll.pagingEnabled = YES;
self.mainScroll.showsHorizontalScrollIndicator = NO;
self.mainScroll.showsVerticalScrollIndicator = NO;
self.mainScroll.delegate = self;
//自动将scrollView移动显示的第一张图片处
[self.mainScroll setContentOffset:CGPointMake(w, ) animated:NO];
} - (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {
CGFloat offsetX = scrollView.contentOffset.x;
int index = offsetX/w;
if (index == ) {
[self.mainScroll setContentOffset:CGPointMake(w*(imgArr.count-), ) animated:NO];
self.pageControl.currentPage = pageArr.count - ;
}else if (index == imgArr.count -){
[self.mainScroll setContentOffset:CGPointMake(w, ) animated:NO];
self.pageControl.currentPage = ;
}else{
self.pageControl.currentPage = index - ;
} } @end
IOS 实现banner循环轮播的更多相关文章
- Android无限循环轮播广告位Banner
Android无限循环轮播广告位Banner 现在一些app通常会在头部放一个广告位,底部放置一行小圆圈指示器,指示广告位当前的页码,轮播展示一些图片,这些图片来自于网络.这个广告位banner ...
- 解析SwiftUI布局细节(二)循环轮播+复杂布局
前言 上一篇我们总结的主要是VStack里面的东西,由他延伸到 @ViewBuilder, 接着我们上一篇总结的我们这篇内容主要说的是下面的几点,在这些东西说完后我准备解析一下苹果在SiwftUI文档 ...
- swiper在vue项目中的循环轮播bug以及点击事件
一般的,如果是静态数据(本地数据),可以直接在mounted生命周期中初始化,循环轮播.自动播放都比较正常. 但是,如果是动态从后台获取数据的话,采用上述方法会发现,轮播图无法自动播放,也无法拖拽. ...
- 网站banner无缝轮播
网站banner无缝轮播 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...
- js 实现图片间隔循环轮播以及没有间隔的循环轮播
链接地址:http://blog.sina.com.cn/s/blog_75cf5f32010199dn.html 最近做了个图片循环轮播的功能.就是几张图片不断的循环滚动显示. 感觉这个方法不错所以 ...
- 超级详细 一听就会:利用JavaScript jQuery实现图片无限循环轮播(不借助于轮播插件)
前言 作为一个前端工程师,无论公司是什么行业,无论你做什么端,基本都会遇到一个避不开的动画效果:循环轮播.做轮播并不难,市场上的轮播插件有很多,其中比较著名的是swiper,使用也非常简单.但轮播插件 ...
- 解决ajax异步请求数据后swiper不能循环轮播(loop失效)问题、滑动后不能轮播的问题。
问题描述: 1.我使用axios异步请求后台的图片进行渲染后不能实现循环轮播,也就是loop失效,但是静态写死的情况下不会出现这种问题. 2. 分析: swiper的机制是:初始化的时候将swiper ...
- 非常简单的方法实现ViewPager自动循环轮播
非常简单的方法实现ViewPager自动循环轮播,见红色代码部分,其它的代码可以忽略不看. 简洁高效是我解决问题的首要出发点. package com.shuivy.happylendandreadb ...
- 利用JavaScript jQuery实现图片无限循环轮播(不借助于轮播插件)-----转载
前言 作为一个前端工程师,无论公司是什么行业,无论你做什么端,基本都会遇到一个避不开的动画效果:循环轮播.做轮播并不难,市场上的轮播插件有很多,其中比较著名的是swiper,使用也非常简单.但轮播插件 ...
随机推荐
- Yaml 的python 应用
1.安装yaml的python包 2.准备yaml的数据 3.yaml.load 解析yaml 3.生产yaml
- 多媒体开发之视频格式---1080p逐行和1080i隔行
(1)简介 (2)1080p和1080i的区别 (3) ------------------autho:pkf ----------------------time:2015-1-4 (1)简介 (2 ...
- 细细品味大数据--初识hadoop
初识hadoop 前言 之前在学校的时候一直就想学习大数据方面的技术,包括hadoop和机器学习啊什么的,但是归根结底就是因为自己太懒了,导致没有坚持多长时间,加上一直为offer做准备,所以当时重心 ...
- 动态对象创建(二)重载new和delete
动态对象创建(二)重载new和delete 前言 上文我简单介绍了一下动态对象创建的方法,这一篇文章的内容主要是对重载new和delete做一些讲解,也希望能够得到博友们的指点,在这里谢过大家. 通常 ...
- 编辑器模式下如何实例化Prefab
当我们在EditMode下需要用脚本批量添加prefab时,可以用 PrefabUtility.InstantiatePrefab(prefab) as GameObject; 注意:如果用GameO ...
- wordcloud使用
学了下怎么用wordcloud. 以imet的数据集为例 https://www.kaggle.com/c/imet-2019-fgvc6 读取“train.csv”,”label.csv”文件,得到 ...
- Codeforces Round #392 (Div. 2) F. Geometrical Progression
原题地址:http://codeforces.com/contest/758/problem/F F. Geometrical Progression time limit per test 4 se ...
- SpringBoot启动流程分析(六):IoC容器依赖注入
SpringBoot系列文章简介 SpringBoot源码阅读辅助篇: Spring IoC容器与应用上下文的设计与实现 SpringBoot启动流程源码分析: SpringBoot启动流程分析(一) ...
- ubuntu问题: 同时只能有一个软件管理工具在运行
或者是: 只能同时运行一个更新管理器 打开终端输入命令:sudo dpkg –configure -a 运行,系统问题就解决了
- 页游手游服务器(三)lua网络层
在(一)中,介绍了c对lua层的拓展,这边主要写lua层的网络部分,目标是实现RPC调用,实现主要是三部分: 1通信协议(消息的序列化和反序列化) rpc调用主要信息包括方法名,方法参数,设计的通信协 ...