UWP RichEditBox InsertImage inserts a blank

Question

I'm working on a UWP using Visual Studio Community 2015. I created a blank project, added a button and RichEditBox. I'm trying to insert an image in RichEditBox from local resources, but I only insert a blank placeholder (with the desired size of the image). No errors are thrown.

Here is the code behind:

private async void Button_Click(object sender, RoutedEventArgs e)
{
    Uri imageUri = new Uri("ms-appx:///Assets/StoreLogo.png");
    using (IRandomAccessStream ras = await RandomAccessStreamReference.CreateFromUri(imageUri).OpenReadAsync())
    {
        box.Document.Selection.InsertImage(64, 64, 0, VerticalCharacterAlignment.Baseline, "img", ras);
    }
}

Here is the xaml:

<Button Content="Insert image" Click="Button_Click"/>
<RichEditBox Name="box" Height="200"/>

Build action of StoreLogo.png is "content", I tried to copy the image to the output directory which made no difference.

What could be the problem here? What's the correct way to do this?

Answer 1

I can see your issue, however, in my experience, the common way is using StorageFile.OpenAsync to get IRandomAccessStream. And set it to ITextRange.InsertImage.

For example:

Uri imageUri = new Uri("ms-appx:///Assets/StoreLogo.png");

StorageFile imageFile = await StorageFile.GetFileFromApplicationUriAsync(imageUri);

using (IRandomAccessStream fileStream = await imageFile.OpenAsync(Windows.Storage.FileAccessMode.Read))

{

    box.Document.Selection.InsertImage(64, 64, 0, VerticalCharacterAlignment.Baseline, "img", fileStream);

}

You can try to use this way to work around it.