Mike Ward
Mike Ward

Reputation: 3329

ImageBrush with async ImageSource doesn't always render

I'm rendering images in a WPF ItemsControl as follows:

<ItemsControl.ItemTemplate>
  <DataTemplate>
    <Border
      Height="200"
      HorizontalAlignment="Stretch"
      CornerRadius="9,9,0,0">
      <Border.Background>
        <ImageBrush
          ImageSource="{Binding MediaUrl, Mode=OneWay, IsAsync=True}"
          RenderOptions.BitmapScalingMode="LowQuality"
          RenderOptions.CachingHint="Cache"
          Stretch="UniformToFill" />
      </Border.Background>
    </Border>
  </DataTemplate>
</ItemsControl.ItemTemplate>

The ImageSource is bound to a URL pointing to an image server on the Web (HTTP protocol)

Sometimes the ImageBrush doesn't render but if I move the mouse over something in the program that that has to draw (a button that highlights on mouseover for instance), the image renders.

Is there something I can do to nudge WPF to render the ImageBrush after it loads?

.NET Core 3.1

Upvotes: 1

Views: 477

Answers (1)

Mike Ward
Mike Ward

Reputation: 3329

From the discussion above I put together this solution. VisualBrush allowed me to use an Image instead of ImageBrush, which behaves better in my use case.

<ItemsControl.ItemTemplate>
  <DataTemplate>
    <Border
      Height="200"
      HorizontalAlignment="Stretch"
      CornerRadius="9,9,0,0">
      <Border.Background>
        <VisualBrush
          AlignmentY="Top"
          Stretch="UniformToFill">
          <VisualBrush.Visual>
            <Image
              RenderOptions.BitmapScalingMode="LowQuality"
              Source="{Binding MediaUrl}" />
          </VisualBrush.Visual>
        </VisualBrush>
      </Border.Background>
    </Border>
  </DataTemplate>
</ItemsControl.ItemTemplate>

Upvotes: 3

Related Questions