WPF Image as ToolTip - DPI issue

Question

I've been scratching my head for a while with this.

On my MainWindow I have an an Image who's ToolTip should pop up the image at it's actual size (or with a height no larger than the MainWindow itself):

<Image x:Name="ss1" Grid.Column="0" Grid.Row="0" Margin="0">
    <Image.ToolTip>
        <ToolTip DataContext="{Binding PlacementTarget, RelativeSource={RelativeSource Self}}">
            <Border BorderBrush="Black" BorderThickness="1" Margin="5,7,5,5">
                <Image Source="{Binding Source}" MaxHeight="{Binding ElementName=MW,Path=Height}" Stretch="Uniform" ToolTipService.Placement="Top"/>
            </Border>
        </ToolTip>
    </Image.ToolTip>
</Image>

(MainWindow's x:name is 'MW')

In another class elsewhere I am loading a BitmapImage into this image control:

Image img = (Image)mw.FindName("ss1");
img.Source = GetBitmapImageFromDisk(path, UriKind.Absolute);

And the GetBitMapImageFromDisk method:

public static BitmapImage GetBitmapImageFromDisk(string path, UriKind urikind)
{
    if (!File.Exists(path))
        return null;
    try
    {
        BitmapImage b = new BitmapImage(new Uri(path, urikind));
        return b;
    }
    catch (System.NotSupportedException ex)
    {       
        BitmapImage c = new BitmapImage();
        return c;
    }        
}

The image ToolTip pops up on mouse over but the problem is that the size of the image appears to be dependent on the DPI of the image itself. So if for some reason it targets an image who's DPI is say '762' the ToolTip image is really tiny when it is displayed.

Can anyone suggest a way of mitigating this with my current code? The images that are loaded at runtime can be pretty much any size, DPI and aspect ratio.

Maybe helpful: http://stackoverflow.com/a/644625/1136211 – Clemens Nov 03 '16 at 09:55 — Clemens, Nov 03 '16 at 09:55

score 1 · Accepted Answer · answered Nov 03 '16 at 11:39

Many thanks to Clemens for the link, it was indeed very helpful (specifically the pixelwidth and pixelheight properties).

I was having some problems with defining max values in the xaml so in the end I abstracted the logic out into the code behind.

Code for completeness:

XAML:

<Image x:Name="ss1" Grid.Column="0" Grid.Row="0" Margin="0">
    <Image.ToolTip>
        <ToolTip DataContext="{Binding PlacementTarget, RelativeSource={RelativeSource Self}}">
            <Border BorderBrush="Black" BorderThickness="1" Margin="5,7,5,5">
                <Image Source="{Binding Source}" Stretch="Uniform" ToolTipService.Placement="Top"/>
            </Border>
        </ToolTip>
    </Image.ToolTip>
</Image>

The Other Class:

Image img = (Image)mw.FindName("ss1");
SetImage(img, path, UriKind.Absolute);

Method:

public static void SetImage(Image img, string path, UriKind urikind)
{            
    if (!File.Exists(path))
        return;
    try
    {
        // load content into the image
        BitmapImage b = new BitmapImage(new Uri(path, urikind));
        img.Source = b;

        // get actual pixel dimensions of image
        double pixelWidth = (img.Source as BitmapSource).PixelWidth;
        double pixelHeight = (img.Source as BitmapSource).PixelHeight;

        // get dimensions of main window
        MainWindow mw = Application.Current.Windows.OfType<MainWindow>().FirstOrDefault();
        double windowWidth = mw.ActualWidth;
        double windowHeight = mw.ActualHeight;

        // set max dimensions on Image.ToolTip
        ToolTip tt = (ToolTip)img.ToolTip;
        tt.MaxHeight = windowHeight / 1.1;
        tt.MaxWidth = windowWidth / 1.1;
        img.ToolTip = tt;
    }

    catch (System.NotSupportedException ex)
    {
        img.Source = new BitmapImage();
    }
}

Once I could identify the pixel width & height of the image it was fairly simple to set the MaxHeight and MaxWidth on the ToolTip itself.

WPF Image as ToolTip - DPI issue

1 Answers1