zoukankan      html  css  js  c++  java
  • AJ学IOS(11)UI之图片自动轮播

    AJ分享,必须精品

    先看效果

    这里写图片描述

    这里写图片描述

    这里写图片描述

    代码

    
    #import "NYViewController.h"
    
    #define kImageCount 5
    
    @interface NYViewController () <UIScrollViewDelegate>
    @property (nonatomic, strong) UIScrollView *scrollView;
    @property (nonatomic, strong) UIPageControl *pageControl;
    
    @property (nonatomic, strong) NSTimer *timer;
    @end
    
    @implementation NYViewController
    
    //懒加载加载scrollView
    -(UIScrollView *)scrollView
    {
        if (_scrollView == nil) {
            _scrollView = [[UIScrollView alloc]initWithFrame:CGRectMake(10, 20, 300, 130)];
            _scrollView.backgroundColor = [UIColor redColor];
    
            [self.view addSubview:_scrollView];
    
            //contentSize
            //高度为0 只水平滚动
            self.scrollView.contentSize = CGSizeMake(kImageCount * _scrollView.bounds.size.width, 0);
    
            //取消弹簧效果
            _scrollView.bounces = NO;
    
            //取消滚动条
            _scrollView.showsHorizontalScrollIndicator = NO;//水平
            _scrollView.showsVerticalScrollIndicator = NO;//竖直
    
            //要分页
            _scrollView.pagingEnabled = YES;
    
            //设置代理
            _scrollView.delegate = self;
    
    
    
        }
        return _scrollView;
    }
    
    -(UIPageControl *)pageControl
    {
        if (_pageControl == nil) {
            //分页控件,本质上和scrollView没有任何关系,是两个独立的控件
            _pageControl = [[UIPageControl alloc]init];
    
            //总页数
            _pageControl.numberOfPages = kImageCount;
            //控件尺寸
            CGSize size = [_pageControl sizeForNumberOfPages:kImageCount];
    
            _pageControl.bounds = CGRectMake(0, 0, size.width, size.height);
            _pageControl.center = CGPointMake(self.view.center.x, 130);
    
            //设置颜色
            _pageControl.pageIndicatorTintColor = [UIColor redColor];
            _pageControl.currentPageIndicatorTintColor = [UIColor blackColor];
    
            [self.view addSubview:_pageControl];
    
            //添加监听方法
            /**在OC中,绝大多数“继承UIControl控件”,都可以监听UIControlEventValueChanged事件,只有button除外,button是点得,是touchup。。。*/
            [_pageControl addTarget:self action:@selector(pageChanged:) forControlEvents:UIControlEventValueChanged];
        }
        return _pageControl;
    }
    
    //分页控件的监听方法
    -(void)pageChanged:(UIPageControl *)page
    {
        //根据页数,调整滚动视图中得图片位置contentOffset
        CGFloat x = page.currentPage * self.scrollView.bounds.size.width;
        [self.scrollView setContentOffset:CGPointMake(x, 0) animated:YES];
    }
    
    - (void)viewDidLoad
    {
        [super viewDidLoad];
    
        //设置图片
        for (int i = 0; i<kImageCount; i++) {
            NSString *imageName = [NSString stringWithFormat:@"img_%02d", i+1 ];
            UIImage *image = [UIImage imageNamed:imageName];
    
            UIImageView *imageView = [[UIImageView alloc] initWithFrame: self.scrollView.bounds];
            imageView.image = image;
    
            [self.scrollView addSubview:imageView];
        }
    
        //计算imageView的位置
        [self.scrollView.subviews enumerateObjectsUsingBlock:^(UIImageView *imageView, NSUInteger idx, BOOL *stop) {
            //调整x =》 origin =》frame
            CGRect frame = imageView.frame;
            frame.origin.x = idx * frame.size.width;
            imageView.frame = frame;
    
        }];
    
        //分页初始页数为0
        self.pageControl.currentPage = 0;
    
        //启动时钟
        [self startTimer];
    
    }
    
    /**启动时钟*/
    -(void)startTimer
    {
        self.timer = [NSTimer scheduledTimerWithTimeInterval:2.0 target:self selector:@selector(updateTimer) userInfo:nil repeats:YES];
    
        //添加运行循环
        [[NSRunLoop currentRunLoop]addTimer:self.timer forMode:NSRunLoopCommonModes];
    
    }
    
    -(void)updateTimer
    {
        //页号发生变化
        //(当前页数 + 1) % 总页数
        int page = (self.pageControl.currentPage+1) % kImageCount;
        self.pageControl.currentPage = page;
        //调用监听方法。让滚动视图滚动
        [self pageChanged:self.pageControl];
    }
    
    #pragma mark - scrollView的代理方法
    
    //滚动视图停下来
    -(void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
    {
        // 停下来的当前页数,通过contentOffset获取当前偏移量
        NSLog(@"%@",NSStringFromCGPoint(scrollView.contentOffset));
    
        //计算页数
        int page = scrollView.contentOffset.x/scrollView.bounds.size.width;
    
        self.pageControl.currentPage = page;
    
    
    
    }
    
    /**
     抓住图片时,停止时钟,松手后,开启时钟
     */
    -(void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
    {
        //停止时钟,停止后就不能在使用,如果要启用时钟,需要重新实例化
        [self.timer invalidate];
    }
    
    
    -(void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
    {
        //启动时钟
        [self startTimer];
    
    }
    @end
    

    实现思路

    1.scrollView getter方法懒加载
    指定了大小,添加到视图

    2,viewDidLoad中添加图像,并计算位置

    3,运行观察效果,修改scrollView的属性….

    4,实例化UIPageControl

    5,因为分页控件与滚动视图分离,因此监听滚动停止代理方法,修改分页控件的页数

    6,将UIPageControl定义成属性,并且添加监听方法。

    7,实现监听方法,页数变化后,修改scrollView的位置

    8,添加时钟,调用分页控件的监听方法,实现图片自动轮播

  • 相关阅读:
    XSLT轻松入门收藏贴
    [网摘学习]使用openstack构建私有云计算平台
    [网摘学习]关于OpenStack架构
    [问题]django_openstack.templatetags
    [网摘学习]5个Linux命令
    关于git使用 命令参考
    [openstack问题]dashboard无法登陆进去的问题
    前台显示后台变量值
    实现浏览器垂直水平居中的 DIV
    IsPostBack作用
  • 原文地址:https://www.cnblogs.com/luolianxi/p/4990379.html
Copyright © 2011-2022 走看看