Question

I have a WPF Window with Viewbox. I want one of the child elements of this Viewbox to stay the same size at any screen resolution.

My XAML:

<Viewbox Name="MyMainViewbox" Stretch="Fill">
<Grid Name="MyMainGrid">
    <Image Source="Images/bg.bmp" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Stretch="Fill"/>
    <Image Name="Thumb1" Source="Images/t1.png"  MouseUp="Right_Click"  Margin="0, 100, 50, 0" HorizontalAlignment="Right" VerticalAlignment="Stretch" Visibility="Visible"/>
    <Image Name="Thumb2" Source="Images/t2.png" MouseUp="Left_Click"  Margin="50, 100, 0, 0" HorizontalAlignment="Left"  VerticalAlignment="Stretch" Visibility="Visible"/>
    <Image Name="CurThumb" Width="640" Height="480" Stretch="UniformToFill"  Margin="0, 50, 0, 0" HorizontalAlignment="Center" VerticalAlignment="Center" Visibility="Hidden"/>
 </Grid>
</Viewbox>

The first 2 images inside the Viewbox are predefined and scaled finely at the different screen resolutions. My problem is with the 3rd image that gets its source during the runtime and should be of the same exact size at all resolutions. It will contain photos taken at 4x3 aspect ration, and I want them to stay so.

However at 16x9 screen resolutions they are stretched. I have tried to set a fixed size in XAML - it doesn't work. I have tried to set Stretch to None - doesn't work neither. I have tried to rest the sizes of this Image in the code behind - to no avail.

What else can I do to make this third picture unscalable? It should stay inside the Viewbox for a couple of reasons.

Was it helpful?

Solution

Use two overlapping elements.

<Grid>
    <Viewbox>
        <Grid>
            ... scaled images
        </Grid>
    </Viewbox>
    <Grid>
        ... non scaled images
    <Grid>
<Grid>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top