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

UIScrollView--滚动视图

2014-06-08 23:34 393 查看
一、什么是UIScrollView,应用于哪种场景?

UIScrollView是一个滚动视图。

当要显示的视图大于设备屏幕的尺寸时,该如何显示这个视图呢?此时我们就可以使用UIScrollView。

有很多应用首次打开启动时,会出现几个介绍应用功能的画面。我们可以向前向后滑动,推出界面。这也是应用UIScrollView实现的。

二、UIScrollView简介

contentSize:ScrollView显示的视图的大小,一般指定为在ScrollView的子视图的大小,当ScrollView有多个子视图时,设置为所有子视图的总大小。

contentOffsize:某个子视图在整个UIScrollView中得偏移量(相对于子视图的起点)。

contentInset:是scrollView的内边距。

三、一般用法

//1、初始化一个imageView,将imgaeView放入scrollView控件中。
UIImage *image = [UIImage imageNamed:@"001.jpeg"];
UIImageView *imageView = [[UIImageView alloc] initWithImage:image];
[_scrollView addSubview:imageView];
//2、设置scrollView的contentSize,contentInset。
[_scrollView setContentSize: [image size]];
[_scrollView setContentInset: UIEdgeInsetsMake(10.0, 20.0, 30.0, 40.0)];
//3、得到contentOffset
CGPoint point = [_scrollView contentOffset];
//4、设置contentOffset
[_scrollView setContentOffset:point animated:YES];


四、与UIPageControl结合,产生应用首次启动时简介画面的效果

@interface ViewController ()
{
UIScrollView *_scrollView;
UIPageControl *_pager;
}

@end

@implementation ViewController

- (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.

//1.创建UIScrollView
UIScrollView *scrollView = [[UIScrollView alloc] initWithFrame:self.view.bounds];

//取得图片的宽、高
CGFloat width = scrollView.bounds.size.width;
CGFloat height = scrollView.bounds.size.height;

//2.添加ScrollView的内容
for (NSInteger i=1; i<6; i++) {
//2.1 UIImage
NSString *imageFile = [NSString stringWithFormat:@"%d.jpg", i];
UIImage *image = [UIImage imageNamed: imageFile];
//2.2 UIImageView
UIImageView *imageView = [[UIImageView alloc] initWithImage:image];
//2.3 设置UIImageView的位置
NSInteger x = (i - 1) * scrollView.bounds.size.width;
[imageView setFrame:CGRectMake(x, 0, width, height)];

//2.4 将图像添加到滚动视图
[scrollView addSubview:imageView];
}

[scrollView setContentSize: CGSizeMake(5 * width, height)];

[scrollView setBounces:NO];//设置不支持弹簧
[scrollView setShowsHorizontalScrollIndicator:NO];//设置不像是横向滚动条

[scrollView setPagingEnabled:YES];//设置支持分页
[scrollView setDelegate:self];//设置代理

[self.view addSubview:scrollView];//将scrollView添加到视图中

//创建UIPageControl
UIPageControl *pageControl = [[UIPageControl alloc] init];
pageControl.bounds = CGRectMake(0, 0, 150, 50.0);
pageControl.center = CGPointMake(self.view.bounds.size.width/2, self.view.bounds.size.height- 50.0);

[pageControl setNumberOfPages:5];//设置页数
[pageControl setCurrentPage:0];//设置当前页

[pageControl setPageIndicatorTintColor:[UIColor blackColor]];//默认颜色
[pageControl setCurrentPageIndicatorTintColor:[UIColor whiteColor]];//选中颜色

[pageControl addTarget:self action:@selector(updatePageChange:) forControlEvents:UIControlEventValueChanged];//添加更新方法

[self.view addSubview:pageControl];

_scrollView = scrollView;
_pager = pageControl;
}

//实现UIScrollViewDelegate协议的方法,偏移视图
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
NSInteger pageNo = scrollView.contentOffset.x / scrollView.bounds.size.width;

[_pager setCurrentPage:pageNo];
}
//实现UIPageControl值改变处理函数
- (void)updatePageChange:(UIPageControl *)pageControl
{
CGFloat offsetX = [pageControl currentPage] * _scrollView.bounds.size.width;

[_scrollView setContentOffset:CGPointMake(offsetX, 0) animated:YES];
}

- (void)didReceiveMemoryWarning
{
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息