iOS图片轮播UIScrollView+UIPageControl

该方法实现了图片的轮播效果:

pictureLoop

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110
////  ViewController.swift//  PictureLoop////  Created by Benjamin on 12/3/15.//  Copyright  2015 Benjamin. All rights reserved.//

import UIKit

class ViewController: UIViewController,UIScrollViewDelegate {

@IBOutlet weak var pageControl1: UIPageControl!    @IBOutlet weak var scrollView1: UIScrollView!    let images = ["s1", "s2", "s3"]    var timer = NSTimer()    //图片的宽    var imageWidth:CGFloat!    //图片的高    var imageHeight:CGFloat!

override func viewDidLoad() {        super.viewDidLoad()    }

/**     该方法计算了真实地scrollView地frame的大小     详见:http://benjaminwhx.com/2015/12/03/IOS%E9%94%99%E8%AF%AF%E6%80%BB%E7%BB%93/     */    override func viewDidLayoutSubviews() {        super.viewDidLayoutSubviews()        let imageY: CGFloat = 0        imageWidth = self.scrollView1.frame.size.width        imageHeight = self.scrollView1.frame.size.height        for i in 0..<images.count {            let imageX = imageWidth * CGFloat(i)            let imageView = UIImageView(image: UIImage(named: images[i]))            imageView.frame = CGRectMake(imageX, imageY, imageWidth, imageHeight)            self.scrollView1.addSubview(imageView)        }        let contentWidth = CGFloat(images.count) * imageWidth        //设置scrollView的滚动范围        self.scrollView1.contentSize = CGSizeMake(contentWidth, 0)

//要分页        self.scrollView1.pagingEnabled = true

self.scrollView1.delegate = self

//取消水平垂直滚动条        scrollView1.showsHorizontalScrollIndicator = false        scrollView1.showsVerticalScrollIndicator = false

self.pageControl1.numberOfPages = images.count        self.pageControl1.currentPage = 0        addTimer()    }

//轮回下张图片    func nextImage() {        var currentPage = self.pageControl1.currentPage        if currentPage == images.count-1 {            currentPage = 0        } else {            currentPage++        }        let offsetX = imageWidth * CGFloat(currentPage)        self.scrollView1.contentOffset = CGPointMake(offsetX, 0)    }

//图片滚动时调用,设置pageControl的当前page    //(手动滑动 + 自动滚动 + 点击pageControl)都会触发    func scrollViewDidScroll(scrollView: UIScrollView) {        let offsetX = self.scrollView1.contentOffset.x        self.pageControl1.currentPage = Int(offsetX / imageWidth)    }

@IBAction func pageValueChanged(sender: UIPageControl) {        //用户点击点触发        print("value changed, current page: \(sender.currentPage)")        let offsetX = imageWidth * CGFloat(sender.currentPage)        self.scrollView1.contentOffset = CGPointMake(offsetX, 0)    }

//定时    func addTimer() {        self.timer = NSTimer.scheduledTimerWithTimeInterval(3, target: self, selector: "nextImage", userInfo: nil, repeats: true)        //添加到运行循环        NSRunLoop.currentRunLoop().addTimer(self.timer, forMode: NSRunLoopCommonModes)    }

//关闭定时器    func removeTimer() {        self.timer.invalidate()    }

//开始拖拽    func scrollViewWillBeginDragging(scrollView: UIScrollView) {        removeTimer()    }

//停止拖拽    func scrollViewDidEndDragging(scrollView: UIScrollView, willDecelerate decelerate: Bool) {        addTimer()    }

}
时间: 2024-11-01 11:50:11

iOS图片轮播UIScrollView+UIPageControl的相关文章

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

 项目中很多时候会碰到这个需求,实现多张图片的无限循环轮转,以前做过,项目中几个地方的都用到了,当时没有封装,几个地方都拷贝几乎一样的代码,代码复用性不好,今天没事封装了一下,使用起来比较简单.   首先,说说我实现循环轮转图片的思想,在UIScrollView中添加了3个UIImageView,并排排列,我们看到的永远只是第二个UIImageView,这样的话,你一直可以向左,向右滑动,当你向左滑动是,这是你滑动到了最后一个UIImageView不能在向左边滑动了,这时,我在后面悄悄的将第二个

iOS实现图片轮播效果_IOS

本文实例为大家分享了IOS图片轮播效果的实现过程,供大家参考,具体内容如下 平时APP中的广告位或者滚动的新闻图片等用到的就是图片轮播这种效果,实现方式主要有两种,一种ScrollView+ImageView,另一种则是通过CollectionView,今天总结的是ScrollView这种方式. 1.图片轮播效果实现 主要实现思路是:根据图片总数及宽高设置好ScrollView的大小,每切换一张图片相当于在ScrollView上进行一个图片宽度的移动行为,并加入定时器,实现自动轮播. 如图所示,

iOS开发中使用UIScrollView实现图片轮播和点击加载_IOS

UIScrollView控件实现图片轮播 一.实现效果 实现图片的自动轮播 二.实现代码 storyboard中布局 代码: 复制代码 代码如下: #import "YYViewController.h" @interface YYViewController () <UIScrollViewDelegate> @property (weak, nonatomic) IBOutlet UIScrollView *scrollview; /**  *  页码  */ @pro

IOS项目之图片轮播

今天做小区宝时,用到一个第三方ImagePlayerView用来做图片轮播,用着感觉非常爽, 这里就记录一下,感谢作者. // // ImagePlayerView.h // ImagePlayerView // // Created by 陈颜俊 on 14-6-5. // Copyright (c) 2014年 Chenyanjun. All rights reserved. // #import <UIKit/UIKit.h> typedef NS_ENUM(NSInteger, ICP

IOS实现图片轮播无限循环效果_IOS

本文接着上篇文章进行叙述讲解,主要为大家分享了图片轮播无限循环效果的实现方法,具体内容如下 之前说到第一个问题,ScrollView移动到最后一张图片时无法移动了,这是因为ScrollView已经移动到最后,而图片又是依次排列,自然也就无法移动. 解决办法是,我们换一个思路实现图片轮播效果,ScrollView上只放三个ImageView,屏幕始终显示中间的ImageView,左边和右边的ImageView分别代表前一张图片和后一张图片,屏幕移动的时候,中间的ImageView变化,同时左右两边

图片轮播默认从第4张开始

问题描述 图片轮播默认从第4张开始 从网上下的图片轮播效果,默认从第4张开始播放怎么改代码啊 var Effect = (function() { var Slider = function(o) { this.setting = typeof o === 'object' ? o : {}; this.target = this.setting.target || 'slider'; this.showMarkers = this.setting.showMarkers || false; t

jQuery插件slicebox实现3D动画图片轮播切换特效

 漂亮jQuery 3D动画图片轮播切换特效插件jquery.slicebox.js,基于jQuery,插件采用CSS 3D 动画效果,支持事件Callback调用,支持参数自定义配置,如:speed:600 切换速度.autoplay:true 是否自动播放,在浏览器兼容方面,需要浏览器支持CSS3变换变形属性,不支持的将看不到3D特效,推荐学习下代码. 使用方法: 1.加载插件和jQuery 1 2 3 4 <link type="text/css" rel="st

UI角度分析网页图片轮播控件Carousel Controls

·名词定义: - 图片: 字面意为图画﹑照片﹑拓片等的统称.在当前互联网业内,从展现的形式上看,可以简单的分为静态和动态两种:   - 轮播: 中文字面:"轮播",顾名思义,指轮流播放: 英文字面:"Carousel"包含有"旋转传送带"的释义: 在当前的互联网业内,"轮播"通常被用来指代"广告轮播",即在某一个广告位同一时间段内会有N个广告轮流播放,第一个出现的广告是随机的,每刷新一次都会换一个广告,以此

SharePoint页面定制:实现门户网站的图片轮播

这个想法是自己突然的一个想法,想想我们经常用SharePoint做门户网站,不知道你们多数项目都是怎么完成的,我们客户要求的效果都还是很严格的,所有展现起来,还是很漂亮的,但是很多时候的效果,还是难以展现,实在让人头疼.好在SharePoint还给我们提供了对象模型,我们可以使用web部件来完成展现,不过这不是我们今天的主题,web部件的基本功要求比较高,尤其编程能力,我的编程不好,大学学的C++就不好,自学的asp.net更加一知半解,好了,废话又多了,大家不要见怪啊!我们今天要做的,是通过j