如何在swift 4或更高版本中裁剪具有可选区域的图像？

Question

我需要一些想要在我的应用中实现的功能的帮助。 我在Aspect Fit中有一个带有内容模式图像视图的视图。从库中获取图像时，我想使用可调整的矩形裁剪区域以创建新图像。 我一直在寻找一些示例或在线教程，但没有成功。 有人可以帮我吗？ 这是我视图中的图像。

。

Answer 1

简单的解决方案是仅在特定的inp2内渲染图像视图：

CGRect

该方法的局限性在于，如果图像的分辨率远高于图像视图可以呈现的分辨率（这是我们使用“纵横比拟合”时的常见情况），那么您将失去这种额外的精度。

如果要保留分辨率，则应将func snapshot(in imageView: UIImageView, rect: CGRect) -> UIImage { return UIGraphicsImageRenderer(bounds: rect).image { _ in imageView.drawHierarchy(in: imageView.bounds, afterScreenUpdates: true) } } 转换为与图像的坐标，在这种情况下，假定“纵横比适合”（即居中并缩放，以便显示整个图像）：

CGRect

使用此扩展程序：

func snapshot(in imageView: UIImageView, rect: CGRect) -> UIImage {
    assert(imageView.contentMode == .scaleAspectFit)

    let image = imageView.image!

    // figure out what the scale is

    let imageRatio = imageView.bounds.width / imageView.bounds.height
    let imageViewRatio = image.size.width / image.size.height

    let scale: CGFloat
    if imageRatio > imageViewRatio {
        scale = image.size.height / imageView.bounds.height
    } else {
        scale = image.size.width / imageView.bounds.width
    }

    // convert the `rect` into coordinates within the image, itself

    let size = rect.size * scale
    let origin = CGPoint(x: image.size.width  / 2 - (imageView.bounds.midX - rect.minX) * scale,
                         y: image.size.height / 2 - (imageView.bounds.midY - rect.minY) * scale)
    let scaledRect = CGRect(origin: origin, size: size)

    // now render the image and grab the appropriate rectangle within
    // the image’s coordinate system

    let format = UIGraphicsImageRendererFormat()
    format.scale = image.scale
    format.opaque = false

    return UIGraphicsImageRenderer(bounds: scaledRect, format: format).image { _ in
        image.draw(at: .zero)
    }
}

结果是：

Answer 2

如果我正确理解了您的问题，则问题有两个部分：

1. 图像上方的可调矩形区域
2. 裁剪<link rel="stylesheet" href="https://unpkg.com/leaflet@1.4.0/dist/leaflet.css" integrity="sha512-puBpdR0798OZvTTbP4A8Ix/l+A4dHDD0DGqYW6RQ+9jxkRFclaxxQb/SJAWZfWAkuyeQUytO7+7N4QKrDh+drA==" crossorigin=""/> <script src="https://unpkg.com/leaflet@1.4.0/dist/leaflet.js" integrity="sha512-QVftwZFqvtRNi0ZyCtsznlKSWOStnDORoefr1enyq5mVL4tmKB3S/EnC3rRJcxCPavG10IcrVGSmPh6Qw5lwrg==" crossorigin=""></script> <div id="map"> </div> <script> let latLng; const map = L.map('map').setView([51.505, -0.09], 13); L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors' }).addTo(map); const dropdown = `Type to submit: <select id="ddlViewBy"> <option value="a">a</option> <option value="b">b</option> <option value = "c">c</option> </select>: <button onclick="buttonFunction()">submit</button>`; map.on('click', e => { const popup = L.popup() .setLatLng(e.latlng) .setContent(dropdown) .openOn(map); latLng = e.latlng; }) buttonFunction = () => { const dropdonwValue = document.getElementById("ddlViewBy").value; map.closePopup() L.marker(latLng) .bindPopup(dropdonwValue) .addTo(map) } </script>

中断您的google查询，并根据上述问题分别搜索解决方案。

或者可能需要帮助或使用类似这样的东西：

iOS-Image-Crop-View