爬爬爬之路:UI(七) UIScrollView,UIScrollViewDelegate UIPageControl 方法总结

来源：互联网发布：数据库的优化方法编辑：程序博客网时间：2024/06/14 17:18

UIScrollView

UIScrollView 擅长处理滑动界面和缩放界面两大功能

常用属性

一. 滚动相关

@property (nonatomic) CGPoint contentOffset;
偏移量, 设置原点的偏移
@property (nonatomic) CGSize contentSize;
ScrollView内容的范围, 也就是可滑动的范围
只有contentSize大于scrollView.frame.size的时候能够滚动
@property (nonatomic) BOOL bounces;
边界回弹, 默认是YES, 只有YES的时候才能让ScrollView在边界的时候可以弹动
@property (nonatomic) BOOL alwaysBounceVertical;
上下回弹默认是NO, 让页面边缘可以在上或者下响应回弹若为YES, 前提是bounces为YES
@property (nonatomic) BOOL alwaysBounceHorizontal;
左右回弹, 默认是NO, 让页面边缘左侧或者右侧可以回弹, 前提bounces为YES
@property (nonatomic,getter=isPagingEnabled) BOOL pagingEnabled;
页面弹动, 也就是整屏翻页, 让scrollView的可视区域显示完整的图片而不是图片的一半. 前提是图片必须是从(0,0)点开始添加的. 一页的标准是ScrollView的宽度
@property (nonatomic) BOOL showsHorizontalScrollIndicator;
是否显示水平方向的滚动条. 默认是YES
@property (nonatomic) BOOL showsVerticalScrollIndicator;
是否显示垂直方向的滚动条. 默认是YES
@property (nonatomic) BOOL scrollsToTop;
点击滚动条回到滚动条的顶部

二.缩放相关

@property(nonatomic) CGFloat minimumZoomScale;
设置最小的缩放比例默认为1.0
@property(nonatomic) CGFloat maximumZoomScale;
设置最大的缩放比例. 注意最小和最大缩放比例数值不能相等, 否则会无法缩放! 只要两者不相等就能进行缩放(即使最大缩放比例小于最小缩放比例) 默认为1.0
@property(nonatomic) CGFloat zoomScale;
变化比例, 通常用本属性的setter方法, 让子视图完成实现相应的缩放比例
@property(nonatomic,readonly,getter=isZooming) BOOL zooming;
判断是否正在缩放状态
@property(nonatomic) BOOL bouncesZoom;
控制缩放的时候是否会反弹默认YES

实现缩放功能必须先设置最小和最大缩放比例
其次要实现UIScrollViewDelegate里的
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView;
方法
只有步骤满足要求才可以实现scrollView子视图的缩放功能

常用方法:

滚动相关方法:

// 设置偏移量, 并可以指定是否带动画, 若带动画可以触发另一方法- (void)setContentOffset:(CGPoint)contentOffset animated:(BOOL)animated;

缩放相关方法:

// 重新设置图片比例, 缩放或者放大, 1表示原比例大小 不会触发另一方法- (void)setZoomScale:(CGFloat)scale animated:(BOOL)animated;

UIScrollViewDelegate

方法及触发条件介绍

/*-------------------滚动相关--------------------*/// 只要滑动屏幕都会触发- (void)scrollViewDidScroll:(UIScrollView *)scrollView;// 将要开始拖拽显示图片时触发- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView;// 将要结束拖拽时触发- (void)scrollViewWillEndDragging:(UIScrollView *)scrollView withVelocity:(CGPoint)velocity targetContentOffset:(inout CGPoint *)targetContentOffset;// 已经结束拖拽动作时触发- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate;// 将要开始减速(结束拖拽动作时)时触发 /*    可以理解为以某个速度拖拽图片的时候, 图片会有惯性, 当结束拖拽的时候   图片会根据惯性继续向拖拽方向移动, 但是移动速度开始慢慢减缓*/- (void)scrollViewWillBeginDecelerating:(UIScrollView *)scrollView;// 已经结束减速(图片完全静止, 本方法才是完全停止的触发方法而不是停止拖动方法)- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView;// 利用带动画的设置偏移量方法, 在动画结束的时候触发本方法- (void)scrollViewDidEndScrollingAnimation:(UIScrollView *)scrollView;/* 状态大致步骤分为   1. 将要开始拖拽   2. 正在拖拽(滑动屏幕)   3. 将要结束拖拽   4. 已经结束拖拽   5. 将要开始减速   6. 已经结束减速   6个步骤是环环相扣的   第七个方法是独立出来响应setContentOffset:animated:方法的.*//*-------------------缩放相关--------------------*/// 指定返回一个要缩放的子视图 完成缩放功能必须实现的方法// 通常写法类似于 return scrollView.subviews[0];- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView;// 将要开始缩放时触发- (void)scrollViewWillBeginZooming:(UIScrollView *)scrollView withView:(UIView *)view;// 图片缩放过程中触发- (void)scrollViewDidZoom:(UIScrollView *)scrollView;// 已经结束缩放触发- (void)scrollViewDidEndZooming:(UIScrollView *)scrollView withView:(UIView *)view atScale:(CGFloat)scale;/*      步骤分为以下三步:    1. 将要开始缩放    2. 正在缩放    3. 已经结束缩放    仅有三个步骤.*//*-------------------独立方法--------------------*/// 是否可以快速跳转到顶部- (BOOL)scrollViewShouldScrollToTop:(UIScrollView *)scrollView;// 跳回顶部触发- (void)scrollViewDidScrollToTop:(UIScrollView *)scrollView;

UIPageControl

常用属性

@property(nonatomic) NSInteger numberOfPages;
默认是0, 用于控制生成多少个代表页面的点
@property(nonatomic) NSInteger currentPage;
默认是0, 用于设置当前被选中的点
@property(nonatomic,retain) UIColor *pageIndicatorTintColor;
用来设置未选中点的填充色
@property(nonatomic,retain) UIColor *currentPageIndicatorTintColor;
用来设置选中的点的填充色

主要方法

同其他UIControl类的子类相同

- (void)addTarget:(id)target action:(SEL)action forControlEvents:(UIControlEvents)controlEvents;// 响应的事件为 UIControlEventValueChanged

UIScrollView和UIPageControl结合使用:

需求: 要求实现一个相册, 显示的图片要和PageControl的点一一对应. 且可以对每张图片进行缩放操作, 不受其他图片影响
要点:
1. 在pageControl的响应方法里让图片偏移到pageControl对应的图片位置
2. 由于要求图片可以独立进行缩放不受其他图片影响. 所以需要每个图片都对应一个UIScrollView, 并将这些ScrollView放在一个总得ScrollView上

// 设置根视图控制器为RootViewController// RootViewController.m 中实现#import "RootViewController.h"#define kScreenHeight [UIScreen mainScreen].bounds.size.height#define kScreenWidth [UIScreen mainScreen].bounds.size.width@interface RootViewController () <UIScrollViewDelegate>// 便于处理, 将根ScrollView和pageControl设为属性@property (nonatomic, retain) UIScrollView *scroll;@property (nonatomic, retain) UIPageControl *page;@end@implementation RootViewController- (void)dealloc {    [_scroll release];    [_page release];    [super dealloc];}- (void)viewDidLoad {    [super viewDidLoad];    // 设置总scroll的大小    self.scroll = [[UIScrollView alloc] initWithFrame:self.view.bounds];    [self.view addSubview:self.scroll];    self.scroll.tag = 1000; // 设置tag    // 共4张图片, 设置可滑动区域为4个界面大小, 横向排列.    self.scroll.contentSize = CGSizeMake(kScreenWidth * 4, kScreenHeight);    // 设置页面弹动    self.scroll.pagingEnabled = YES;    // 关闭滚动条    self.scroll.showsHorizontalScrollIndicator = NO;    self.scroll.showsVerticalScrollIndicator = NO;    // 关闭边缘弹动    self.scroll.bounces = NO;    // 给总的scrollView设置代理    self.scroll.delegate = self;    // 在scrollView上再铺放若干小的scrollview 在小的scrollview上铺设imageView 这样才能保证单独操作一张image不影响其他image    for (int i = 0; i < 4; i++) {        // 将小的ScrollView添加在总的scrollView上, 并和imageView对应        UIScrollView *temp = [[UIScrollView alloc] initWithFrame:CGRectMake(i * kScreenWidth, 0, kScreenWidth, kScreenHeight)];        // 关闭滚动条        temp.showsVerticalScrollIndicator = NO;        temp.showsHorizontalScrollIndicator = NO;        // 添加图片        UIImageView *imageView = [[UIImageView alloc] initWithFrame:[UIScreen mainScreen].bounds];        imageView.image = [UIImage imageNamed:[NSString stringWithFormat:@"image%d.jpg", i + 1]];        [temp addSubview:imageView];        [imageView release];        // 设置最小和最大的缩放比例        temp.minimumZoomScale = 0.5;        temp.maximumZoomScale = 2;        // 给小的scrollView设置代理        temp.delegate = self;        [self.scroll addSubview:temp];        [temp release];    }    [_scroll release];    // 添加pageControl    self.page = [[UIPageControl alloc] initWithFrame:CGRectMake(0, kScreenHeight - 30, kScreenWidth, 30)];    // 设置页数为4    self.page.numberOfPages = 4;    // 初始值为0    self.page.currentPage = 0;    // 设置当前页面点颜色    self.page.currentPageIndicatorTintColor = [UIColor yellowColor];    // 设置为选中页面点颜色    self.page.pageIndicatorTintColor = [UIColor grayColor];    // 为page添加响应方法    [self.page addTarget:self action:@selector(pageAction:) forControlEvents:(UIControlEventValueChanged)];    [self.view addSubview:self.page];    [_page release];}// 实现响应page值变化的方法- (void)pageAction:(UIPageControl *)page {    CGPoint point;    // 计算偏移的横坐标    point.x = page.currentPage * kScreenWidth;    point.y = 0;    // 改变大的scrollView的偏移量    [self.scroll setContentOffset:point animated:YES];}// 大的scrollView响应的代理方法- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView {    // 遍历每个小scrollView, 让每个小scrollView都还原各自的图片大小    // 用if判断 隔绝小的scrollView响应本方法时候导致的崩溃问题    if (scrollView.tag == self.scroll.tag) {    // 由于小scrollView是直接放在总的scrollView上的, 可以直接取出        NSArray *array = scrollView.subviews;        for (UIScrollView *temp in array) {            [temp setZoomScale:1 animated:YES];        }    }}// 大的scrollView响应的代理方法- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {    self.page.currentPage = (scrollView.contentOffset.x) / kScreenWidth;}// 小的scrollView响应的代理方法- (void)scrollViewDidZoom:(UIScrollView *)scrollView {    // 保证在对图片缩放的时候, 图片永远居中显示    UIImageView *view = scrollView.subviews[0];    view.center = self.view.center;}// 小的scrollView响应的代理方法- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView {    return scrollView.subviews[0];}@end

1 0