`
penuel
  • 浏览: 30692 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

UIScrollView + UIPageControl +NSTimer 做循环动态播放UIView

 
阅读更多
刚学习ios开发,需要做一个app登陆view,上面一般是动态Image播放,下面是登陆按钮,如图:
初步思想:
1:先做一个scrollView可以左右拖动进行手动播放
2:做UIPageControl,即下面的白点可以翻页的
3:用NSTimer实现自动播放;

UIScrollView不能放置UIWebView和UITableView,因为他们一个是实现了UIScrollViewDelegate协议,一个是继承UIScrollView故会导致滚动错乱,如果要用,可以先用一个UIView装载一次;

ok,开始实现:
1:新建UIViewController
.h头文件实现UIScrollViewDelegate
#import <UIKit/UIKit.h>

@interface YLFisrtViewController : UIViewController<UIScrollViewDelegate>

@end

.m文件:

定义需要用到的变量:

NSArray * imageArr;//图片路径字符串数组

UIScrollView * scrollView;//滚动view

UIPageControl * pageControl;//pageView

BOOL Tend;//是否需要从头重新播放

一:实现手动滚动效果:

给self.view中添加一个scrollView

- (void)viewDidLoad{

   [self initImgArr];

   [self initScrollView];

   [self.view addSubview:scrollView];

}

-(void)initScrollView{

    scrollView=[[UIScrollViewalloc]initWithFrame:CGRectMake(0, 0, kDeviceWidth,kDeviceHeight/3*2)];

    scrollView.contentSize=CGSizeMake(kDeviceWidth*imageArr.count,kDeviceHeight/3*2);

    scrollView.delegate=self;

    scrollView.scrollEnabled=YES;

    for(int i=0;i<imageArr.count;i++){

        UIImageView * firstImg=[[UIImageViewalloc]initWithImage:[UIImageimageNamed:[imageArrobjectAtIndex:i]]];

        firstImg.frame=CGRectMake(kDeviceWidth*i, 0, kDeviceWidth, kDeviceHeight/3*2);

        [scrollView addSubview:firstImg];

    }

}

-(void)initImgArr{

    imageArr=@[@"gallery_1.png",@"gallery_2.png",@"gallery_3.png",@"gallery_4.png"];

}

如上就可以设置一个滚动图片的效果了;正在滚动的效果

第二步,加UIPageControl,做翻页效果,即产生白点

//在viewDidLoad方法里添加

[selfinitPageControl];

[self addSubview:pageControl];

//方法实现如下:

-(void)initPageControl{

    pageControl=[[UIPageControlalloc]initWithFrame:CGRectMake(kDeviceWidth/2-10, kDeviceHeight/3*2-20, 20, 20)];

    pageControl.numberOfPages=imageArr.count;

    pageControl.currentPage=0;

    [pageControladdTarget:selfaction:@selector(changePage:) forControlEvents:UIControlEventValueChanged];

}

//可以不要下面这个方法,此方法是手动点击白点的时候跳转相应页面视图

-(void)scrollViewDidScroll:(UIScrollView *)scrollView{

    int page=scrollView.contentOffset.x/kDeviceWidth;

    pageControl.currentPage=page;

}

//并且记得在手动滚动的时候更改pageControl的页码

-(void)scrollViewDidScroll:(UIScrollView *)scrollView{

    int page=scrollView.contentOffset.x/kDeviceWidth;

    pageControl.currentPage=page;

}

如图:滚动条和页面滚动点都在

第三步就是做一个定时任务自动翻转
在viewDidLoad里添加定时器
//启动定时任务

    [NSTimerscheduledTimerWithTimeInterval:5target:selfselector:@selector(handleSchedule) userInfo:nilrepeats:YES];

定时任务方法调用:(注意计算好最后一页循环滚动)

-(void)handleSchedule{

    ++pageControl.currentPage;

    if(Tend){

        [scrollViewsetContentOffset:CGPointMake(0, 0) animated:YES];

        pageControl.currentPage=0;

    }else{

        [scrollViewsetContentOffset:CGPointMake(pageControl.currentPage*kDeviceWidth, 0) animated:YES];

    }

    if (pageControl.currentPage==pageControl.numberOfPages-1) {

        Tend=YES;

    }else{

        Tend=NO;

    }
最后修饰:
有了pageControl的白点标志翻滚,就不需要scrollView的滚动条了吧

scrollView.showsHorizontalScrollIndicator=NO;//有了白点了,不需要显示水平滑动线


备注:一些你可能需要的属性

scrollview.showsVerticalScrollIndicator = NO;//设置竖直滚动条是否出现


scrollview.showsHorizontalScrollIndicator = NO;//设置水平滚动条是否出现


scrollview.contentSize = CGSizeMake(600, 108); //scrollview的滚动范围,若宽度大于屏幕,则横滚,高度大于屏幕竖滚,如果都大,你懂得

scroll.pagingEnabled=YES;//scrollView使用页面属性,即不会停在页面之间,即只会显示第一页或者第二页,不会各一半显示

scrollview.canCancelContentTouches为YES,那么当你在UIScrollView上面放置任何子视图的时候,当你在子视图上移动手指的时候,UIScrollView会给子视图发送touchCancel的消息。而如果该属性设置为NO,ScrollView本身不处理这个消息,全部交给子视图处理。如果设置为NO了,并不是UIScrollView不能处理任何事件了,那么为何在子视图上快速滚动的时候,UIScrollView还能移动那。这个一定要区分前面所说的UIScrollView中断touch-Down事件,开启一个定时器。我们设置的这个cancancelContentTouches属性为NO时,只是让UIScrollView不能发送cancel事件给子视图。而前面所说的时,中断touch-down事件,和取消touch事件是俩码事,所以当快速在子视图上移动的时候,当然可以滚动。但是如果你慢速的移动的话,就可以区分这个属性了,假如设定为YES,在子视图上慢速移动也可以滚动视图,但是如果为NO 。因为UIScrollView,发送了cancel事件给子视图处理了,自己当然滚动不了了。

pageController.userInteractionEnabled=NO; //pagecontroller不响应点击操作

pageController.alpha=0; //设置pageController 透明,不可见
分享到:
评论

相关推荐

    ios-Banner轮播 +自定义UIpageControl.zip

    UIPageControl是iOS SDK提供的一种原生控件,用于显示当前页面和总页面数,通常与UIScrollView结合使用,以指示用户在浏览多个页面时的位置。 首先,我们需要了解如何使用UIScrollView来创建基础的轮播功能。...

    UIScrollview循环滑动

    这可能涉及到`UIView`的`animateWithDuration:animations:`方法,以及`CADisplayLink`或`NSTimer`来定时更新内容视图的位置。 最后,为了防止内存泄漏,我们需要注意合理管理这些子视图。当它们不再可见时,可以...

    循环ScrollDemo

    本`循环ScrollDemo`就是一个结合了`UIScrollView`和`UIPageControl`功能的示例项目,实现了页面的无限循环播放效果。 首先,我们需要理解`UIScrollView`的基本用法。`UIScrollView`是一个容器视图,它可以包含多个...

    UIScrollView循环滚动

    本教程将详细讲解如何实现一个能够循环滚动的`UIScrollView`,特别适用于展示如轮播图、广告条等需要连续播放图片的场景。 一、`UIScrollView`基础 `UIScrollView` 是UIKit框架中的一个视图类,它允许用户在水平或...

    iOS开发中使用UIScrollView实现无限循环的图片

    UIScrollView继承自UIView,它可以显示比其实际大小大的内容,并允许用户通过滑动来查看超出可视区域的部分。为了实现滚动,我们需要设置UIScrollView的contentSize属性,它的宽度和高度应等于所有可滚动内容的总...

    ios-UIScrollView.zip

    UIScrollView继承自UIView,它的主要功能是提供一个可滚动的视图,可以容纳的内容远大于其实际显示的大小。通过设置contentSize属性,我们可以定义可滚动区域的大小,而通过设置contentOffset,我们可以控制视图当前...

    图片循环滚动

    为了实现自动滚动,我们需要使用NSTimer创建一个定时器,每隔一段时间就改变UIScrollView的contentOffset,使得图片向左或向右移动。 ```swift let timer = Timer.scheduledTimer(timeInterval: duration, target: ...

    ios-跑马灯.zip

    8. **UIScrollView或UIPageControl**: 有时候,跑马灯效果可以借助于UIScrollView实现,通过设置其contentSize和scrollDirection,配合滚动代理方法,可以轻松实现内容的滚动。如果需要显示当前滚动位置,...

    ios-轮播图+PageControl.zip

    在这个"ios-轮播图+PageControl.zip"项目中,开发者构建了一个结合了UIScrollView和UIPageControl的功能,实现了自动轮播的效果。 **UIScrollView** 是iOS SDK中的一个关键组件,它提供了一个可滚动的视图,可以...

    iOS实现无限循环图片轮播器的封装

    首先,我们需要理解实现无限循环的关键在于巧妙地利用视图布局和滚动视图(UIScrollView)的特性。通常,我们会使用一个UIScrollView来承载多张图片,然后通过设置其contentSize使其可以滚动。在这个案例中,作者...

    scrollview各种轮滑动画

    6. **页面控制(UIPageControl)**:与`UIScrollView` 结合使用,`UIPageControl` 可以指示当前显示的是哪一页,增强用户对轮播的感知。通常,我们会在`scrollViewDidEndDecelerating:` 或`scrollViewDidEndDragging...

    HALoopView

    使用UIView做主view,UIScrollView做主要滑动view,UIPageControl作为页计数效果,使用NSTimer来实现自动滚动。 我们使用UIView作为底view,宽度设置成320,一般就这么宽,高度随意。 然后再view上加个3*320的...

    ios-李泽雨.zip

    在iOS开发中,"跑马灯"通常是指一种滚动显示文字或图片的效果,它能循环播放内容,给人一种连续不断移动的视觉感受。这种效果在通知、广告或者菜单中经常被用到。在这个名为"ios-李泽雨.zip"的压缩包文件中,我们...

    手机端仿照淘抢购倒计时时间滑动tab页面

    在iOS中,可使用UIScrollView和UIPageControl结合,或者使用SwiftUI的TabView来实现。滑动切换时,对应的倒计时应随之改变,展示相应时间段的信息。 至于"左右滑动"的文件名,可能包含的是实现滑动效果的相关代码或...

    ios-循环轮播图.zip

    自动轮播可以通过NSTimer定时触发滚动事件实现,点击事件则可以添加手势识别器来处理,指示器通常是一个简单的UIPageControl,它的页码与实际数据数组的长度保持一致。 总的来说,iOS中的无线循环轮播图是通过结合...

    iOS实现带有缩放效果的自动轮播图

    它拥有一个UIScrollView对象、三个UIImageView对象、一个UIPageControl对象和一个NSTimer对象。 二、 CustomScrollView 的实现 CustomScrollView的实现主要涉及到以下几个方面: 1. 初始化:在initWithFrame方法...

    ios-循环图片轮播器.zip

    3. 循环播放:当到达最后一张图片后,应能无缝返回到第一张,反之亦然。这需要在切换逻辑中处理好边界条件。 4. 滑动交互:用户可以通过手势滑动来手动切换图片,需要集成`UIScrollView`或其子类`UIPageControl`来...

    ios-实现文字上下轮播.zip

    在iOS开发中,实现文字上下轮播的效果,通常涉及到的核心技术是`UIScrollView`及其子类,比如`UIPageControl`,以及自定义动画和定时器的使用。这种效果常见于新闻快报、广告展示等场景,可以高效地展示大量文本信息...

    图片轮播封装-无限循环

    这个“图片轮播封装-无限循环”主题主要关注如何利用UIScrollView组件来实现一个高效且易于集成的图片轮播功能。接下来,我们将深入探讨这一技术。 首先,UIScrollView是iOS SDK中的一个基础组件,它允许用户在水平...

    ios自动滚动广告

    这种广告形式通常被称为焦点图或轮播图,它可以自动循环展示多张图片或者内容,为用户提供动态的视觉体验。在本篇中,我们将深入探讨如何在iOS应用中构建一个自动滚动的广告功能。 首先,我们需要了解iOS中的广告...

Global site tag (gtag.js) - Google Analytics