UWP community toolkit RoundImageEx image not showing

Question

I have the following DataTemplate for my GridView

        <DataTemplate x:Key="GridViewItemTemplate">
        <Grid Margin="5,10" MaxWidth="80">
            <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>
            <!-- Vendor image-->
            <toolkitControls:RoundImageEx IsCacheEnabled="True" PlaceholderSource="/Assets/Samples/AnotherSampleImage.png" PlaceholderStretch="Uniform" Source="/Assets/Samples/SampleImage.png" Stretch="Uniform" HorizontalAlignment="Center" VerticalAlignment="Center"/>
            <TextBlock Grid.Row="1" Padding="0,5,0,0" Text="{Binding NameEn}" HorizontalAlignment="Center" TextWrapping="Wrap" FontSize="{StaticResource SmallTextSize}"/>
        </Grid>
    </DataTemplate>

Here I'm using RoundImageEx control from UWP community toolkit. The problem is that neither Image not ImagePlaceholder is not showing. I've tried using the ImageEx control from the toolkit and it works great.

GridView using ImageEx in the DataTemplate (it works just fine)

GridView using RoundImageEx in the DateTemplate (images not showing)

Is it some kind of a bug or I'm doing something wrong?

Answer 1

Method 1:

Set HorizontalAlignment and VerticalAlignment as Stretch for your RoundImageEx control

Code Sample

<toolkitControls:RoundImageEx IsCacheEnabled="True" PlaceholderSource="/Assets/Samples/AnotherSampleImage.png" 
                              PlaceholderStretch="Uniform" Source="/Assets/Samples/SampleImage.png" Stretch="Uniform" 
                              HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>

Method 2:

Set Width and Height for your RoundImageEx control

Code Sample

<toolkitControls:RoundImageEx IsCacheEnabled="True" PlaceholderSource="/Assets/Samples/AnotherSampleImage.png" 
                              PlaceholderStretch="Uniform" Source="/Assets/Samples/SampleImage.png" Stretch="Uniform"
                              Width="100" Height="100"/>