WPF stretch image without Stretch="Fill"

Question

I am trying to make responsive WPF app which shows image. One of the program's functionalities is selecting a piece of an image by clicking and draging the mouse. I use Point p = e.GetPosition((IInputElement)sender); to find cursor position, and I found out I cannot use Stretch="Fill" because it causes the MouseUp cursor to select a little lower than it should and MouseMove is also inaccurate (I have to drag the mouse a lot further than I should). On the internet, I found the reason for this behavior that you cannot use Fill and have to use None instead. However, the image is much smaller without Fill.

This is my XAML:

<Grid Grid.Row = "1"
      Grid.Column="1" 
      HorizontalAlignment="Left" 
      VerticalAlignment= "Top"
      Margin="0,30,0,0">
    <Image x:Name= "image1"
           Grid.Row = "1"
           Grid.Column="1"
           Cursor="Cross" 
           MinWidth="300" 
           MinHeight="300" 
           MaxWidth="512" 
           MaxHeight= "512"
           Stretch = "None"
           RenderOptions.BitmapScalingMode="NearestNeighbor" 
           RenderOptions.EdgeMode="Aliased" 
           VerticalAlignment="Top" 
           MouseDown="picOriginal_MouseDown" 
           MouseMove="picOriginal_MouseMove" 
           MouseUp="picOriginal_MouseUp" />
</Grid>

I don't know how to embed my image so that in the window view it fills the grid without this Fill property and at the same time is responsive for fullscreen. Should I wrap Image with something else from the WPF toolbox?

I checked your XAML but found no noticeable difference between Stretch="Fill" and Stretch="None" in terms of mouse location. — emoacht, May 29 '21 at 00:28
What do you mean by selecting a piece of an image? A viewbox might help but you've made us guess what you're doing. — Andy, May 29 '21 at 11:35
@Andy sorry if I didn't make it clear. Imagine that there is a photo and we want to mark a certain square area with the mouse to zoom in on this area. And this area (enlarged) is displayed instead of the previous photo. And I already have this functionality, but the mouse does not move around the image very accurately because of `Stretch = Fill` - or at least that's what I read on some forum. And my question is: is there any other way to have responsive Image besides the Stretch property? — tm607, May 29 '21 at 16:31
after applying the Stretch = Fill you should use p.X * image.ScaleX and p.Y * image.ScaleY instead of p.X and p.Y — Maria, May 30 '21 at 14:08

score 0 · Answer 1 · answered May 30 '21 at 15:28

I find it easier using the background of the picture box to be the image then use the stretch in that. Alternatively, you could use the image with any of the other options, try using the the properties tab, here are the other stretch options tho: None, Fill, Uniform, UniformToFill

Tell me if this helps, tryna get rep, thanks!

WPF stretch image without Stretch="Fill"

1 Answers1