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

UIScrollView UIPageControl

2015-10-22 09:27 357 查看

1. UIScrollView:

1.1. 属性:

contentSize:设置滑动的范围

contentOffset:偏移位置---屏幕的原点在整个滑动scroll坐标系的位置(CGPoint)

bounces:边界回弹

indicatorStyle:滚动条的样式

pagingEnabled:是否整页滑动

scrollEnabled:是否允许滑动

- (void)addViews {
self.backgroundColor = [UIColor whiteColor];

self.img = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"1.jpeg"]];
self.img.frame = CGRectMake(0, 0, 300, 500);

#pragma mark-----1. UIScrollView初始化:
self.scroll = [[UIScrollView alloc] initWithFrame:CGRectMake(50, 50, 300, 500)];// 图片只是一个小窗口
//    self.scroll = [[UIScrollView alloc] initWithFrame:[UIScreen mainScreen].bounds];// 图片是全屏的效果
self.scroll.backgroundColor = [UIColor orangeColor];
[self.scroll addSubview:self.img];

#pragma mark------2. 属性:
// 滑动的范围: 要想有滑动效果 contentSize的值一定要比frame的大
self.scroll.contentSize = CGSizeMake(900, 1000);

// 初始位置的偏移: contentSize范围的contentOffset点和scroll原点重合时的效果(屏幕的原点在scroll坐标系下的位置)
self.scroll.contentOffset = CGPointMake(100, 0);
[self.scroll setContentOffset:CGPointMake(00, 0) animated:YES];// 和直接用.contentOffset设置,是一个意思

//隐藏滚动条:  设置为NO时隐藏  默认是YES
self.scroll.showsHorizontalScrollIndicator = YES;// 水平方向的滚动条
self.scroll.showsVerticalScrollIndicator = YES;// 垂直方向的滚动条

// 边界回弹效果: 滑到最边上的时候会弹回去...设置为NO没有此效果  默认是YES
self.scroll.bounces = YES;

// 滚动条的样式: (设置这个时,不能隐藏滚动条)
self.scroll.indicatorStyle = UIScrollViewIndicatorStyleWhite ;

// 整页滑动: 设置YES之后,每次滑动跳转的都是整张图片,滑动太小:回到原图片,滑动太大:跳到下一张图片
self.scroll.pagingEnabled = YES;

// 设置能否滑动: 默认YES
self.scroll.scrollEnabled = YES;

#pragma 添加第二张图片:
self.img1 = [[UIImageView alloc] initWithFrame:CGRectMake(300, 0, 300, 1000)];
self.img1.image = [UIImage imageNamed:@"2.jpeg"];
[self.scroll addSubview:self.img1];

// 点击状态栏回到顶部 (没有效果)
self.scroll.scrollsToTop = YES;
#pragma 添加第三张图片:
self.img2 = [[UIImageView alloc] initWithFrame:CGRectMake(600, 0, 300, 500)];
self.img2.image = [UIImage imageNamed:@"3.jpeg"];
[self.scroll addSubview:self.img2];

self.scroll.delegate = self;

// 缩放的倍数  缩放时要设置代理
self.scroll.maximumZoomScale = 2;
self.scroll.minimumZoomScale = 0.5;

[self addSubview:self.scroll];

}


控制缩放的代理方法:<UIScrollViewDelegate>

- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView;{
return self.img2;

}
注意:

添加图片时注意图片左上角点的坐标,主要是横坐标,每张图片都设置的不一样

实现缩放时,要实现代理方法<UIScrollViewDelegate>

添加多张图片时,就可以给scrollView建几个子[b]scrollView,一个子scrollView放一张图片,这样就不会影响每一张图片的缩放

[/b]

一些代理方法:

-(void)scrollViewWillBeginDragging:(UIScrollView *)scrollView {
NSLog(@"即将开始拖拽");
}

-(void)scrollViewWillBeginDecelerating:(UIScrollView *)scrollView {
NSLog(@"即将开始减速");
}

-(void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate {
NSLog(@"已经拖拽");
}
-(void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {
NSLog(@"已经减速");

}


缩放的一些属性:

minimumZoolScale:缩小的最小比例

maximumZoolScale:放大的最大比例

zoomScale:设置变化比例

zooming:是否正在进行缩放反弹

bouncesZoom:控制缩放的时候是否会反弹

2. UIpageControl:

pageIndicatorTintColor:未选中点的颜色

currentPageIndicatorTintColor:当前点的颜色

currentPage:当前页数

- (void)addViews {
self.backgroundColor = [UIColor whiteColor];

#pragma mark ---- 1. 初始化(和之前的都一样-->三步)
self.page = [[UIPageControl alloc] initWithFrame:CGRectMake(50, 50, 200, 50)];
self.page.backgroundColor = [UIColor orangeColor];
[self addSubview:self.page];
#pragma mark ---- 2. 属性
// 其他未被选中点点的颜色
self.page.pageIndicatorTintColor = [UIColor blackColor];

// 被选中的点点的颜色
self.page.currentPageIndicatorTintColor = [UIColor redColor];

// 分几个小圆点
self.page.numberOfPages = 3;

// 继承于UIControl 所以有添加事件的方法
[self.page addTarget:self action:@selector(pageAction:) forControlEvents:UIControlEventValueChanged];

// 当前在第几页面:currentPage
self.page.currentPage = 2;
}

- (void)pageAction:(UIPageControl *)sender {

NSLog(@"%ld", sender.currentPage);

}
注意:

UIPageControl触发事件时使用的是:UIControlEventValueChanged 不是UIControlEventTouchUpInside
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: