Search code examples
.netwpfrotationrotatetransform

Why all UI elements on the canvas gets rotated even i just try to rotate selected one


I have a canvas which has several images. I have cerated attached property that when ever i click right on my mouse the selected image gets rotated by 90 degree. And it works perfectly for the first rotation. The problem is when i click again then it do not rotate again by 90 degree.

My code is here:

sourceElt.MouseRightButtonUp += (sender, e) =>
            {
                RotateTransform myRotateTransform = new RotateTransform(); 
                DragSourceBase advisorDraggable = GetDragSource(sender as DependencyObject);
                if (advisorDraggable.IsDraggable(e.Source as UIElement) == false) return;
                sourceElt = e.Source as UIElement;
                sourceElt.RenderTransformOrigin = new Point(0.5, 0.5);
                myRotateTransform.Angle = 90;
                sourceElt.RenderTransform = myRotateTransform;
                sourceElt.UpdateLayout();
                _isMouseDown = false;
                ifDraggedAfterRotation = true;
                _offsetPoint = new Point(0, 0);
                Mouse.Capture(null);
                _draggedElt = null;
                e.Handled = true;
            }

To solve the previous problem i tried to do change my code like this:

 RotateTransform myRotateTransform = new RotateTransform(); //kept it outside rigth button click event
                 sourceElt.MouseRightButtonUp += (sender, e) =>
                {

                    DragSourceBase advisorDraggable = GetDragSource(sender as DependencyObject);
                    if (advisorDraggable.IsDraggable(e.Source as UIElement) == false) return;
                    sourceElt = e.Source as UIElement;
                    sourceElt.RenderTransformOrigin = new Point(0.5, 0.5);
                    myRotateTransform.Angle += 90;  // made it +=
                    sourceElt.RenderTransform = myRotateTransform;
                    sourceElt.UpdateLayout();
                    _isMouseDown = false;
                    ifDraggedAfterRotation = true;
                    _offsetPoint = new Point(0, 0);
                    Mouse.Capture(null);
                    _draggedElt = null;
                    e.Handled = true;
                }

It solved my previous problem but another problem arrived that lets say i rotated one image and immediately after i rotate another image , the problem is even if i have not selected the previously rotated image, i just right click on the currently selected image but it rotates both of the image, all the previously selected and the currently selected image.

** How to only rotate the selected image on canvas.**


Solution

  • You probably want to increment the Angle property of an existing RotateTransform by 90 degrees. If the element's RenderTransform property does not already contain a RotateTransform, create and assign it.

    var element = (UIElement)sender;
    var rotateTransform = element.RenderTransform as RotateTransform;
    
    if (rotateTransform == null)
    {
        rotateTransform = new RotateTransform();
        element.RenderTransform = rotateTransform;
        element.RenderTransformOrigin = new Point(0.5, 0.5);
    }
    
    rotateTransform.Angle += 90;