在`UITextView`中组合文本和图像 [英] Combining text and images in `UITextView`

问题描述

在开始之前，让我承认存在类似的问题，一些有答案，另一些没有答案。但是，它们没有解决我的具体问题。如果您知道，请转介我。

Before I begin, let me acknowledge that similar questions exist, some with answers, others without. However, they do not address my specific problem. If you know of any, please refer me.

现在，当我将图像添加到 UITextView 时，我放置了光标所在位置的图像。我通过每次附加5个空格来实现这一目的，为图像腾出空间。当光标到达 UItextView 的末尾时，它会停留在那里而不会自动移动到下一行，除非我键入一个键。即使我附加空格，它仍然留在那里，所以我的图像只是堆积在那里。我决定添加一个换行符\ n来手动将它移到下一行。
现在我有两个问题。首先，只有部分角落的图像显示，即使我有这样的条件：

Now, when I add images to the UITextView, I place the images at the point where the cursor is. I achieve this by appending 5 spaces each time to make room for the image. When the cursor gets to the end of the UItextView, it stays there without moving automatically to the next line unless I type a key. Even when I append spaces, it still stays there so my images just pile up there. I decided to add a line-break "\n" to move it to the next line manually. Now I have two problems. First, only part of the images at the corner display even though I have a condition like:

if ((cursorPosition.x + 30) >= message.frame.width) {

        message.text = message.text.stringByAppendingString("\n");
    }
    else {
        message.text = message.text.stringByAppendingString("      ");
    }

如何修复此问题以使其不会超出框架？

How do I fix this to make it not go out of the frame?

其次，因为我手动添加新行，当我删除文本时，光标移动到某个任意位置，这对我来说非常奇怪。例如，我可以删除第4行的文字，但它只会跳到第2行。
任何有关如何解决其中一个或两个的建议都将非常感激。以下是 UITextView 的样子：

Secondly, because am adding new line manually, when I delete a text, the cursor moves to some arbitrary position which is quite weird to me. Example, I could be deleting text on line 4 but it will just jump to line 2. Any suggestion on how to solve either or both would be very much appreciated. Below is how the UITextView looks like:

编辑：我正在编辑此内容以帮助任何可能有类似内容的人问题。我想创建一个应用程序，用户可以像在 WhatsApp 中一样添加文本和图像。我努力做到这一点，直到我建议下面的解决方案。它很棒。希望它可以帮助某人。

Edited: I am editing this to help anyone who may have a similar problem. I wanted to create an app where users add text and images together like we do in WhatsApp for example. I struggled to do this until the solution below was suggested to me. It works great. Hope it helps someone.

推荐答案

如果我了解你的目标，以及你现在如何实现它。您应该检查是否需要先退货。

If I understand your goal, and how you currently have it implemented. You should check if you need to return first.

if ((cursorPosition.x + 30) >= message.frame.width) {
    message.text = message.text.stringByAppendingString("\n");
}

然后你应该获得当前的光标位置，并在那里添加你的UIImageView。

Then you should get the now current cursor position, and add your UIImageView there.

    let size = CGSize(width: 30, height: 30);
    let img = UIImage(named: change_arr[indexPath.row]);
    let addImg = UIImageView(image: UIImage(named: change_arr[indexPath.row]));
    addImg.frame = CGRect(origin: newCursorPosition, size: size);
message.addSubview(addImg);

然后如果您需要添加空格，请立即添加。

then if you need to add spaces, add them now.

如前面的评论中所述，使用NSTextAttachment将简化所有这些，并防止您必须创建UIViews等...

As stated in the previous comments using NSTextAttachment will simplify all of this, and prevent you from having to create UIViews, etc...

它会看起来像这样，你不需要检查光标位置，因为它会像处理文本一样处理它。

it would look something like this, and you don't need to check for the cursor position, because it will handle that just like it does with text.

//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)

现在图像是内联的，并像文本一样对待。如果用户对其进行退格，则会删除文本。

Now the image is inline, and treated like text. If the user backspaces over it, it deletes just like text.

这篇关于在`UITextView`中组合文本和图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！