IOS中实现类似淘宝广告栏图片无限循环

要做现在已完成的项目的Iphone版了，作为一个只看了一下OC的IOS新手来说，光这个首页的新闻广告就搞了半天。我知道iOS上有很多现成的东西，直接就拿来用就好了。所以关于这个图片滚动的效果我也去网上找了下，在code4app上确实找到了很多demo。但是没有一个符合要求的，要么不能自动滚动。就算实现了自动滚动，但是滚动方式是0,1,2,3,2,1,0这样的从左到右，再从右到左的样子。这些都不符合我这边要实现淘宝首页图片滚动的需求。

没办法只能自己尝试着修改，参考了Android中的实现。定义一个足够大得数组，用以标记当前滚动位置。在Adapter的getView中通过求余(%)运算符来控制在自动切换时要显示的图片，同时重写Gallery即可。但是在iOS中哪来的Adapter，又怎么重写ScorllView。对于作为新手的我貌似不简单。

最后想了一个简单地方法，就是向ScrollView中添加足够大的元素(如:100x4,其中100是循环次数，4是实际要显示的图片数量)，在自动滚动到第100x4张图片时，将滚动标记重置为1。当然这里表示滚动位置的PageController还是要用求余运算符控制(%)一下的。下面是部分代码，完整工程在本文最后。

用了网上的一个组件EScrollerView,EScrollerView.h

#import <UIKit/UIKit.h>

@protocol EScrollerViewDelegate <NSObject>
@optional
-(void)EScrollerViewDidClicked:(NSUInteger)index;
@end

@interface EScrollerView : UIView<UIScrollViewDelegate> {
	CGRect viewSize;
	UIScrollView *scrollView;
	NSArray *imageArray;
    NSArray *titleArray;
    UIPageControl *pageControl;
    id<EScrollerViewDelegate> delegate;
    int currentPageIndex;
    UILabel *noteTitle;
}
@property(nonatomic,retain)id<EScrollerViewDelegate> delegate;
-(id)initWithFrameRect:(CGRect)rect ImageArray:(NSArray *)imgArr TitleArray:(NSArray *)titArr;

-(void) autoSwitchPage;
@end

EScrollerView.m

#import "EScrollerView.h"
@implementation EScrollerView

static CGFloat SWITCH_FOCUS_PICTURE_INTERVAL = 5.0; //切换间隔时间

static NSInteger ITEM_NUM = 3; //实际包含的图片数量

@synthesize delegate;

- (void)dealloc {
	[scrollView release];
    [noteTitle release];
	delegate=nil;
    if (pageControl) {
        [pageControl release];
    }
    if (imageArray) {
        [imageArray release];
        imageArray=nil;
    }
    if (titleArray) {
        [titleArray release];
        titleArray=nil;
    }
    [super dealloc];
}
-(id)initWithFrameRect:(CGRect)rect ImageArray:(NSArray *)imgArr TitleArray:(NSArray *)titArr
{
    
	if ((self=[super initWithFrame:rect])) {
        self.userInteractionEnabled=YES;
        titleArray=[titArr retain];
        NSMutableArray *tempArray=[NSMutableArray arrayWithArray:imgArr];
        [tempArray insertObject:[imgArr objectAtIndex:([imgArr count]-1)] atIndex:0];
        [tempArray addObject:[imgArr objectAtIndex:0]];
		imageArray=[[NSArray arrayWithArray:tempArray] retain];
		viewSize=rect;
        NSUInteger pageCount=[imageArray count];
        scrollView=[[UIScrollView alloc]initWithFrame:CGRectMake(0, 0, viewSize.size.width, viewSize.size.height)];
        scrollView.pagingEnabled = YES;
        scrollView.contentSize = CGSizeMake(viewSize.size.width * pageCount, viewSize.size.height);
        scrollView.showsHorizontalScrollIndicator = NO;
        scrollView.showsVerticalScrollIndicator = NO;
        scrollView.scrollsToTop = NO;
        scrollView.delegate = self;
            for (int i=0; i<pageCount; i++) {
                NSString *imgURL=[imageArray objectAtIndex:i];
                UIImageView *imgView=[[[UIImageView alloc] init] autorelease];
                if ([imgURL hasPrefix:@"http://"]) {
                    //网络图片 可以使用sdwebimage实现图片的异步加载
                }
                else
                {
                    
                    UIImage *img=[UIImage imageNamed:[imageArray objectAtIndex:i]];
                    [imgView setImage:img];
                }
                
                [imgView setFrame:CGRectMake(viewSize.size.width*i, 0,viewSize.size.width, viewSize.size.height)];
                imgView.tag=i;
                UITapGestureRecognizer *Tap =[[[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(imagePressed:)] autorelease];
                [Tap setNumberOfTapsRequired:1];
                [Tap setNumberOfTouchesRequired:1];
                imgView.userInteractionEnabled=YES;
                [imgView addGestureRecognizer:Tap];
                [scrollView addSubview:imgView];
            }
        
        
        [scrollView setContentOffset:CGPointMake(viewSize.size.width, 0)];
        [self addSubview:scrollView];

        [self performSelector:@selector(autoSwitchPage) withObject:nil afterDelay:SWITCH_FOCUS_PICTURE_INTERVAL];

        
        //说明文字层
        UIView *noteView=[[UIView alloc] initWithFrame:CGRectMake(0, self.bounds.size.height-33,self.bounds.size.width,33)];
        [noteView setBackgroundColor:[UIColor colorWithRed:0.8 green:0.8 blue:0.8 alpha:0.5]];
        
        float pageControlWidth=(ITEM_NUM-2)*10.0f+40.f;
        float pagecontrolHeight=20.0f;
        pageControl=[[UIPageControl alloc]initWithFrame:CGRectMake((self.frame.size.width-pageControlWidth),6, pageControlWidth, pagecontrolHeight)];
        pageControl.currentPage=0;
        pageControl.numberOfPages=ITEM_NUM;
        [noteView addSubview:pageControl];
        
        noteTitle=[[UILabel alloc] initWithFrame:CGRectMake(5, 6, self.frame.size.width-pageControlWidth-15, 20)];
        [noteTitle setText:[titleArray objectAtIndex:0]];
        [noteTitle setBackgroundColor:[UIColor clearColor]];
        [noteTitle setFont:[UIFont systemFontOfSize:13]];
        [noteView addSubview:noteTitle];
        
        [self addSubview:noteView];
        [noteView release];
	}
	return self;
}

//自动定时切换图片
-(void)autoSwitchPage {
    NSLog(@"---autoSwitchPage,CURR_INDEX:%i",currentPageIndex);
    int auto_curr_index = currentPageIndex;
    auto_curr_index ++;
    //当自动滚动到数组的右边界时，重置滚动标记，一般不会发生这种情况
    if(currentPageIndex == ([imageArray count]-1)) {
        auto_curr_index = 1;
    }
    [scrollView setContentOffset:CGPointMake((auto_curr_index) * viewSize.size.width, 0) animated:YES];

    [self performSelector:@selector(autoSwitchPage) withObject:nil afterDelay:SWITCH_FOCUS_PICTURE_INTERVAL];
}

//这个方法，在网上查了一下，当ScrollView的contentOffset发生改变是就会调用
- (void)scrollViewDidScroll:(UIScrollView *)sender
{
    NSLog(@"--scrollViewDidScroll,contentOffset.x:%f",scrollView.contentOffset.x);
    CGFloat pageWidth = scrollView.frame.size.width;
    int page = floor((scrollView.contentOffset.x - pageWidth / 2) / pageWidth) + 1;
    currentPageIndex=page;
    
    pageControl.currentPage=(page-1)%ITEM_NUM;
    int titleIndex=page-1;
    if (titleIndex==[titleArray count]) {
        titleIndex=0;
    }
    if (titleIndex<0) {
        titleIndex=[titleArray count]-1;
    }
    [noteTitle setText:[titleArray objectAtIndex:titleIndex]];
}
- (void)scrollViewDidEndDecelerating:(UIScrollView *)_scrollView
{
    if (currentPageIndex==0) {
      
        [_scrollView setContentOffset:CGPointMake(([imageArray count]-2)*viewSize.size.width, 0)];
    }
    if (currentPageIndex==([imageArray count]-1)) {
       
        [_scrollView setContentOffset:CGPointMake(viewSize.size.width, 0)];
        
    }

}
- (void)imagePressed:(UITapGestureRecognizer *)sender
{

    if ([delegate respondsToSelector:@selector(EScrollerViewDidClicked:)]) {
        [delegate EScrollerViewDidClicked:sender.view.tag];
    }
}

@end

ViewController

#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
        
    int times = 100; //循环次数
    
    NSArray *imgArray = [NSArray arrayWithObjects:@"1.jpg",@"2.jpg",@"3.jpg", nil];
    NSMutableArray *tempArray=[NSMutableArray arrayWithArray:imgArray];
    for(int i=0;i<times;i++) {
        for(int j=0;j<[imgArray count];j++) {
            [tempArray addObject:[imgArray objectAtIndex:j]];
        }
    }

    NSArray *titleArray = [NSArray arrayWithObjects:@"11",@"22",@"33", nil];
    NSMutableArray *tempArray2 = [NSMutableArray arrayWithArray:titleArray];
    for(int j=0;j<times;j++) {
        for(int i=0;i<[titleArray count];i++) {
            [tempArray2 addObject:[titleArray objectAtIndex:i]];
        }
    }
    
    EScrollerView *scroller=[[EScrollerView alloc] initWithFrameRect:CGRectMake(0, 0, 320, 150)
                                                          ImageArray:tempArray
                                                          TitleArray:tempArray2];
    scroller.delegate=self;
    [self.view addSubview:scroller];
    [scroller release];
    
}
-(void)EScrollerViewDidClicked:(NSUInteger)index
{
    NSLog(@"index--%d",index);
}
- (void)didReceiveMemoryWarning
{
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

@end

工程地址:http://download.csdn.net/detail/u011638883/6307851

转载请保留出处:/article/2121181.html