使用 swift 在图像上覆盖文本答案

【问题标题】：overlaying text on image using swift使用 swift 在图像上覆盖文本
【发布时间】：2016-09-12 19:50:31
【问题描述】：

我正在尝试使用 Swift 在图像上覆盖一些文本，并在此处查看此代码：(src: How do I add text to an image in iOS Swift)

这会将文本放在中间。我一直在改变

 var rect = CGRectMake(10,150, inImage.size.width,    
   inImage.size.height)

但我无法让文字显示在左下角。有人可以帮助并展示我在这里缺少的东西吗？

我正在使用这一行添加修改后的图像：

modImage = self.textToImage("000", inImage: UIImage(named:"thisImage.png")!, atPoint: CGPointMake(10, 400))

下面是函数...

func textToImage(drawText: NSString, inImage: UIImage, atPoint: CGPoint) -> UIImage{

    // Setup the font specific variables
    var textColor = UIColor.whiteColor()
    var textFont = UIFont(name: "Helvetica Bold", size: 12)!

    // Setup the image context using the passed image
    let scale = UIScreen.mainScreen().scale
    UIGraphicsBeginImageContextWithOptions(inImage.size, false, scale)

    // Setup the font attributes that will be later used to dictate how the text should be drawn
    let textFontAttributes = [
        NSFontAttributeName: textFont,
        NSForegroundColorAttributeName: textColor,
    ]

    // Put the image into a rectangle as large as the original image
    inImage.drawInRect(CGRectMake(0, 0, inImage.size.width, inImage.size.height))

    // Create a point within the space that is as bit as the image
    var rect = CGRectMake(atPoint.x, atPoint.y, inImage.size.width, inImage.size.height)

    // Draw the text into an image
    drawText.drawInRect(rect, withAttributes: textFontAttributes)

    // Create a new image out of the images we have created
    var newImage = UIGraphicsGetImageFromCurrentImageContext()

    // End the context now that we have the image we need
    UIGraphicsEndImageContext()

    //Pass the image back up to the caller
    return newImage

}

【问题讨论】：

顺便说一句，原版。线程不允许我发布任何 cmets，因此单独的线程。谢谢。
请包含您使用此功能将文本添加到图像的代码。
你不应该改变函数内部的变量，它使用你在调用函数时传递给它的点。如果你使用这行modImage = self.textToImage("000", inImage: UIImage(named:"thisImage.png")!, atPoint: CGPointMake(0, 0))，你会得到图片左上角的文字吗？
不，仍然显示在图像的中心。
这很奇怪！对我来说，它在我应该传递给它的地方绘制文本。在var rect = CGRectMake(atPoint.x, atPoint.y, inImage.size.width, inImage.size.height) 之后添加print(rect)。输出是什么？

标签： ios swift image

【解决方案1】：

详情

xCode 9.1，斯威夫特 4

解决方案

扩展 UIView

extension UIView {

    func copyObject<T: UIView> () -> T? {
        let archivedData = NSKeyedArchiver.archivedData(withRootObject: self)
        return NSKeyedUnarchiver.unarchiveObject(with: archivedData) as? T
    }
}

扩展 UIImage

 extension UIImage {

    typealias EditSubviewClosure<T: UIView> = (_ parentSize: CGSize, _ viewToAdd: T)->()

    func with<T: UIView>(view: T, editSubviewClosure: EditSubviewClosure<T>) -> UIImage {

        if let copiedView = view.copyObject() as? T {
            UIGraphicsBeginImageContext(size)

            let basicSize = CGRect(origin: .zero, size: size)
            draw(in: basicSize)
            editSubviewClosure(size, copiedView)
            copiedView.draw(basicSize)

            let newImage = UIGraphicsGetImageFromCurrentImageContext()
            UIGraphicsEndImageContext()
            return newImage!
        }
        return self

    }
}

扩展 UIImageView

 extension UIImageView {

    enum ImageAddingMode {
        case changeOriginalImage
        case addSubview
        case addCopiedSubview
    }

    func drawOnCurrentImage<T: UIView>(view: T, mode: ImageAddingMode, editSubviewClosure: @escaping UIImage.EditSubviewClosure<T>) {

        guard let image = image else {
            return
        }

        let addSubView: (T) -> () = { view in
            editSubviewClosure(self.frame.size, view)
            self.addSubview(view)
        }

        switch mode {
            case .changeOriginalImage:
                self.image = image.with(view: view, editSubviewClosure: editSubviewClosure)

            case .addSubview:
                addSubView(view)

            case .addCopiedSubview:
                if let copiedView = view.copyObject() as? T {
                    addSubView(copiedView)
                }
        }
    }
}

用法

示例 1

func sample1(label: UILabel) {
    imageView.contentMode = .scaleAspectFit
    imageView.image = UIImage(named: "wall")?.with(view: label) { (parentSize, viewToAdd) in
        print("parentSize: \(parentSize)")
        viewToAdd.font = UIFont.systemFont(ofSize: 40)
        viewToAdd.textColor = .yellow
        viewToAdd.bounds = CGRect(x: 40, y: 40, width: 200, height: 40)
    }
}

示例 2

func sample2(label: UILabel) {
    imageView.image = UIImage(named: "wall")
    imageView.contentMode = .scaleAspectFit
    imageView.drawOnCurrentImage(view: label, mode: .changeOriginalImage) { (parentSize, viewToAdd) in
        print("parentSize: \(parentSize)")
        viewToAdd.font = UIFont.systemFont(ofSize: 40)
        viewToAdd.textColor = .yellow
        viewToAdd.textAlignment = .right
        let width: CGFloat = 200
        let height: CGFloat = 30
        let indent: CGFloat = 40
        viewToAdd.bounds = CGRect(x: parentSize.width - width - indent, y: parentSize.height - height - indent, width: width, height: height)
    }
}

示例 3

func sample3(label: UILabel) {
    imageView.image = UIImage(named: "wall")
    imageView.contentMode = .scaleAspectFill
    imageView.drawOnCurrentImage(view: label, mode: .addSubview) { (parentSize, viewToAdd) in
        print("parentSize: \(parentSize)")
        viewToAdd.font = UIFont.systemFont(ofSize: 16)
        viewToAdd.textColor = .yellow
        viewToAdd.frame = CGRect(x: 40, y: 40, width: 200, height: 20)
    }
}

示例 4

func sample4(label: UILabel) {
    imageView.image = UIImage(named: "wall")
    imageView.contentMode = .scaleAspectFill
    imageView.drawOnCurrentImage(view: label, mode: .addCopiedSubview) { (parentSize, viewToAdd) in
        print("parentSize: \(parentSize)")
        viewToAdd.font = UIFont.systemFont(ofSize: 16)
        viewToAdd.textColor = .yellow
        viewToAdd.frame = CGRect(x: 40, y: 40, width: 200, height: 20)
    }
}

完整样本

不要忘记在此处添加解决方案代码

import UIKit

class ViewController: UIViewController {

    let imageView = UIImageView(frame: CGRect(x: 50, y: 50, width: 300, height: 300))

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        let label = UILabel(frame: CGRect(x: 20, y: 20, width: 80, height: 30))
        label.text = "Blablabla"
        label.font = UIFont.systemFont(ofSize: 20)
        label.textColor = .black
        view.addSubview(label)

        sample1(label: label)
        //sample2(label: label)
        //sample3(label: label)
        //sample4(label: label)

        imageView.clipsToBounds = true
        view.addSubview(imageView)
    }

    func sample1(label: UILabel) {
        imageView.contentMode = .scaleAspectFit
        imageView.image = UIImage(named: "wall")?.with(view: label) { (parentSize, viewToAdd) in
            print("parentSize: \(parentSize)")
            viewToAdd.font = UIFont.systemFont(ofSize: 40)
            viewToAdd.textColor = .yellow
            viewToAdd.bounds = CGRect(x: 40, y: 40, width: 200, height: 20)
        }
    }

    func sample2(label: UILabel) {
        imageView.image = UIImage(named: "wall")
        imageView.contentMode = .scaleAspectFit
        imageView.drawOnCurrentImage(view: label, mode: .changeOriginalImage) { (parentSize, viewToAdd) in
            print("parentSize: \(parentSize)")
            viewToAdd.font = UIFont.systemFont(ofSize: 40)
            viewToAdd.textColor = .yellow
            viewToAdd.textAlignment = .right
            let width: CGFloat = 200
            let height: CGFloat = 30
            let indent: CGFloat = 40
            viewToAdd.bounds = CGRect(x: parentSize.width - width - indent, y: parentSize.height - height - indent, width: width, height: height)
        }
    }

    func sample3(label: UILabel) {
        imageView.image = UIImage(named: "wall")
        imageView.contentMode = .scaleAspectFill
        imageView.drawOnCurrentImage(view: label, mode: .addSubview) { (parentSize, viewToAdd) in
            print("parentSize: \(parentSize)")
            viewToAdd.font = UIFont.systemFont(ofSize: 16)
            viewToAdd.textColor = .yellow
            viewToAdd.frame = CGRect(x: 40, y: 40, width: 200, height: 20)
        }
    }

    func sample4(label: UILabel) {
        imageView.image = UIImage(named: "wall")
        imageView.contentMode = .scaleAspectFill
        imageView.drawOnCurrentImage(view: label, mode: .addCopiedSubview) { (parentSize, viewToAdd) in
            print("parentSize: \(parentSize)")
            viewToAdd.font = UIFont.systemFont(ofSize: 16)
            viewToAdd.textColor = .yellow
            viewToAdd.frame = CGRect(x: 40, y: 40, width: 200, height: 20)
        }
    }
}

【讨论】：

谢谢，是的，这对我也有用。但在我原来的项目中虽然没有帮助。我会进一步调试，但谢谢你。以前从未使用过扩展，所以也很高兴知道。谢谢。
如果您需要更多建议，我很乐意为您提供帮助。我需要更多你的代码，或者你得到的图像以及它应该是怎样的。
您的代码第一次运行良好，但如果我再次编辑同一张图像，我会出现内存泄漏：“CGBitmapContextInfoCreate：无法为位图数据分配 2687385600 字节”
我发现输出图像的尺寸和大小增加了x3。所以当我编辑两次图像时，尺寸和大小都增加了 9，我想这解释了内存泄漏和崩溃。
FIXED ：问题是恒定的“let scale”。所以我只是换成了“UIGraphicsBeginImageContext(size)”

【解决方案2】：

瓦西里的答案很好！

但在我的情况下，我需要添加这些修复。

文字很小

我遇到了文本超小的情况，可能是因为 UIImage 的大小对于所选的 14 字体来说太小了，所以我通过提供 120 的大字体来解决这个问题。

给定的 CG 点不显示文本

在大 UIImage 尺寸的相同上下文中，给予扩展的位置错位了文本，修复：添加这 2 个让计算高度和宽度的比率，然后乘以x,y 点。

let widthRatio = size.width/UIScreen.main.bounds.width
let heightRatio = size.height/UIScreen.main.bounds.height

希望对任何人都有帮助！

【讨论】：