如何在IOS中的UITextView中添加图像和文本？

Question

我想在UITextView中添加文本和图像。应根据文本和图像的长度扩展textview。简而言之，我想要做的是，当我从相机中捕获图像或从图库中选择时，它应该显示在UITextView中，我还应该能够添加一些文本与该图像类似于Facebook。我还附加了一个图像， UITextView的外观如何。

Answer 1

现在绝对可以使用

+ (NSAttributedString *)attributedStringWithAttachment:(NSTextAttachment *)attachment

请参阅Apple文档here

此示例取自其他answer：

UITextView *textView = [[UITextView alloc] initWithFrame:CGRectMake(0,0,140,140)];
NSMutableAttributedString *attributedString = [[NSMutableAttributedString alloc] initWithString:@"before after"];
NSTextAttachment *textAttachment = [[NSTextAttachment alloc] init];
textAttachment.image = [UIImage imageNamed:@"sample_image.jpg"];

CGFloat oldWidth = textAttachment.image.size.width;

//I'm subtracting 10px to make the image display nicely, accounting
//for the padding inside the textView
CGFloat scaleFactor = oldWidth / (textView.frame.size.width - 10);
textAttachment.image = [UIImage imageWithCGImage:textAttachment.image.CGImage scale:scaleFactor orientation:UIImageOrientationUp];
NSAttributedString *attrStringWithImage = [NSAttributedString attributedStringWithAttachment:textAttachment];
[attributedString replaceCharactersInRange:NSMakeRange(6, 1) withAttributedString:attrStringWithImage];
textView.attributedText = attributedString;

使用上面的代码将在iOS 7+上的UITextView中为您提供带有文本的图像。您可以根据需要/显示属性文本的样式，并可能设置图像的宽度以确保它适合您的textView（以及设置您自己的宽高比/比例偏好）

这是一个快速测试图像：

Answer 2

感谢您的代码，它确实有效。我在Swift中创建了一个代码，所以我想分享你的代码的Swift版本。我检查了这段代码。

let textView = UITextView(frame: CGRectMake(50, 50, 200, 300))
let attributedString = NSMutableAttributedString(string: "before after")
let textAttachment = NSTextAttachment()
textAttachment.image = UIImage(named: "sample_image.jpg")!

let oldWidth = textAttachment.image!.size.width;

//I'm subtracting 10px to make the image display nicely, accounting
//for the padding inside the textView
let scaleFactor = oldWidth / (textView.frame.size.width - 10);
textAttachment.image = UIImage(CGImage: textAttachment.image!.CGImage, scale: scaleFactor, orientation: .Up)
var attrStringWithImage = NSAttributedString(attachment: textAttachment)
attributedString.replaceCharactersInRange(NSMakeRange(6, 1), withAttributedString: attrStringWithImage)
textView.attributedText = attributedString;
self.view.addSubview(textView)

Swift 3.0代码

var attributedString :NSMutableAttributedString!
attributedString = NSMutableAttributedString(attributedString:txtBody.attributedText)
let textAttachment = NSTextAttachment()
textAttachment.image = image

let oldWidth = textAttachment.image!.size.width;   

//I'm subtracting 10px to make the image display nicely, accounting
//for the padding inside the textView

let scaleFactor = oldWidth / (txtBody.frame.size.width - 10);
textAttachment.image = UIImage(cgImage: textAttachment.image!.cgImage!, scale: scaleFactor, orientation: .up)
let attrStringWithImage = NSAttributedString(attachment: textAttachment)
attributedString.append(attrStringWithImage)
txtBody.attributedText = attributedString;

Answer 3

如果您只想将图片放在最后，可以使用

//create your UIImage
let image = UIImage(named: change_arr[indexPath.row]);
//create and NSTextAttachment and add your image to it.
let attachment = NSTextAttachment()
attachment.image = image
//put your NSTextAttachment into and attributedString
let attString = NSAttributedString(attachment: attachment)
//add this attributed string to the current position.
textView.textStorage.insertAttributedString(attString, atIndex: textView.selectedRange.location)

检查This answer

Answer 4

如果您想从相机获取图像，可以尝试下面的代码：（Swift 3.0）

func imagePickerController(_ picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [String : Any]) {
    let image = info[UIImagePickerControllerOriginalImage] as! UIImage
    //create and NSTextAttachment and add your image to it.
    let attachment = NSTextAttachment()
    attachment.image = image
    //calculate new size.  (-20 because I want to have a litle space on the right of picture)
    let newImageWidth = (textView.bounds.size.width - 20 )
    let scale = newImageWidth/image.size.width
    let newImageHeight = image.size.height * scale
    //resize this
    attachment.bounds = CGRect.init(x: 0, y: 0, width: newImageWidth, height: newImageHeight)
    //put your NSTextAttachment into and attributedString
    let attString = NSAttributedString(attachment: attachment)
    //add this attributed string to the current position.
    textView.textStorage.insert(attString, at: textView.selectedRange.location)
    picker.dismiss(animated: true, completion: nil)
}

Answer 5

许多人正在使它变得比所需复杂得多。首先，以合适的尺寸将图像添加到目录中：

然后，在代码中创建NSAttributedString：

// Creates the logo image
let twitterLogoImage    = NSTextAttachment()
twitterLogoImage.image  = UIImage(named: "TwitterLogo")
let twitterLogo         = NSAttributedString(attachment: twitterLogoImage)

然后将NSAttributedString添加到您想要的内容中：

// Create the mutable attributed string
let text = NSMutableAttributedString(string: "")

/* Code above, creating the logo */
/*    More attributed strings    */

// Add the logo to the whole text
text.append(twitterLogo)
textView.attributedText = text

或者：

textView.attributedText = twitterLogo

Answer 6

let htmlString = "<html><body><h1>This is the title</h1><p>This is the first paragraph.</p><img src=\"https://miro.medium.com/max/9216/1*QzxcfBpKn5oNM09-vxG_Tw.jpeg\" width=\"360\" height=\"240\"><p>This is the second paragraph.</p><p>This is the third paragraph.</p><p>This is the fourth paragraph.</p><p>This is the last paragraph.</p></body></html>"

使用此字符串扩展名：

extension String {
    func convertToAttributedFromHTML() -> NSAttributedString? {
        var attributedText: NSAttributedString?
        let options: [NSAttributedString.DocumentReadingOptionKey: Any] = [.documentType: NSAttributedString.DocumentType.html, .characterEncoding: String.Encoding.utf8.rawValue]
        if let data = data(using: .unicode, allowLossyConversion: true), let attrStr = try? NSAttributedString(data: data, options: options, documentAttributes: nil) {
            attributedText = attrStr
        }
        return attributedText
    }
}

然后设置textView：

textView.attributedText = htmlString.convertToAttributedFromHTML()

Answer 7

您可以参考MLLabel的工作方式。 主要理想是 NSTextAttachment

• 创建ImageAttachment扩展 NSTextAttachment - ＆gt; override - （可为空的UIImage *）imageForBounds：（CGRect）imageBounds textContainer :( nullable NSTextContainer *）textContainer characterIndex：（NSUInteger）charIndex 返回你想要的图像大小。
• 使用创建NSAttributedString [NSAttributedString attributionStringWithAttachment： ImageAttachment ]
• 创建NSMutableAttributedString并使用 - （void）replaceCharactersInRange：（NSRange）range withAttributedString追加ImageAttachment的属性字符串：（NSAttributedString *）attrString;
• 结果：您有NSMutableAttributedString包含您的图像并将其设置为textView.attributedText

示例：HERE

Answer 8

temp+2

Answer 9

请尝试使用placeholderTextView简单输入图标占位符支持。

@IBOutlet weak var tvMessage: PlaceholderTextView!

let icon: NSTextAttachment = NSTextAttachment()
icon.image = UIImage(named: "paper-plane")
let iconString = NSMutableAttributedString(attributedString: NSAttributedString(attachment: icon))

tvMessage.icon = icon

let textColor = UIColor.gray
let lightFont = UIFont(name: "Helvetica-Light", size: tvMessage.font!.pointSize)
let italicFont = UIFont(name: "Helvetica-LightOblique", size: tvMessage.font!.pointSize)
let message = NSAttributedString(string: " " + "Personal Message", attributes: [ NSFontAttributeName: lightFont!,   NSForegroundColorAttributeName: textColor])
iconString.append(message)
let option = NSAttributedString(string: " " + "Optional", attributes: [ NSFontAttributeName: italicFont!, NSForegroundColorAttributeName: textColor])
iconString.append(option)

tvMessage.attributedPlaceHolder = iconString

tvMessage.layoutSubviews()