iOS 有关自动轮播图片

  //初始化当前视图
        _currentImageView = [[UIImageView alloc] init];
        [_currentImageView setImageWithURL:[NSURL URLWithString:[array_pic objectAtIndex:0]]];
        _currentImageView.frame = CGRectMake(myScroller.frame.size.width, 0, myScroller.frame.size.width,180);
//        _currentImageView.contentMode = UIViewContentModeScaleAspectFill;
        [myScroller addSubview:_currentImageView];

        _nextImageView = [[UIImageView alloc] init];
        [_nextImageView  setImageWithURL:[NSURL URLWithString:[array_pic objectAtIndex:1]]];
        _nextImageView.frame = CGRectMake(myScroller.frame.size.width * 2, 0,  myScroller.frame.size.width,180);
//        _nextImageView.contentMode = UIViewContentModeScaleAspectFill;
        [myScroller addSubview:_nextImageView];

        //初始化上一个视图
        _previousView = [[UIImageView alloc] init];
        [_previousView setImageWithURL:[NSURL URLWithString:[array_pic objectAtIndex:3]]];
        _previousView.frame = CGRectMake(0, 0,myScroller.frame.size.width,180);
//        _previousView.contentMode = UIViewContentModeScaleAspectFill;

        [myScroller addSubview:_previousView];

    }

    {
        SMPageControl *pageControl = [[SMPageControl alloc] init];
        [pageControl setFrame:CGRectMake(0, myScroller.frame.size.height+64 - 10.0f,myScroller.frame.size.width,10.0f)];
        [pageControl setNumberOfPages:4];
        [pageControl setBackgroundColor:[UIColor clearColor]];
        [pageControl setCurrentPage:0];
        [pageControl setCurrentPageIndicatorTintColor:[UIColor lightGrayColor]];
        [pageControl setPageIndicatorTintColor:[UIColor grayColor]];
        myPageControl=pageControl;
        [self.view addSubview:myPageControl];
    }

if (![myTimer isValid]) {
        myTimer=[NSTimer scheduledTimerWithTimeInterval:5 target:self selector:@selector(updateAuto) userInfo:nil repeats:YES];
    }

#pragma mark 时钟动画调用方法
- (void)updateAuto
{
    if (_isDraging) {
        return;
    }

    CGPoint offset = myScroller.contentOffset;

    offset.x += self.view.frame.size.width;
    if (offset.x > self.view.frame.size.width*2) {
        offset.x = self.view.frame.size.width;
    }

    [myScroller setContentOffset:offset animated:YES];
}

#pragma mark - 代理方法
 #pragma mark 准备开始拖动
 - (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
 {
         _isDraging = YES;
     }

 #pragma mark 视图停止滚动
 - (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
 {
         _isDraging = NO;
}

#pragma mark 已经拖动
- (void)scrollViewDidScroll:(UIScrollView *)scrollView{

    static int i = 0;//当前展示的是第几张图片

    float offset = scrollView.contentOffset.x;
    if (_nextImageView.image == nil || _previousView.image == nil) {

        //加载下一个视图
        [_nextImageView setImageWithURL:[NSURL URLWithString:[array_pic objectAtIndex:i == kCount ? 0: i+1]]];

        //加载上一个视图
        [_previousView setImageWithURL:[NSURL URLWithString:[array_pic objectAtIndex:i == 0 ? kCount : i - 1]]];
    }

    if (offset == 0) {
        _currentImageView.image = _previousView.image;
        scrollView.contentOffset = CGPointMake(scrollView.bounds.size.width, 0);
        _previousView.image = nil;

        if (i == 0) {
            i = kCount;
        }else{
            i -= 1;
        }

    }

    if (offset == scrollView.bounds.size.width * 2) {
        _currentImageView.image = _nextImageView.image;
        scrollView.contentOffset = CGPointMake(scrollView.bounds.size.width, 0);
        _nextImageView.image = nil;

        if (i == kCount) {
            i = 0;  //如果当前图片索引在最后一个,则重置为0,否则+1
        }else{
            i += 1;
        }
    }
     [myPageControl setCurrentPage:i];
}
时间: 2024-11-05 14:58:56

iOS 有关自动轮播图片的相关文章

js自动轮播图片的两种循环方法(原创)

用5个div,布局从左到右5张图片,从左到右5个div分别指定ID为img1,img2,img3,img4,img5.(背景是relative,5个div是相对于背景absolute定位) 显示如下: 方法一:(把一个div直接赋值给另一个,轮播一次要for循环5下) 1 function autoplay(){ 2 var x,y,baoliu; 3 baoliu=document.getElementById("img5").style.backgroundImage; 4 for

iOS开发笔记6:图片轮播及其无限循环效果

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

jQuery图片插件自动轮播原理解析

经常看到项目要用到图片轮播效果,一般的操作流程都是先到网上找一个好看的JQuery图片轮播插件,然后看下demo,再配下参数.好了,关机下班回家 其余的就交给插件吧. 是不是感觉有了jQuery,世界变得那么美好呢. 本人最近用的一个插件是 jquery.carousel.js,官方网站是:http://richardscarrott.co.uk/posts/view/jquery-carousel-plugin 下面,我们来讨论一下图片轮播原理. 首先来个简单的demo 效果图如下: 这是个导

iOS UI-UIScrollView控件实现图片轮播 (UIPageControl-分页指示器)

一.实现效果 实现图片的自动轮播            二.实现代码 storyboard中布局 代码: 1 #import "ViewController.h" 2 #define HMImageCount 5 3 @interface ViewController ()<UIScrollViewDelegate> 4 @property (weak, nonatomic) IBOutlet UIScrollView *scrollView; 5 @property (w

Viewpager图片自动轮播,网络图片加载,图片自动刷新

package com.teffy.viewpager; import java.util.ArrayList; import java.util.concurrent.Executors; import java.util.concurrent.ScheduledExecutorService; import java.util.concurrent.TimeUnit; import android.annotation.SuppressLint; import android.app.Act

Jquery+css实现图片无缝滚动轮播

Today,在XX学院的教学视频中,偶尔看到了Jquery+css实现图片无缝滚动轮播视频教程,虽然以前已写过类似的,但是我感觉他学的比较精简.为了方便以后做项目时直接拷贝,特地写出来,顺便和大家分享一下 最终实现界面如下: 页面加载时,自动轮播,轮播鼠标悬停在整个banner容器的时候,两边会显示向左,向右按钮,鼠标悬停在中下方索引圆圈的上面,自动跳转到相应的图片. banner容器里面包含了图片列表img,索引圆圈 num,还有按钮两个btn <div class="banner&qu

UI基于UIScrollView实现图片组手动轮换和自动轮播

#import "RootViewController.h" @interface RootViewController (){ UIPageControl * _pageControl; NSTimer * _timer; UIScrollView * scrV; UILabel * label; } @end @implementation RootViewController - (id)initWithNibName:(NSString *)nibNameOrNil bundl

简易图片自动轮播

根据前段时间学的大图轮播,自己做了一个简单的图片自动轮播 代码如下 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style> #body { width: 90%; border: 1px solid red; height: 1000px; margin: 0px auto; } #stage { widt

ViewPager + Handler 实现的图片自动轮播

首先上图看效果 我也是在网上看各种大牛们做的效果,很多都是自定义重写了一些控件来实现这个效果的.我把其中的一位大牛写的ViewPager的效果加上了Handler实现了自动轮播效果,在此做个笔记来以后温习使用! 自动轮播的核心代码如下: private final int AUTO_MSG = 1; private final int HANDLE_MSG = AUTO_MSG + 1; private static final int PHOTO_CHANGE_TIME = 1000;//定时