Question

I would like to zoom in/out an image exactly where mouse click occurs. Whole image should be zoomed but current view should show the part where mouse click happened and scrollbar should be available for seeing other parts as well.

I tried using scrollviewer and placed my image control inside it. On mouse click am using RenderTransform and increasing the scale by 1 everytime user clicks for Zoom in.Image is getting zoomed-in but view is not at the place where mouse click occured.

Please help!

THanks Sai

Was it helpful?

Solution

You need to set the RenderTransformOrigin property based on the mouse location.

Values for RenderTransformOrigin are evaluated against the top left corner of the bounding box for a UIElement.

You will need to convert your mouse location to the coordinates of the image to get the correct origin and normalize the values so that they are in the range 0 to 1 by dividing the position by the dimensions of the image.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top