Lazy loading System.Windows.Control.Image only when visible

Question

I need my application to render an image only when it becomes visible to the user. I tried attaching. I've tried the following (f#):

   image.IsVisibleChanged.Add(fun e ->
        if image.IsVisible & mtvCapture.Capture <> null then
            mtvCapture.BeginCapture()
        )

But this just loads, doesn't lazy load. How does IsVisible work, will this only be true when the users scrolls the image element into view?

Also tried modifying the binding source like so:

    public ImageSource ImageElementSource
    {
        get
        {
            if (Capture == null)
            {
                BeginCapture();
                return loadingImageSource;
            }

            CaptureToWpfImage();
            return imageElement.Source;
        }
    }

How can I have BeginCapture() be called only when image is scrolled into view?

Answer 1

Sounds like you need something that supports Virtualization. This only creates the visible elements at load time. All other elements are created lazy when they get visible.

Example using VirtualizingStackPanel for a ListBox

<ListBox Name="c_imageListBox">
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <VirtualizingStackPanel Orientation="Vertical"/>
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
    <ListBox.ItemTemplate>
        <DataTemplate>
            <Image Source="{Binding ImagePath}"/>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>