• 思路

    图片预览,优先考虑基础控件UIImageView、UIButton

    图片预览中可能需设置不同的mode,优先考虑UIImageView

    typedef NS_ENUM(NSInteger, UIViewContentMode) {
    UIViewContentModeScaleToFill,
    UIViewContentModeScaleAspectFit,
    UIViewContentModeScaleAspectFill,
    UIViewContentModeRedraw,
    UIViewContentModeCenter,
    UIViewContentModeTop,
    UIViewContentModeBottom,
    UIViewContentModeLeft,
    UIViewContentModeRight,
    UIViewContentModeTopLeft,
    UIViewContentModeTopRight,
    UIViewContentModeBottomLeft,
    UIViewContentModeBottomRight,
    }

    图片放大、缩小的思路:1. 手势+frame 2.scrollview的zoomScale

    很愉快的决定选择2,不要问为什么,因为我懒,能用系统提供的,坚决不折腾

  • 上菜

    • 设置页面属性
    @property (nonatomic, strong) UIScrollView *mScroll;
    @property (nonatomic, strong) UIImageView *imgInfo;
    • 界面初始化
    self.mScroll = [[UIScrollView alloc] initWithFrame:CGRectZero];
    self.mScroll.backgroundColor = [UIColor colorWithHexs:0x3f3f3f];
    self.mScroll.maximumZoomScale = 3.0;
    self.mScroll.minimumZoomScale = 1;
    self.mScroll.delegate = self;
    self.mScroll.showsVerticalScrollIndicator = NO;
    self.mScroll.showsHorizontalScrollIndicator = NO;
    [self.view addSubview:self.mScroll];
    [self.mScroll mas_makeConstraints:^(MASConstraintMaker *make) {
    make.edges.equalTo(self.preView);
    }]; self.imgInfo = [[UIImageView alloc] initWithFrame:CGRectZero];
    self.imgInfo.clipsToBounds = YES;
    [self.imgInfo setUserInteractionEnabled:YES];
    self.imgInfo.backgroundColor = [UIColor colorWithHexs:0x3f3f3f];
    [self.mScroll addSubview:self.imgInfo];
    [self.imgInfo mas_makeConstraints:^(MASConstraintMaker *make) {
    make.edges.equalTo(self.mScroll);
    make.width.equalTo(self.mScroll);
    }];

    其中maximumZoomScale与minimumZoomScale表示可缩放程度

    • 顺带加个双击手势,比如双击可放大,再放大,再缩小
    UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapHandlerTwice)];
    tap.numberOfTapsRequired = 2;
    [self.imgInfo addGestureRecognizer:tap];
    • double click直接控制缩放
    - (void)tapHandlerTwice {
    if (self.mScroll.zoomScale < 2) {
    [self.mScroll setZoomScale:2];
    } else if (self.mScroll.zoomScale < 3) {
    [self.mScroll setZoomScale:3];
    } else {
    [self.mScroll setZoomScale:1];
    }
    }
    • UIScrollViewDelegate设置scrollview的Zooming View
    #pragma mark - UIScrollViewDelegate
    - (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView {
    return self.imgInfo;
    }
  • Game Over

iOS图片预览、放大缩小的更多相关文章

  1. 手动实现图片预览-放大缩小全屏支持IE9以上

    #{extends '/Index/index.html' /} #{set title:'意见反馈' /} <script src="/public/mgr/javascripts/ ...

  2. 【VUE】图片预览放大缩小插件

    From: https://www.jianshu.com/p/e3350aa1b0d0 在看项目时,突然看到预览图片的弹窗,感觉好僵硬,不能放大,不能切换,于是便在网上找下关于图片预览的插件,有找到 ...

  3. HTML5图片预览 放大

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. 微信企业号办公系统-图片预览放大功能-previewImage

    在微信里看过文章的应该知道,文章里的图片点击后可以放大.分享和保存. 然而自己在微信里开发的网页,里面的图片点击后没办法实现这个效果,然后就去看了下微信JS文档,里面有个previewImage可以调 ...

  5. 【原创】iOS图片预览(支持缩放和移动)

    1.传入图片 PreViewController.h: #import <UIKit/UIKit.h> @interface PreViewController : UIViewContr ...

  6. JS微信网页使用图片预览(放大缩小)

    前言 需求在微信网页中客户点击图片可进行预览放大缩小功能,网上找了各种js方式实现, 唯一的麻烦就是不兼容或者和项目框架不兼容 次函数只只用于部分客户端,否则会出现 WeixinJSBridge is ...

  7. Ionic实战三:Ionic 图片预览可放大缩小左右滑动demo-iClub图片预览

    这个demo的主要功能有两个,一个是首页的导航向上拉动会浮动在最上面的效果,另一个就是我们平时非常实用的功能,就是图片预览功能 点击可以放大图片,并且可以左右滑动,还可以双击放大缩小图片以及双手指控制 ...

  8. js实现移动端图片预览:手势缩放, 手势拖动,双击放大...

    .katex { display: block; text-align: center; white-space: nowrap; } .katex-display > .katex > ...

  9. JS 解决 IOS 中拍照图片预览旋转 90度 BUG

    上篇博文[ Js利用Canvas实现图片压缩 ]中做了图片压缩上传,但是在IOS真机测试的时候,发现图片预览的时候自动逆时针旋转了90度.对于这个bug,我完全不知道问题出在哪里,接下来就是面向百度编 ...

随机推荐

  1. (转)pip和easy_install使用方式

    easy_install 跟 pip 都是 Python 的套件管理程式,有了它們,在使用 Python 開發程式的時候會帶來不少方便. easy_install 和 pip 有什麼不一樣?據 pip ...

  2. 存储过程demo返回银行名称

    create or replace procedure TEST_NUMO(Cityno IN VARCHAR2,--输入参数 Deptid IN VARCHAR2,--输入参数 Retval OUT ...

  3. java生成xls

    ------------------------------------------------------初始化xls操纵类-------- import java.io.File; import ...

  4. Java复习整理 day01

    练习代码: 1 //这条语句说明这个Java文件在demo的包下 2 package demo1; 3 /** 4 * 5 * @author 王兴平 6 * 这个是第一个hello world 案例 ...

  5. PIE模型

    首先,我们需要明确程序的Bug有如下的定义: 1. Fault/Defect 静态的,存在于软件中的缺陷.例如:一段有缺失或者错误的代码. 2. Error 运行时一种不正确的中间状态. 3. Fai ...

  6. Codeforces Round #672 (Div. 2)

    比赛链接:https://codeforces.com/contest/1420 A. Cubes Sorting 题意 给出一个大小为 $n$ 的数组 $a$,每次只可以交换相邻的两个元素,最多交换 ...

  7. Educational Codeforces Round 87 (Rated for Div. 2) D树状数组加二分删除的值

    Sample Input 5 4 1 2 3 4 5 -5 -1 -3 -1 Sample Output 3 思路,首先发现a[i]的值的范围是在1~n之间,每次插入我们可以直接把cnt[a[i]]+ ...

  8. Codeforces Round #540 (Div. 3) C. Palindromic Matrix (大模拟)

    题意:给你\(n\)个数,判断是否能构成一个\(n\)X\(n\)的回文矩阵,若可以,输出\(YES\)和矩阵,否则输出\(NO\). 题解:如果这个矩阵的行/列元素是偶数的话,很好办,所有出现的数一 ...

  9. Codeforces Round #641 (Div. 2) D. Orac and Medians (贪心)

    题意:有一个长度为\(n\)的数组,问能否通过多次使某个区间的所有元素变成这个区间的中位数,来使整个数组变成题目所给定的\(k\). 题解:首先这个\(k\)一定要在数组中存在,然后我们对中位数进行考 ...

  10. Windows Server 2016 开启远程连接并延长过期时间

    按照下面文章配置,做完1.2步即可,其中协议号码填写 4954438 亲测有效! Server 2016默认远程桌面连接数是2个用户,如果多余两个用户进行远程桌面连接时,系统就会提示超过连接数,可以通 ...