Question

I’ve create a user control the display an image followed by a itemcontrol in a stackpanel:

<StackPanel Orientation="Horizontal">
    <Image x:Name="ActorIcon" Source="ms-appx:///Assets/Content/actors.png"/>
    <ItemsControl x:Name="ActorList" ItemsSource="{Binding}">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <StackPanel Orientation="Horizontal"/>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="{Binding Name}" Margin="5,0,0,0"/>
                </StackPanel>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</StackPanel>

The binding is set by an async method (that can take a few second)
I’m searching a way to hide the image until the binding is complete.

thanks.

Answer 1

set default visibility of Image to Collapsed

<Image x:Name="ActorIcon" Source="ms-appx:///Assets/Content/actors.png" Visibility="Collapsed"/>

in your async function

await getSomeData();
ActorIcon.Visibility = Visibility.Visible;

Image will be visible after the item’s load.