将ImageView放置在iOS中的另一个图像上

我有一个图像视图“V”和一个图像视图“I”。我的任务是把“V”放在“I”的右上角。如下图所示，“半缝合”图像是需要放置在主图像上的图像

我有一个类“ProductDetail”，它实现了用于显示滑动图像的“UIPageViewController”。在“UIPageViewController”类中，主图像的视图为“contentImageView”，在ViewDidLoad（）中，我已将contentImageView的图像设置为

contentImageView!.hnk_setImageFromURL( imageURL)

我尝试了，

NSLayoutConstraint（项：'V'，属性：。拖尾，relatedBy:.equal，toItem:'I'，属性：。拖尾，乘数：1，常数：0）

但这对我不起作用。给我的“V”图像视图（小图像）设置约束的正确方法是什么，使其位于“I”大图像的右上角

目前，我可以在大图像视图的右上角设置“V”（小图像），但我希望它在大图像上，而不是在大图像视图上

有几种方法可以做到这一点——这里有一种方法

编辑：略微编辑原始代码。这使用了

UIImageView

扩展，当图像视图设置为

Aspect Fit

假设您有一个图像视图来保存“item”图像，我将其称为

combinedImageView

，它是正方形的（比率

1:1

）

您可能需要使用“覆盖”的百分比/大小来获得所需的大小

注意：您可以单击下面的图像查看它们的实际大小

extension UIImageView {
    var contentClippingRect: CGRect {
        guard let image = image else { return bounds }
        guard contentMode == .scaleAspectFit else { return bounds }
        guard image.size.width > 0 && image.size.height > 0 else { return bounds }

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

        let size = CGSize(width: image.size.width * scale, height: image.size.height * scale)
        let x = (bounds.width - size.width) / 2.0
        let y = (bounds.height - size.height) / 2.0

        return CGRect(x: x, y: y, width: size.width, height: size.height)
    }
}

class RedBandViewController: UIViewController {

    @IBOutlet var combinedImageView: UIImageView!

    override func viewDidLoad() {
        super.viewDidLoad()

        // make sure imageView is set to Aspect-Fit
        combinedImageView.contentMode = .scaleAspectFit

        // make sure images are valid
        if let mainImage = UIImage(named: "ItemA"),
            let overlayImage = UIImage(named: "SemiStitched") {

            // set the "main" image
            combinedImageView.image = mainImage

            // instantiate new imageView
            let overlayImageView = UIImageView(image: overlayImage)

            // we'll use auto-layout
            overlayImageView.translatesAutoresizingMaskIntoConstraints = false

            // add the overlay imageView to the "combined" imageView
            combinedImageView.addSubview(overlayImageView)

            // get the frame of the aspect-fit image content
            let fitRect = combinedImageView.contentClippingRect

            NSLayoutConstraint.activate([

                // anchor overlayImageView to top / trailing
                overlayImageView.topAnchor.constraint(equalTo: combinedImageView.topAnchor, constant: fitRect.origin.y),
                overlayImageView.trailingAnchor.constraint(equalTo: combinedImageView.trailingAnchor, constant: (fitRect.origin.x + fitRect.size.width) - combinedImageView.frame.width),

                // constrain overlayImageView to 1/4 (25%) of the combinedImageView width
                // this will keep the "red banner" at a consistent size, regardless of image
                overlayImageView.widthAnchor.constraint(equalTo: combinedImageView.widthAnchor, multiplier: 0.25),

                // or, constrain overlayImageView to 1/4 (25%) of the width of the Apect-Fit image,
                // this will keep the "red banner" at a consistent *percentage* width of the scaled image 
                //overlayImageView.widthAnchor.constraint(equalToConstant: fitRect.size.width * 0.25),

                // and equal height to its own width
                overlayImageView.heightAnchor.constraint(equalTo: overlayImageView.widthAnchor, multiplier: 1.0),

                ])

        }
    }
}

半缝合.png（白色区域为alpha）：

ItemA.png-方形图像位于

400 x 400

：

ItemB.png-在

229 x 345处高于宽度：


ItemC.png-在
600 x 462处比高度宽：


结果:


这是正确的方法，除非您同时需要.training和.top；另外，不要忘了用直接值或比例值添加宽度/高度，否则UIKit可能会抱怨。它看起来很完美，您的期望是什么？Xcode说，以NSException类型的未捕获异常终止。每个约束项都必须是UIView或UILayoutGuide的实例。Bcz项必须是任何对象，而不是字符串。如何给出约束w.r.t字符串，它必须是您引用的任何UI组件。因此，我应该如何引用“contentImageView”（UIImageView）的图像很好，但问题仍然存在，因为之前我也尝试使用CombineImageView，但没有使用CombineImageView。问题是：在开发站点，我们使用as缓存CombineImage并将其分配给CombineImage视图。我想我们可以用图像大小做一些事情！我不明白你的意思。。。问题是“产品”图像不能填充视图吗？或者，您希望图像的纵横比匹配，因此如果它不是视图的精确大小，则它将居中，但您试图使红色条与实际图像的角对齐，而不是与图像视图的角对齐？主视图的内容模式设置为“纵横比匹配”，并且主图像也居中对齐，因此，我很难在主图像上放置红色标签。