UIScrollView手动轮播图

没有添加定时器

#import "JZScrollViewController.h"

@interface JZScrollViewController () <UIScrollViewDelegate>

@property (nonatomic, strong) UIScrollView * scrollView;
@property (nonatomic, strong) UIPageControl * pageControl;

@end

@implementation JZScrollViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    self.view.backgroundColor = [UIColor whiteColor];
    
    [self initScroll];
    [self addImageWithtag:1000];
    [self initpageControl];
}

//初始化Scroll
- (void)initScroll
{
    UIScrollView * scroll = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, [UIScreen mainScreen].bounds.size.height)];
    scroll.showsHorizontalScrollIndicator = NO;
    scroll.showsVerticalScrollIndicator = NO;
    scroll.contentSize = CGSizeMake([UIScreen mainScreen].bounds.size.width * 3, 0);
    scroll.pagingEnabled = YES;
    scroll.delegate = self;
    self.scrollView = scroll;
    [self.view addSubview:self.scrollView];
}

//初始化pageControl
- (void)initpageControl
{
    UIPageControl * page = [[UIPageControl alloc] initWithFrame:CGRectMake(([UIScreen mainScreen].bounds.size.width - 200) / 2, 300 - 30, 200, 30)];
    page.numberOfPages = 3;
    page.currentPage = 0;
    page.currentPageIndicatorTintColor = [UIColor blackColor];
    page.pageIndicatorTintColor = [UIColor greenColor];
    page.userInteractionEnabled = NO;
    
    self.pageControl = page;
    [self.view addSubview:page];
}

//添加图片
- (void)addImageWithtag:(NSInteger) tag
{
    for(int i = 0; i < 3; i++){
        NSString * name = [NSString stringWithFormat:@"%d.jpg", i + 1];
        UIImage * image = [UIImage imageNamed:name];
        UIImageView * imageView = [[UIImageView alloc] initWithFrame:CGRectMake(i * [UIScreen mainScreen].bounds.size.width, 100, [UIScreen mainScreen].bounds.size.width, 200)];
        imageView.tag = tag + i;
        imageView.image = image;
        
        [self.scrollView addSubview:imageView];
    }
}

//滚动图片达到轮播图的效果
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    CGFloat scrollX = self.scrollView.contentOffset.x + [UIScreen mainScreen].bounds.size.width / 2;
    int num = (int)(scrollX / [UIScreen mainScreen].bounds.size.width);
    NSLog(@"%d", num);
    self.pageControl.currentPage = num;
}

@end

时间: 2024-09-30 21:24:03

UIScrollView手动轮播图的相关文章

原生js手动轮播图

手动轮播图,为轮播图中的一种,轮播图主要有无缝轮播,手动轮播,延迟轮播,切换轮播等等... 轮播图主要用于展现图片,新出商品,词条,又能美观网页.給网页中增加动态效果. 手动轮播,是小编认为最简单的一种轮播方式,既能左右翻页,还能通过悬浮按钮,快速预览图片,所以今天就给大家写一个原生js手动轮播图. 一,利用JavaScript制作手动轮播图,首先排版. 引入默认样式表(可以手写): <link rel="stylesheet" href="css/Default st

UIScrollView自动轮播图

添加定时器,自动播放图片列表 #import "JZScrollViewController.h" @interface JZScrollViewController () <UIScrollViewDelegate> @property (nonatomic, strong) UIScrollView * scrollView;@property (nonatomic, strong) UIPageControl * pageControl;@property (nona

iOS UIScrollView 实现轮播图

利用UIScrollView实现轮播图 , 需要三个ImageView轮流切换,具体原理就不讲解了. 具体实现代码如下: <span style="font-size:24px;">// // ViewController.m // PhotosShowDemo // // Created by 帝炎魔 on 16/5/29. // Copyright © 2016年 帝炎魔. All rights reserved. // #import "ViewContro

自动轮播图

自动轮播图已经完成,为方便大家阅览源码如下为方便大家使用,有什么不懂大家可以给我留言 <style type="text/css"> * { margin: 0; padding: 0; text-decoration: none; list-style-type: none; } /*切换按钮*/ .arrow{ width: 50px; height: 50px; color: #000; font-size: 30px; border-radius:25px ; ba

Axure自动轮播图效果

图片轮播(其中我使用的Axure为8.0版本) 1:添加一个图片原件 2:单击图片,右键选中 "转换为动态面板" 选择后会出现为右下角的样子 3.双击右下角的"动态面板",并点击复制,复制两张图片,总共三张(图片张数可以自己定),确认后如右图所示: 4.双击State1下的图片,会重新出现一个页面,双击图片将State2,State3分别将图片换成不同的图片,并给出相同的宽,高,最后效果如下所示: 鼠标放在图片上会显示相应的图片, 5.单击"概要:页面&q

swift开发之 -- 自动轮播图(UIScrollView+UIPageControl+Timer)

比较简单,原理就不说了,这里只做记录: 代码如下: 1,准备 var pageControl:UIPageControl? var myscrollView:UIScrollView? var myTimer:Timer? var mycurrentPage:NSInteger? var courses = [ ["name":"first","pic":"1.jpeg"], ["name":"s

ios开发之 -- 自动轮播图创建

这里是oc版本的,简单记录下: 具体代码如下: 1,准备 #define FRAME [[UIScreen mainScreen] bounds] #define WIDTH FRAME.size.width #define HEIGHT FRAME.size.height 2,具体实现 //scrollview的添加 _bigScrollView = [[UIScrollView alloc]initWithFrame:CGRectMake(0, 20, WIDTH, HEIGHT)]; _b

用Vue来实现音乐播放器(八):自动轮播图啊

slider.vue组件的模板部分 <template> <div class="slider" ref="slider"> <div class="slider-group" ref="sliderGroup"> //要注意slot插槽里面的数据要先渲染出来 <slot> </slot> </div> <div class="dots&q

JavaScript 简易版 自动轮播 手动轮播 菜鸟交流

本人刚刚接触前端,许多知识还不了解,以前经常到博客园查询自己需要的东西,现在也终于反客为主了.作为新手,所展示的东西也是浅显易懂,希望同是新手的伙伴们共同交流.共同进步,若是成功捕获一位大大,也请您赐教.不知道在这里能否有幸找到一位耐心点的师傅,我未来的师傅啊,快来这里啊~~ 不说废话了,直接上代码 1 <!DOCTYPE html> 2 <html> 3 4 <head> 5 <meta charset="UTF-8"> 6 <t