question

AidanLee-0513 avatar image
0 Votes"
AidanLee-0513 asked DaisyTian-1203 answered

In WPF, move the view to a specific shape

In WPF, I have some 2D shapes in canvas. I need to move the view to a specific shape.

When I click on the shape, the view port automatically centers it and zooms in.

Instead of panning and zooming the canvas with the mouse, I want to automatically move the view.

How do we implement this in C# ?

Any answer would be appreciated.

Aidan

dotnet-csharpwindows-wpf
· 2
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

@AidanLee-0513
Do you want to zoom in on the shape and make it Center in the Window when you click shapes? or stretch the shapes? After the picture is enlarged, do you need to restore it? How about using RenderTransform.ScaleX and "RenderTransform.ScaleY" to zoom shapes?

0 Votes 0 ·

Yes, I want to center it without stretch it. In fact, my canvas only has some basic shape, like ellipse and rectangular.

I have implemented the panning and scaling of this canvas by using TransformGroup which contains ScaleTransform.


The scenario is that the shape that needs to be displayed and zoomed may be beyond the rendering range of the current window size, so the key problem is:
1. Can't find a way to move the Canvas perspective to make the current windows render it
2. How to adaptively center and zoom the shape found to the current window size?



0 Votes 0 ·

1 Answer

DaisyTian-1203 avatar image
0 Votes"
DaisyTian-1203 answered

Could you consider popup as a workaround for displaying enlarged shape? Here is my sample for it:

     <Grid>
         <Rectangle Name="rec" Width="100" Height="100" Fill="Red" VerticalAlignment="Top" MouseLeftButtonDown="rec_MouseLeftButtonDown">
         </Rectangle>
         <Popup Name="pop1"  StaysOpen="False" Placement="Center">
             <Rectangle  Width="{Binding RelativeSource={RelativeSource AncestorType=Window,AncestorLevel=1,Mode=FindAncestor},Path=Width}"
                         Height="{Binding RelativeSource={RelativeSource AncestorType=Window,AncestorLevel=1,Mode=FindAncestor},Path=Height}"
                         Fill="Red"
                         />
         </Popup>
     </Grid>

The rec_MouseLeftButtonDown code is:

 private void rec_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
         {
             pop1.IsOpen = true;
         }

If the response is helpful, please click "Accept Answer" and upvote it.
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.