IOS UIScrollView详解 & 图片缩放功能 一 UIScrollView 简介 UIScrollView是能滚动的视图控件,可以通过滚动的方式来展示类容。 二 UIScrollView常见属性 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 //设置UIScrollView滚动的位置 @property(nonatomic)?CGPoint?contentOffset;? ? //设置UIScrollView内容的尺寸,滚动范围 @property(nonatomic)?CGSize?contentSize;? ? //设置UIScrollView的4周增加额外的滚动区域 @property(nonatomic)?UIEdgeInsets?contentInset;? ? //设置UIScrollView是否需要弹簧效果 @property(nonatomic)?BOOL?bounces; ? //设置UIScrollView是否能滚动 @property(nonatomic,getter=isScrollEnabled)?BOOL?scrollEnabled;? ? //设置UIScrollView是否显示水平滚动条 @property(nonatomic)?BOOL?showsHorizontalScrollIndicator; ? //设置UIScrollView是否显示垂直滚动条 @property(nonatomic)?BOOL?showsVerticalScrollIndicator; 三 UIScrollView 代理(delegate) UIScrollView在滚动过程中 或者 停止滚动 时,如果需要做一些特定的操作,可用通过设置代理的方式(delegate)来监听UIScrollView的整个滚动过程,当UIScrollView发生一系列的滚动操作时, 会自动通知它的代理(delegate)对象,然后通过代理来监听UIScrollView的滚动过程。 UIScrollView将delegate需要实现的方法都定义在UIScrollViewDelegate协议中,因此UIScrollView的delegate必须遵守UIScrollViewDelegate协议,然后实现协议中相应的方法,就可以监听UIScrollView的滚动过程 ? 1 2 3 4 5 6 7 8 //?用户开始拖拽时调用 -?(void)scrollViewWillBeginDragging:(UIScrollView?*)scrollView; ? //?滚动到某个位置时调用 -?(void)scrollViewDidScroll:(UIScrollView?*)scrollView; ? //?用户结束拖拽时调用 -?(void)scrollViewDidEndDragging:(UIScrollView?*)scrollView?willDecelerate:(BOOL)decelerate; 四 内容缩放 UIScrollView不仅能滚动显示大量内容,还能对其内容进行缩放处理 当在UIScrollView身上使用捏合手势时,UIScrollView会调用代理(delegate)的viewForZoomingInScrollView方法,这个方法返回的控件就是需要进行缩放的控件,缩放涉及的属性和方法 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 /****属性****/ //缩小的对小比例 @property(nonatomic)?CGFloat?minimumZoomScale; ? //放大的较大比例 @property(nonatomic)?CGFloat?maximumZoomScale;???? ? ? ? /****方法****/ //缩放时调用 -?(UIView?*)viewForZoomingInScrollView:(UIScrollView?*)scrollView; ? //开始缩放的时候调用? -?(void)scrollViewWillBeginZooming:(UIScrollView?*)scrollView?withView:(UIView?*)view ? //正在缩放的时候调用 -?(void)scrollViewDidZoom:(UIScrollView?*)scrollView 五 UIScrollView无法滚动的解决办法 如果UIScrollView无法滚动,可能是以下原因: 5.1 没有设置contentSize属性 5.2 设置属性scrollEnabled = NO 5.3 没有接收到触摸事件(userInteractionEnabled = NO) 5.4 取消autolayout功能,要想scrollView滚动,必须取消autolayout 六 代码区 6.1 代码 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 #import?"ViewController.h" ? @interface?ViewController?() /** ?*UIScrollView ?*/ @property(nonatomic,strong)UIScrollView?*scrollView; ? /** ?*??UIImageView ?*/ @property(nonatomic,strong)UIImageView?*imageView; @end ? @implementation?ViewController -?(void)viewDidLoad?{ ????? ????//2.设置?UIImageView ? ????UIImage?*image?=?[UIImage?imageNamed:@"scroll.jpg"]; ????self.imageView.image?=?image; ????? ????//2.1?设置图片范围 ????CGFloat?imageH?=?image.size.height; ????CGFloat?imageW?=?image.size.width; ????CGFloat?imageX?=?0; ????CGFloat?imageY?=?0; ????self.imageView.frame?=?CGRectMake(imageX,?imageY,?imageW,?imageH); ????? ????? ? ????//3?设置UIScrollView?属性 ????? ????//3.2?设置UIScrollView内容的尺寸,滚动范围 ????self.scrollView.contentSize=CGSizeMake(imageW,?imageH); ????? ????//3.2?设置UIScrollView的4周增加额外的滚动区域 ????CGFloat?distance?=?100.0f; ????self.scrollView.contentInset?=?UIEdgeInsetsMake(distance,?distance,?distance,?distance); ????? ????//3.3?设置弹簧效果 ????self.scrollView.bounces?=?YES; ????? ????//3.4?设置滚动不显示 ????self.scrollView.showsHorizontalScrollIndicator=NO; ????self.scrollView.showsVerticalScrollIndicator=NO; ????? ????? ????? ????? ????//4?UIImageView?添加到?UIScrollView?中 ????[self.scrollView?addSubview:self.imageView]; ????? ????//5?UIScrollView ????[self.view?addSubview:self.scrollView]; ????? ????? ????//6?设置代理 ????self.scrollView.delegate?=?self; ????? ????? ????//7?缩放 ????self.scrollView.minimumZoomScale=0.2f; ????self.scrollView.maximumZoomScale=2.0f; ????? } ? #pragma?mark?代理方法 //?用户开始拖拽时调用 -?(void)scrollViewWillBeginDragging:(UIScrollView?*)scrollView { ????NSLog(@"开始拖拽"); } ? //?滚动到某个位置时调用 -?(void)scrollViewDidScroll:(UIScrollView?*)scrollView { ????NSLog(@"拖拽中"); } ? //?用户结束拖拽时调用 -?(void)scrollViewDidEndDragging:(UIScrollView?*)scrollView?willDecelerate:(BOOL)decelerate { ????NSLog(@"结束拖拽"); } ? ? ? ? #pragma?mark?缩放 /** ?*??缩放结束时调用 ?* ?*??@param?scrollView? ?* ?*??@return? ?*/ -?(UIView?*)viewForZoomingInScrollView:(UIScrollView?*)scrollView { ????NSLog(@"开始缩放"); ????return?self.imageView; } ? ? /** ?*??缩放过程中调用 ?* ?*??@param?scrollView? ?*/ -?(void)scrollViewDidZoom:(UIScrollView?*)scrollView { ????NSLog(@"正在缩放"); } ? ? ? /** ?*??缩放结束时调用 ?* ?*??@param?scrollView? ?*??@param?view??????? ?*??@param?scale?????? ?*/ -?(void)scrollViewDidEndZooming:(UIScrollView?*)scrollView?withView:(UIView?*)view?atScale:(CGFloat)scale { ????NSLog(@"缩放结束"); } ? ? ? ? ? #pragma?mark?属性get方法 ? -?(UIScrollView?*)scrollView { ????if?(!_scrollView)?{ ????????_scrollView?=?[[UIScrollView?alloc]?initWithFrame:self.view.frame]; ????} ????return?_scrollView; } ? ? ? -?(UIImageView?*)imageView { ????if?(!_imageView)?{ ????????_imageView?=?[[UIImageView?alloc]?init]; ????} ????return?_imageView; } ? ? ? @end 6.2 展示 缩放前 ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?缩放后 ?? ? ? ?? 学习链接/ios/?tg=5009295340 学习交流群:317140762