美文网首页
iOS 图片放大缩小,选择裁剪区域

iOS 图片放大缩小,选择裁剪区域

作者: 达摩君 | 来源:发表于2018-09-05 20:15 被阅读158次
1.gif

Demo地址

核心代码

就一个scrollView文件,可以直接拖到项目中使用~
//
//  EditImageCropView.swift
//  EditImageDemo
//
//  Created by Lee on 2018/9/5.
//  Copyright © 2018年 Lee. All rights reserved.
//

import UIKit

class EditImageCropView: UIScrollView {

    var imageView = UIImageView()
    var imageSize: CGSize?
    var image: UIImage! = nil {
        didSet {
            if image != nil {
                if !imageView.isDescendant(of: self) {
                    imageView.alpha = 1.0
                    addSubview(imageView)
                }
            } else {
                imageView.image = nil
                return
            }
            let imageSize = self.imageSize ?? image.size
            /// 宽比例
            let ratioW = frame.width / imageSize.width
            /// 高比例
            let ratioH = frame.height / imageSize.height
            if ratioH > ratioW {
                imageView.frame = CGRect(origin: .zero, size: CGSize(width: imageSize.width * ratioH, height: frame.height))
            } else {
                imageView.frame = CGRect(origin: .zero, size: CGSize(width: frame.width, height: imageSize.height * ratioW))
            }
            
            contentOffset = CGPoint(x: imageView.center.x - center.x, y: imageView.center.y - center.y)
            imageView.image = image
            zoomScale = 1.0
            
        }
    }
    
    override init(frame: CGRect) {
        super.init(frame: frame)
        setupUI()
    }
    
    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        setupUI()
    }
    func setupUI() {
        backgroundColor = UIColor.black
        frame.size = .zero
        clipsToBounds = true
        imageView.alpha = 0
        imageView.frame = .zero
        maximumZoomScale = 2.0
        minimumZoomScale = 0.8
        showsVerticalScrollIndicator = false
        showsHorizontalScrollIndicator = false
        bounces = true
        bouncesZoom = true
        scrollsToTop = false
        delegate = self
        setNeedsLayout()
    }
}

extension EditImageCropView: UIScrollViewDelegate {
    func viewForZooming(in scrollView: UIScrollView) -> UIView? {
        return imageView
    }
    
    func scrollViewDidZoom(_ scrollView: UIScrollView) {
        let boundsSize = scrollView.bounds.size
        var contentsFrame = imageView.frame
        if contentsFrame.size.width < boundsSize.width {
            contentsFrame.origin.x = (boundsSize.width - contentsFrame.size.width) / 2.0
        } else {
            contentsFrame.origin.x = 0.0
        }
        if contentsFrame.size.height < boundsSize.height {
            contentsFrame.origin.y = (boundsSize.height - contentsFrame.size.height) / 2
        } else {
            contentsFrame.origin.y = 0.0
        }
        imageView.frame = contentsFrame
    }
    
    func scrollViewDidEndZooming(_ scrollView: UIScrollView, with view: UIView?, atScale scale: CGFloat) {
        contentSize = CGSize(width: imageView.frame.width > frame.width ? imageView.frame.width + 1.0 : frame.width + 1.0, height: imageView.frame.height > frame.height ? imageView.frame.height + 1.0 : frame.height + 1.0)
    }
}

相关文章

  • iOS 图片放大缩小,选择裁剪区域

    Demo地址 核心代码 就一个scrollView文件,可以直接拖到项目中使用~

  • 用electron实现一个批量裁剪图片的工具

    图片批量裁剪的工具 功能: 批量选择图片 放大缩小图片 移动图片 裁剪图片 导出裁剪后的图片 请在Release[...

  • 仿QQ头像裁剪头像效果

    项目中用到头像裁剪需求,于是仿照QQ的效果自己写了一个裁剪图片的控制器,支持设置裁剪区域和蒙版样式,放大和缩小图片...

  • iOS图片剪裁

    项目中需要对图片进行裁剪操作,所以封装了一个简单的剪裁图片的控件,当时的设想是能够根据剪裁框的区域自动放大或缩小,...

  • ios-CropImageView-图片和裁剪框都能放大缩小移动

    特点:图片能移动,放大缩小。裁剪框能移动,自由拉伸。移动过程中裁剪框不会超出图片的范围。不在裁剪框里面会有黑色透明...

  • iOS图片预览、放大缩小

    思路图片预览,优先考虑基础控件UIImageView、UIButton图片预览中可能需设置不同的mode,优先考虑...

  • iOS图片预览、放大缩小

    思路图片预览,优先考虑基础控件UIImageView、UIButton图片预览中可能需设置不同的mode,优先考虑...

  • javascript案例

    1 图片的放大和缩小效果演示 1 图片的放大和缩小效果演示原理说明:图片逐渐放大和逐渐缩小是指在一定时间内图片发生...

  • 图片剪裁选择框 LCResizableView

    最近遇到裁剪图片的需求,要求选择图片的某一区域进行剪裁,要在图片上呈现选择框来选择区域,这里选择自己开发一款 Sw...

  • CGAffineTransform

    问题:在做图片放大缩小的时候,因为需求是一张图片多次放大,缩小, 先用 放大:view.transform=CGA...

网友评论

      本文标题:iOS 图片放大缩小,选择裁剪区域

      本文链接:https://www.haomeiwen.com/subject/jsszwftx.html