Display a Huge image in WPF application

Question

I wish to display a HD size 1920X1080 image in my WPF application. When I set the image source in the image control, only part of the image is displayed, size of image control.

I do not wish to auto-fit the HD image into the image control. Say the image control is size 640 X 480 then the 640X480 of HD image should be displayed. But when I pan the image then the next 640 X 480 of the image should be displayed. I already have implemented TransformGroup TransformGroup group = new TransformGroup(); ScaleTransform xform = new ScaleTransform(); group.Children.Add(xform); TranslateTransform tt = new TranslateTransform(); group.Children.Add(tt);

But my problem is that entire image is not loaded initially.

score 1 · Accepted Answer · edited May 23 '17 at 10:24

If all you want is the ability to scroll your image...then use:

<Window x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <ScrollViewer HorizontalScrollBarVisibility="Visible">
            <Image Stretch="None" Source="c:\mytestimage.png" />
        </ScrollViewer>
    </Grid>
</Window>

See these handy posts if you want to be more sophisticated/efficient:

score 0 · Answer 2 · answered Apr 08 '20 at 17:23

There is an alternate way to display the image. Set the max-es on the image, so it wont visually load larger than what is needed.

<Image Source="{Binding Source}"
       Stretch="UniformToFill"
       MaxHeight="200"
       MaxWidth="400"/>

Image below shows two images loaded as is, a small one and a large one. The left side shows the large one exploding past the boundaries. The right one shows the proper shrinkage for the large one.

To keep the smaller image from oversizing (as shown on the right side) set the StretchDirection="DownOnly" to keep the smaller one from expanding.

Display a Huge image in WPF application

2 Answers2