您的位置:首页 > 产品设计 > UI/UE

ios UIScrollView 循环滑动

2012-11-14 21:40 393 查看
demo地址 1: http://download.csdn.net/detail/take8619702/4767432
demo地址 2: http://download.csdn.net/detail/take8619702/4767443
demo地址 3: http://download.csdn.net/detail/take8619702/4767459
1.普通分页滑动

myScrollView = [[UIScrollViewalloc]initWithFrame:CGRectMake(0,0,320,460)];
[myScrollViewsetContentSize:CGSizeMake(pageWidth*3,460)];
[myScrollViewsetBackgroundColor:[UIColorscrollViewTexturedBackgroundColor]];
[myScrollViewsetPagingEnabled:YES];//当此属性设置为YES时,才能自动分页
[self.viewaddSubview:myScrollView];
2.循环滑动

实现UIScrollViewDelegate代理: [myScrollViewsetDelegate:self];
初始化时,myScrollView 置于中间: [myScrollView setContentOffset:CGPointMake(pageWidth, 0)]

滑动结束之后,回到中间: [myScrollViewsetContentOffset:CGPointMake(pageWidth,0)];
代理方法:
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
if (scrollView.contentOffset.x <=0) {
[scrollView setContentOffset:CGPointMake(pageWidth,0)];
}
if (scrollView.contentOffset.x >=2*pageWidth) {
[scrollView setContentOffset:CGPointMake(pageWidth,0)];
}

}

- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
[scrollView setContentOffset:CGPointMake(pageWidth,0)animated:YES];
}

3.加上图片查看效果

这两句的位置不能交换

[selfloadScrollViewSubViews];
[myScrollViewsetContentOffset:CGPointMake(pageWidth,0)];

- (void)loadScrollViewSubViews
{
imageView1 = [[UIImageViewalloc]initWithImage:[UIImageimageNamed:@"1.jpg"]];
imageView2 = [[UIImageViewalloc]initWithImage:[UIImageimageNamed:@"2.jpg"]];
imageView3 = [[UIImageViewalloc]initWithImage:[UIImageimageNamed:@"3.jpg"]];

[imageView1 setFrame:CGRectMake( 0,0,
pageWidth,460)];
[imageView2 setFrame:CGRectMake( pageWidth,0,pageWidth,460)];
[imageView3 setFrame:CGRectMake(2*pageWidth,0,pageWidth,460)];

[myScrollView addSubview:imageView1];
[myScrollView addSubview:imageView2];
[myScrollView addSubview:imageView3];
}
4.循环效果并未出现,还要加上交换图片的代码

- (void)previousImageViewWithImage
{
UIImage * temp = [imageView1.imageretain];
imageView1.image =imageView2.image;
imageView2.image =imageView3.image;
imageView3.image = temp;
[temp release];
}

- (void)nextImageViewWithImage
{
UIImage * temp = [imageView3.imageretain];
imageView3.image =imageView2.image;
imageView2.image =imageView1.image;
imageView1.image = temp;
[temp release];
}

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
if (scrollView.contentOffset.x <=0) {
currentImageCount--;
[selfpreviousImageViewWithImage];
[scrollView setContentOffset:CGPointMake(pageWidth,0)];
}
if (scrollView.contentOffset.x >=2*pageWidth) {
currentImageCount++;
[selfnextImageViewWithImage];
[scrollView setContentOffset:CGPointMake(pageWidth,0)];
}

}

5.完美的ScrollView循环
为什么UIImage * temp = [imageView3.image retain];在此处需要retain,如果不加此句,按home键之后,再回到程序滑动,程序会crash。

感谢Eric yang(对于此问题的解答)

为了显示效果,去掉进度条。

进阶一:

1.知道当前所指向图片

给程序增加计数器,指向当前图片。

int currentImageCount;
初始化为33333331,跟上面的第2点同步。(为了取模3的值,所以不是1,而是33331,随便几个3)

2.如果向后滑动,currentImageCount++;
如果向前滑动,currentImageCount--;

3.为了防止回滑多次,乱成图片,程序混乱
所以还需要增加判断,在:

- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView

if (currentImageCount == 0) {
currentImageCount = 33333330;
}

4.给myScrollView一个tap事件,点击图片,弹出当前图片计数(理论计数)

- (void)addTapEventOnMyScrollView
{
tap = [[UITapGestureRecognizeralloc]initWithTarget:selfaction:@selector(tapEvent)];
[myScrollViewaddGestureRecognizer:tap];
}

- (void)tapEvent
{
NSString * strMsg = [NSStringstringWithFormat:@"当前图片理论计数:%i",curentImage];
UIAlertView * alert = [[UIAlertViewalloc]initWithTitle:@"图片计数"
message:strMsg delegate:nilcancelButtonTitle:@"确定"otherButtonTitles:nil];
[alert show];
[alert release];
}

5.增加一个pageControl,直观显示当前滑动

- (void)addMyPageControl
{
myPageControl = [[UIPageControlalloc]initWithFrame:CGRectMake(110,420,100,20)];
[myPageControlsetNumberOfPages:3];
[myPageControl
setCurrentPage:curentImage];
[self.viewaddSubview:myPageControl];
}

进阶二:
1.增加定时器,图片自动滑动

- (void)addAutoTimer
{
myAutoTimer = [NSTimerscheduledTimerWithTimeInterval:5.0target:selfselector:@selector(autoChangeScrollView)userInfo:nilrepeats:YES];
}
- (void)autoChangeScrollView
{
[myScrollViewsetContentOffset:CGPointMake(2*pageWidth,0)animated:YES];
}
2.为了pageControl,与tap事件连接,修攺autoChangeScrollView

- (void)autoChangeScrollView
{
[myScrollViewsetContentOffset:CGPointMake(2*pageWidth,0)animated:YES];
}
3.开始手动滑动时,停止定时器,手动滑动结束后停止定时器

- (void)stopAutoTimer
{
if (myAutoTimer) {
[myAutoTimer invalidate];
myAutoTimer = nil;
}
}

- (void)restartAutoTimer
{
if (!myAutoTimer) {
[self addAutoTimer];
}
}

4.如果用户向后滑动,则自动向后滑动。如果用户向前滑动,则自动向前滑动。增加滑动方向布尔

BOOL isGoBefor;
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
if (scrollView.contentOffset.x <=0) {
isGoBefor = YES;
}
if (scrollView.contentOffset.x >=2*pageWidth) {
isGoBefor = NO;
}

}

自动切换函数

- (void)autoChangeScrollView
{
if (isGoBefor) {
[myScrollViewsetContentOffset:CGPointMake(0,0)animated:YES];
} else {
[myScrollViewsetContentOffset:CGPointMake(2*pageWidth,0)animated:YES];
}
}

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
if (scrollView.contentOffset.x <=0) {
isGoBefor = YES;
currentImageCount--;

curentImage =
currentImageCount%3;
//----------------------------------------------------------------------------------------------增加PageControl直观显示当前滑动位置
[myPageControl
setCurrentPage:curentImage];

[selfpreviousImageViewWithImage];
[scrollView setContentOffset:CGPointMake(pageWidth,0)];
}
if (scrollView.contentOffset.x >=2*pageWidth) {
isGoBefor = NO;
currentImageCount++;

curentImage =
currentImageCount%3;
//----------------------------------------------------------------------------------------------增加PageControl直观显示当前滑动位置
[myPageControl
setCurrentPage:curentImage];

[selfnextImageViewWithImage];
[scrollView setContentOffset:CGPointMake(pageWidth,0)];
}
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: