c# - 如何在 Xamarin 表单 macos 中的条目(用于聊天)中添加自定义图像？

Question

我正在尝试创建一个支持添加文本和图像(自定义图像)的条目。现在我正试图在 macOS 中实现这一点。
到目前为止，我所做的是创建一个自定义控件，其中我有一个图像列表，如果将新图像添加到条目中，我会添加到该列表中。添加后，它的想法是让它放在最后一个文本(或图像)的右侧。
控制:

public class ChatEntry : Entry
{
    public ChatEntry()
    {
        this.HeightRequest = 50;
    }

    public static readonly BindableProperty ImageProperty =
        BindableProperty.Create(nameof(Images), typeof(List<string>), typeof(ChatEntry), string.Empty);

    public static readonly BindableProperty LineColorProperty =
        BindableProperty.Create(nameof(LineColor), typeof(Xamarin.Forms.Color), typeof(ChatEntry), Color.White);

    public static readonly BindableProperty ImageHeightProperty =
        BindableProperty.Create(nameof(ImageHeight), typeof(int), typeof(ChatEntry), 40);

    public static readonly BindableProperty ImageWidthProperty =
        BindableProperty.Create(nameof(ImageWidth), typeof(int), typeof(ChatEntry), 40);

    public Color LineColor
    {
        get { return (Color)GetValue(LineColorProperty); }
        set { SetValue(LineColorProperty, value); }
    }

    public int ImageWidth
    {
        get { return (int)GetValue(ImageWidthProperty); }
        set { SetValue(ImageWidthProperty, value); }
    }

    public int ImageHeight
    {
        get { return (int)GetValue(ImageHeightProperty); }
        set { SetValue(ImageHeightProperty, value); }
    }

    public List<string> Images
    {
        get { return (List<string>)GetValue(ImageProperty); }
        set { SetValue(ImageProperty, value); }
    }
}

MacOS 渲染器:

[assembly: ExportRenderer(typeof(ChatEntry), typeof(ChatEntryRenderer))]
namespace Project.MacOS.Renderers
{
public class ChatEntryRenderer : EntryRenderer
{
    protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
    {
        base.OnElementChanged(e);

        if (e.OldElement != null || e.NewElement == null)
            return;

        var element = (ChatEntry)this.Element;
        var textField = this.Control;
        if (element.Images != null)
        {
            // TODO : Logic GetImageView
        }

        CALayer bottomBorder = new CALayer
        {
            Frame = new CGRect(0.0f, element.HeightRequest - 1, this.Frame.Width, 1.0f),
            BorderWidth = 2.0f,
            BorderColor = element.LineColor.ToCGColor()
        };

        textField.Layer.AddSublayer(bottomBorder);
        textField.Layer.MasksToBounds = true;
    }

    private NSView GetImageView(string imagePath, int height, int width)
    {
        var uiImageView = new NSImageView()
        {
            Frame = new RectangleF(0, 0, width, height)
        };

        uiImageView.Image = NSImage.ImageNamed(imagePath);

        NSView objLeftView = new NSView(new System.Drawing.Rectangle(0, 0, width + 10, height));
        objLeftView.AddSubview(uiImageView);

        return objLeftView;
    }
}
}

我现在的问题是将这一切绑定(bind)在一起。我创建了一个 GetImageView我可以在哪里得到一个 NSView，但是我如何将它合并到前一个字符(或图像)的右侧，我不确定并且需要一些指导。

Answer 1

在此之前，我想说的是 Xamarin for MacOS 仍处于预览阶段，对于入门级，仍有一些功能待开发，可能会影响您的应用程序，如果您要发布您的应用程序，您应该仔细考虑和测试。您可以找到条目 here 的状态
如果我正确理解了您的问题，那么您正在尝试创建一个自定义条目，该条目可以像这样将文本和图像放入其中:

text[IMG1]abc[IMG2]...

这里有一些可能会给出一些想法的东西: how to implement a label with a image in the center .
它正在利用 NSTextAttachment保存图像和 NSMutableAttributedString] 4将整个字符串保存在条目中。不同之处在于，它只有一个图像，但您将在条目中有多个图像，因此您可能需要一个字典来将字符串中的占位符映射到实际图像。