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

iOS开发之UI_UIScrollView(下)

2015-09-22 10:21 567 查看
【UIScrollView实现无限滚动的相册】
·无限滚动的相册的原理就是利用UIScrollView来实现图片可以左右两个方向滚动(也可以上下两个方向滚动),与单方向滚动不同的是,两个方向的滚动为了达到滚动效果的流畅,一般选择在一组图片之前(第一张图片之前)先添加最后一张图片,在最后一张图片后面添加第一张图片,添加的这两张图片的目的是为了在偏移量到添加的两张图片的时候,可以做出判断,进而设置偏移量使视图滚动到对应的图片位置。
1.创建一个UIScrollView并完成相关的设置
self.scrollView = [[UIScrollView
alloc] initWithFrame:CGRectMake(0,
0, WIDTH,
HEIGHT)];
self.scrollView.backgroundColor = [UIColor
orangeColor];
[self.view
addSubview:self.scrollView];
[self.scrollView
release];
self.scrollView.contentSize =
CGSizeMake(9 *
WIDTH, HEIGHT);
self.scrollView.pagingEnabled =
YES;// 按照页进行滚动
self.scrollView.bounces =
NO;// 设置边界回弹效果
2.添加最后一张图片到第一个视图的位置
UIImageView *firstImage = [[UIImageView
alloc] initWithFrame:CGRectMake(0,
0, WIDTH,
HEIGHT)];
firstImage.image = [UIImage
imageNamed:@"h7.jpeg"];
[self.scrollView
addSubview:firstImage];
[firstImage release];
firstImage.userInteractionEnabled =
YES;
3.添加组图中的7张图片到UIScrollView中
for (NSInteger i =
1; i < 8; i++) {
NSString *imageName = [NSString
stringWithFormat:@"h%ld.jpeg", i];
UIImageView *imageView = [[UIImageView
alloc] initWithFrame:CGRectMake(WIDTH * i,
0, WIDTH,
HEIGHT)];
imageView.image = [UIImage
imageNamed:imageName];
[self.scrollView
addSubview:imageView];
[imageView release];
imageView.userInteractionEnabled =
YES;
}
4.添加第一张图片到最有一个页面
UIImageView *lastImage = [[UIImageView
alloc] initWithFrame:CGRectMake(8 *
WIDTH, 0,
WIDTH, HEIGHT)];
lastImage.image = [UIImage
imageNamed:@"h1.jpeg"];
[self.scrollView
addSubview:lastImage];
[lastImage release];
lastImage.userInteractionEnabled =
YES;
5.为了能显示第一张图片我们需要先设置一个偏移量,这样能够直接显示第一张图片
self.scrollView.contentOffset =
CGPointMake(WIDTH,
0);
6.签订UIScrollViewDelegate协议,设置代理人self.scrollView.delegate =
self;
// 实现方法滑动结束,触发的协议方法
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {
if (self.scrollView.contentOffset.x ==
8 * WIDTH) {
self.scrollView.contentOffset =
CGPointMake(1 *
WIDTH, 0);
} else
if (self.scrollView.contentOffset.x ==
0) {
self.scrollView.contentOffset =
CGPointMake(7 *
WIDTH, 0);
}
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: