文档章节

IOS UIScrollView详解 & 图片缩放功能

卧龙小
 卧龙小
发布于 2015/01/05 00:34
字数 919
阅读 4608
收藏 29

一 UIScrollView 简介

UIScrollView是能滚动的视图控件,可以通过滚动的方式来展示类容。



二 UIScrollView常见属性

//设置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的滚动过程

// 用户开始拖拽时调用
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView;

// 滚动到某个位置时调用
- (void)scrollViewDidScroll:(UIScrollView *)scrollView;

// 用户结束拖拽时调用
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate;



四 内容缩放

UIScrollView不仅能滚动显示大量内容,还能对其内容进行缩放处理

当在UIScrollView身上使用捏合手势时,UIScrollView会调用代理(delegate)的viewForZoomingInScrollView方法,这个方法返回的控件就是需要进行缩放的控件,缩放涉及的属性和方法

/****属性****/
//缩小的对小比例
@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 代码
#import "ViewController.h"

@interface ViewController ()<UIScrollViewDelegate>
/**
 *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 <#scrollView description#>
 *
 *  @return <#return value description#>
 */
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView
{
    NSLog(@"开始缩放");
    return self.imageView;
}


/**
 *  缩放过程中调用
 *
 *  @param scrollView <#scrollView description#>
 */
- (void)scrollViewDidZoom:(UIScrollView *)scrollView
{
    NSLog(@"正在缩放");
}



/**
 *  缩放结束时调用
 *
 *  @param scrollView <#scrollView description#>
 *  @param view       <#view description#>
 *  @param scale      <#scale description#>
 */
- (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 展示

缩放前                                              缩放后

        

© 著作权归作者所有

卧龙小
粉丝 42
博文 146
码字总数 70107
作品 0
西城
程序员
私信 提问
加载中

评论(2)

NemoCH
NemoCH
13
NemoCH
NemoCH
13
IOS开发系列--无限循环的图片浏览器

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/jianxin160/article/details/47753201 --UIKit之UIScrollView 概述 UIKit框架中有大量的控件供开发者使用,在...

KenshinCui
2015/08/18
0
0
iOS 滚动视图编程指南

iOS 应用中的 Scroll view 用来显示和让用户操作大小超出屏幕显示范围的内容。Scroll view 主要有两个用途: 让用户拖动到他们想要显示的内容区域 让用户用双指手势放大、缩小 下图是一个典型...

灰大羊
2014/04/17
611
2
【IOS视频教学】三个月学会IOS开发

一、windows系统下安装虚拟机-mac系统-视频教程-安装件全套下载:http://www.wyzc.com/forum/56212.html 二、史上最佳0基础Swift语言视频教程下载链接:http://www.wyzc.com/forum/56744.htm...

马洪伟
2014/12/25
438
0
iOS中UIWebView的使用详解

iOS中UIWebView的使用详解 一、初始化与三种加载方式 UIWebView继承与UIView,因此,其初始化方法和一般的view一样,通过alloc和init进行初始化,其加载数据的方式有三种: 第一种: - (voi...

珲少
2015/06/23
44.3K
1
使用 Interface Builder 兼容 iOS6 和iOS7

当你在更新你的App到iOS 7的平台时遇到最大的挑战之一就是确保不要遗忘那些还在使用iOS 6平台的用户,在此我们提供一些建议使你的App应用在iOS 6和iOS 7上同时保留视觉吸引力和技术功能. 此图...

isaced
2014/01/15
13.4K
12

没有更多内容

加载失败,请刷新页面

加载更多

Dubbo-自适应拓展机制

背景 在 Dubbo 中,很多拓展都是通过 SPI 机制进行加载的,比如 Protocol、Cluster、LoadBalance 等,这些都是Dubbo的基础组件。这些基础组件的拓展不是在系统框架启动阶段被加载,而是拓展方...

rock-man
10分钟前
2
0
Kali安装fcitx输入法(五笔)

安装fcitx > sudo apt-get install fcitx-rime fcitx-config-gtk3 重启 > sudo reboot fcitx配置 效果就是这样 配置输入法切换 系统设置...

yeahlife
12分钟前
2
0
IE之css3效果兼容

本文转载于:专业的前端网站▷IE之css3效果兼容 一、兼容css阴影效果(ie滤镜) 1.Shadow,阴影 .shadow { -moz-box-shadow: 3px 3px 4px #000; -webkit-box-shadow: 3px 3px 4px #000; box-sha...

前端老手
15分钟前
2
0
NiushopB2C开源商城功能列表说明:

B2C单商户免费版:PC商城+微商城 B2C单商户标准版:PC商城+微商城组合套餐+阶梯优惠核销功能 B2C单商户企业版:PC商城+微商城拼团+组合套餐阶梯优惠+核销功能 B2C单商户分销版:PC商城+微商城...

niushop-芳
17分钟前
2
0
图片如何转GIF图片呢

如何将生活中拍摄的好玩有趣的图片制作成GIF动图呢?相信很多小伙伴都不知道要如何制作,其实制作方法非常的简单,下面分享一个图片转GIF动图的方法,希望这个方法能够帮助大家在与好友斗图时...

白米稀饭2019
24分钟前
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部