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

时间:2021-12-15 20:29:22

           要做现在已完成的项目的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

转载请保留出处:http://blog.csdn.net/u011638883/article/details/11933135