Hooked up rotation and opacity

src/Artemis.UI/Screens/Module/ProfileEditor/Visualization/ProfileLayerViewModel.cs

@@ -83,7 +83,6 @@ namespace Artemis.UI.Screens.Module.ProfileEditor.Visualization
             }
 
             var layerGeometry = group.GetOutlinedPathGeometry();
-
             var opacityGeometry = Geometry.Combine(Geometry.Empty, layerGeometry, GeometryCombineMode.Exclude, new TranslateTransform());
             layerGeometry.Freeze();
             opacityGeometry.Freeze();
@@ -120,6 +119,10 @@ namespace Artemis.UI.Screens.Module.ProfileEditor.Visualization
                     break;
             }
 
+            // Apply transformation like done by the core during layer rendering
+            var anchor = Layer.LayerShape.GetUnscaledAnchor();
+            shapeGeometry.Transform = new RotateTransform(Layer.RotationProperty.CurrentValue, anchor.X, anchor.Y);
+
             shapeGeometry.Freeze();
             ShapeGeometry = shapeGeometry;
         }

src/Artemis.UI/Screens/Module/ProfileEditor/Visualization/ProfileViewModel.cs

@@ -46,7 +46,7 @@ namespace Artemis.UI.Screens.Module.ProfileEditor.Visualization
             {
                 CanvasViewModels = new ObservableCollection<CanvasViewModel>();
                 DeviceViewModels = new ObservableCollection<ProfileDeviceViewModel>();
-                PanZoomViewModel = new PanZoomViewModel();
+                PanZoomViewModel = new PanZoomViewModel {LimitToZero = false};
             });
 
             ApplySurfaceConfiguration(surfaceService.ActiveSurface);

src/Artemis.UI/Screens/Module/ProfileEditor/Visualization/Tools/EditToolView.xaml

@@ -10,112 +10,119 @@
              d:DesignWidth="800"
              d:DataContext="{d:DesignInstance {x:Type local:EditToolViewModel}}">
     <Canvas UseLayoutRounding="False">
-        <!-- The rectangle around the shape that allows modification -->
-        <Rectangle Width="{Binding ShapeSkRect.Width}"
-                   Height="{Binding ShapeSkRect.Height}"
-                   Canvas.Left="{Binding ShapeSkRect.Left}"
-                   Canvas.Top="{Binding ShapeSkRect.Top}"
-                   Fill="Transparent"
-                   Stroke="{DynamicResource PrimaryHueMidBrush}"
-                   StrokeThickness="1"
-                   StrokeDashArray="2 2"
-                   Cursor="Hand"
-                   MouseDown="{s:Action ShapeEditMouseDown}"
-                   MouseUp="{s:Action ShapeEditMouseUp}"
-                   MouseMove="{s:Action Move}" />
+        <Canvas >
+            <!-- The rectangle around the shape that allows modification -->
+            <Canvas.RenderTransform>
+                <RotateTransform Angle="{Binding RotationAngle}" CenterX="{Binding AnchorSkPoint.X}" CenterY="{Binding AnchorSkPoint.Y}" />
+            </Canvas.RenderTransform>
+            <Rectangle Width="{Binding ShapeSkRect.Width}"
+                       Height="{Binding ShapeSkRect.Height}"
+                       Canvas.Left="{Binding ShapeSkRect.Left}"
+                       Canvas.Top="{Binding ShapeSkRect.Top}"
+                       Fill="Transparent"
+                       Stroke="{DynamicResource PrimaryHueMidBrush}"
+                       StrokeThickness="1"
+                       StrokeDashArray="2 2"
+                       Cursor="Hand"
+                       MouseDown="{s:Action ShapeEditMouseDown}"
+                       MouseUp="{s:Action ShapeEditMouseUp}"
+                       MouseMove="{s:Action Move}" />
 
-        <!-- Anchor point -->
-        <Ellipse MouseDown="{s:Action ShapeEditMouseDown}"
-                 MouseUp="{s:Action ShapeEditMouseUp}"
-                 MouseMove="{s:Action AnchorMove}"
-                 Width="6" Height="6" Fill="{DynamicResource SecondaryAccentBrush}" Canvas.Left="{Binding AnchorSkPoint.X}" Canvas.Top="{Binding AnchorSkPoint.Y}" Margin="-3,-3,0,0" Cursor="SizeAll" />
+            <!-- Top left display -->
+            <Rectangle Width="4" Height="4" Canvas.Left="{Binding ShapeSkRect.Left}" Canvas.Top="{Binding ShapeSkRect.Top}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
+            <!-- Top left rotate handle -->
+            <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
+                       MouseUp="{s:Action ShapeEditMouseUp}"
+                       MouseMove="{s:Action TopLeftRotate}"
+                       Width="15" Height="15" Canvas.Left="{Binding ShapeSkRect.Left}" Canvas.Top="{Binding ShapeSkRect.Top}" Fill="Transparent" Margin="-12,-12,0,0"
+                       Cursor="/Resources/aero_rotate_tl.cur" />
+            <!-- Top left resize handle -->
+            <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
+                       MouseUp="{s:Action ShapeEditMouseUp}"
+                       MouseMove="{s:Action TopLeftResize}"
+                       Width="6" Height="6" Canvas.Left="{Binding ShapeSkRect.Left}" Canvas.Top="{Binding ShapeSkRect.Top}" Fill="Transparent" Margin="-3,-3,0,0" Cursor="SizeNWSE" />
 
-        <!-- Top left display -->
-        <Rectangle Width="4" Height="4" Canvas.Left="{Binding ShapeSkRect.Left}" Canvas.Top="{Binding ShapeSkRect.Top}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
-        <!-- Top left rotate handle -->
-        <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
-                   MouseUp="{s:Action ShapeEditMouseUp}"
-                   MouseMove="{s:Action TopLeftRotate}"
-                   Width="15" Height="15" Canvas.Left="{Binding ShapeSkRect.Left}" Canvas.Top="{Binding ShapeSkRect.Top}" Fill="Transparent" Margin="-12,-12,0,0"
-                   Cursor="/Resources/aero_rotate_tl.cur" />
-        <!-- Top left resize handle -->
-        <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
-                   MouseUp="{s:Action ShapeEditMouseUp}"
-                   MouseMove="{s:Action TopLeftResize}"
-                   Width="6" Height="6" Canvas.Left="{Binding ShapeSkRect.Left}" Canvas.Top="{Binding ShapeSkRect.Top}" Fill="Transparent" Margin="-3,-3,0,0" Cursor="SizeNWSE" />
+            <!-- Top center display -->
+            <Rectangle Width="4" Height="4" Canvas.Left="{Binding ShapeSkRect.MidX}" Canvas.Top="{Binding ShapeSkRect.Top}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
+            <!-- Top center resize handle -->
+            <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
+                       MouseUp="{s:Action ShapeEditMouseUp}"
+                       MouseMove="{s:Action TopCenterResize}"
+                       Width="10" Height="10" Canvas.Left="{Binding ShapeSkRect.MidX}" Canvas.Top="{Binding ShapeSkRect.Top}" Fill="Transparent" Margin="-5,-5,0,0" Cursor="SizeNS" />
 
-        <!-- Top center display -->
-        <Rectangle Width="4" Height="4" Canvas.Left="{Binding ShapeSkRect.MidX}" Canvas.Top="{Binding ShapeSkRect.Top}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
-        <!-- Top center resize handle -->
-        <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
-                   MouseUp="{s:Action ShapeEditMouseUp}"
-                   MouseMove="{s:Action TopCenterResize}"
-                   Width="10" Height="10" Canvas.Left="{Binding ShapeSkRect.MidX}" Canvas.Top="{Binding ShapeSkRect.Top}" Fill="Transparent" Margin="-5,-5,0,0" Cursor="SizeNS" />
+            <!-- Top right display -->
+            <Rectangle Width="4" Height="4" Canvas.Left="{Binding ShapeSkRect.Right}" Canvas.Top="{Binding ShapeSkRect.Top}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
+            <!-- Top right rotate handle -->
+            <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
+                       MouseUp="{s:Action ShapeEditMouseUp}"
+                       MouseMove="{s:Action TopRightRotate}"
+                       Width="15" Height="15" Canvas.Left="{Binding ShapeSkRect.Right}" Canvas.Top="{Binding ShapeSkRect.Top}" Fill="Transparent" Margin="-3,-12,0,0"
+                       Cursor="/Resources/aero_rotate_tr.cur" />
+            <!-- Top right resize handle -->
+            <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
+                       MouseUp="{s:Action ShapeEditMouseUp}"
+                       MouseMove="{s:Action TopRightResize}"
+                       Width="6" Height="6" Canvas.Left="{Binding ShapeSkRect.Right}" Canvas.Top="{Binding ShapeSkRect.Top}" Fill="Transparent" Margin="-3,-3,0,0" Cursor="SizeNESW" />
 
-        <!-- Top right display -->
-        <Rectangle Width="4" Height="4" Canvas.Left="{Binding ShapeSkRect.Right}" Canvas.Top="{Binding ShapeSkRect.Top}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
-        <!-- Top right rotate handle -->
-        <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
-                   MouseUp="{s:Action ShapeEditMouseUp}"
-                   MouseMove="{s:Action TopRightRotate}"
-                   Width="15" Height="15" Canvas.Left="{Binding ShapeSkRect.Right}" Canvas.Top="{Binding ShapeSkRect.Top}" Fill="Transparent" Margin="-3,-12,0,0"
-                   Cursor="/Resources/aero_rotate_tr.cur" />
-        <!-- Top right resize handle -->
-        <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
-                   MouseUp="{s:Action ShapeEditMouseUp}"
-                   MouseMove="{s:Action TopRightResize}"
-                   Width="6" Height="6" Canvas.Left="{Binding ShapeSkRect.Right}" Canvas.Top="{Binding ShapeSkRect.Top}" Fill="Transparent" Margin="-3,-3,0,0" Cursor="SizeNESW" />
+            <!-- Center right display -->
+            <Rectangle Width="4" Height="4" Canvas.Left="{Binding ShapeSkRect.Right}" Canvas.Top="{Binding ShapeSkRect.MidY}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
+            <!-- Center right resize handle -->
+            <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
+                       MouseUp="{s:Action ShapeEditMouseUp}"
+                       MouseMove="{s:Action CenterRightResize}"
+                       Width="10" Height="10" Canvas.Left="{Binding ShapeSkRect.Right}" Canvas.Top="{Binding ShapeSkRect.MidY}" Fill="Transparent" Margin="-5,-5,0,0" Cursor="SizeWE" />
 
-        <!-- Center right display -->
-        <Rectangle Width="4" Height="4" Canvas.Left="{Binding ShapeSkRect.Right}" Canvas.Top="{Binding ShapeSkRect.MidY}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
-        <!-- Center right resize handle -->
-        <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
-                   MouseUp="{s:Action ShapeEditMouseUp}"
-                   MouseMove="{s:Action CenterRightResize}"
-                   Width="10" Height="10" Canvas.Left="{Binding ShapeSkRect.Right}" Canvas.Top="{Binding ShapeSkRect.MidY}" Fill="Transparent" Margin="-5,-5,0,0" Cursor="SizeWE" />
+            <!-- Bottom right display -->
+            <Rectangle Width="4" Height="4" Canvas.Left="{Binding ShapeSkRect.Right}" Canvas.Top="{Binding ShapeSkRect.Bottom}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
+            <!-- Bottom right rotate handle -->
+            <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
+                       MouseUp="{s:Action ShapeEditMouseUp}"
+                       MouseMove="{s:Action BottomRightRotate}"
+                       Width="15" Height="15" Canvas.Left="{Binding ShapeSkRect.Right}" Canvas.Top="{Binding ShapeSkRect.Bottom}" Fill="Transparent" Margin="-3,-3,0,0"
+                       Cursor="/Resources/aero_rotate_br.cur" />
+            <!-- Bottom right resize handle -->
+            <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
+                       MouseUp="{s:Action ShapeEditMouseUp}"
+                       MouseMove="{s:Action BottomRightResize}"
+                       Width="6" Height="6" Canvas.Left="{Binding ShapeSkRect.Right}" Canvas.Top="{Binding ShapeSkRect.Bottom}" Fill="Transparent" Margin="-3,-3,0,0" Cursor="SizeNWSE" />
 
-        <!-- Bottom right display -->
-        <Rectangle Width="4" Height="4" Canvas.Left="{Binding ShapeSkRect.Right}" Canvas.Top="{Binding ShapeSkRect.Bottom}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
-        <!-- Bottom right rotate handle -->
-        <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
-                   MouseUp="{s:Action ShapeEditMouseUp}"
-                   MouseMove="{s:Action BottomRightRotate}"
-                   Width="15" Height="15" Canvas.Left="{Binding ShapeSkRect.Right}" Canvas.Top="{Binding ShapeSkRect.Bottom}" Fill="Transparent" Margin="-3,-3,0,0"
-                   Cursor="/Resources/aero_rotate_br.cur" />
-        <!-- Bottom right resize handle -->
-        <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
-                   MouseUp="{s:Action ShapeEditMouseUp}"
-                   MouseMove="{s:Action BottomRightResize}"
-                   Width="6" Height="6" Canvas.Left="{Binding ShapeSkRect.Right}" Canvas.Top="{Binding ShapeSkRect.Bottom}" Fill="Transparent" Margin="-3,-3,0,0" Cursor="SizeNWSE" />
+            <!-- Bottom center display -->
+            <Rectangle Width="4" Height="4" Canvas.Left="{Binding ShapeSkRect.MidX}" Canvas.Top="{Binding ShapeSkRect.Bottom}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
+            <!-- Bottom center resize handle -->
+            <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
+                       MouseUp="{s:Action ShapeEditMouseUp}"
+                       MouseMove="{s:Action BottomCenterResize}"
+                       Width="10" Height="10" Canvas.Left="{Binding ShapeSkRect.MidX}" Canvas.Top="{Binding ShapeSkRect.Bottom}" Fill="Transparent" Margin="-5,-5,0,0" Cursor="SizeNS" />
 
-        <!-- Bottom center display -->
-        <Rectangle Width="4" Height="4" Canvas.Left="{Binding ShapeSkRect.MidX}" Canvas.Top="{Binding ShapeSkRect.Bottom}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
-        <!-- Bottom center resize handle -->
-        <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
-                   MouseUp="{s:Action ShapeEditMouseUp}"
-                   MouseMove="{s:Action BottomCenterResize}"
-                   Width="10" Height="10" Canvas.Left="{Binding ShapeSkRect.MidX}" Canvas.Top="{Binding ShapeSkRect.Bottom}" Fill="Transparent" Margin="-5,-5,0,0" Cursor="SizeNS" />
+            <!-- Bottom left display -->
+            <Rectangle Width="4" Height="4" Canvas.Left="{Binding ShapeSkRect.Left}" Canvas.Top="{Binding ShapeSkRect.Bottom}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
+            <!-- Bottom left rotate handle -->
+            <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
+                       MouseUp="{s:Action ShapeEditMouseUp}"
+                       MouseMove="{s:Action BottomLeftRotate}"
+                       Width="15" Height="15" Canvas.Left="{Binding ShapeSkRect.Left}" Canvas.Top="{Binding ShapeSkRect.Bottom}" Fill="Transparent" Margin="-12,-3,0,0"
+                       Cursor="/Resources/aero_rotate_bl.cur" />
+            <!-- Bottom left resize handle -->
+            <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
+                       MouseUp="{s:Action ShapeEditMouseUp}"
+                       MouseMove="{s:Action BottomLeftResize}"
+                       Width="6" Height="6" Canvas.Left="{Binding ShapeSkRect.Left}" Canvas.Top="{Binding ShapeSkRect.Bottom}" Fill="Transparent" Margin="-3, -3, 0,0" Cursor="SizeNESW" />
 
-        <!-- Bottom left display -->
-        <Rectangle Width="4" Height="4" Canvas.Left="{Binding ShapeSkRect.Left}" Canvas.Top="{Binding ShapeSkRect.Bottom}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
-        <!-- Bottom left rotate handle -->
-        <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
-                   MouseUp="{s:Action ShapeEditMouseUp}"
-                   MouseMove="{s:Action BottomLeftRotate}"
-                   Width="15" Height="15" Canvas.Left="{Binding ShapeSkRect.Left}" Canvas.Top="{Binding ShapeSkRect.Bottom}" Fill="Transparent" Margin="-12,-3,0,0"
-                   Cursor="/Resources/aero_rotate_bl.cur" />
-        <!-- Bottom left resize handle -->
-        <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
-                   MouseUp="{s:Action ShapeEditMouseUp}"
-                   MouseMove="{s:Action BottomLeftResize}"
-                   Width="6" Height="6" Canvas.Left="{Binding ShapeSkRect.Left}" Canvas.Top="{Binding ShapeSkRect.Bottom}" Fill="Transparent" Margin="-3, -3, 0,0" Cursor="SizeNESW" />
-
-        <!-- Center left display -->
-        <Rectangle Width="4" Height="4" Canvas.Left="{Binding ShapeSkRect.Left}" Canvas.Top="{Binding ShapeSkRect.MidY}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
-        <!-- Center left resize handle -->
-        <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
-                   MouseUp="{s:Action ShapeEditMouseUp}"
-                   MouseMove="{s:Action CenterLeftResize}"
-                   Width="10" Height="10" Canvas.Left="{Binding ShapeSkRect.Left}" Canvas.Top="{Binding ShapeSkRect.MidY}" Fill="Transparent" Margin="-5,-5,0,0" Cursor="SizeWE" />
+            <!-- Center left display -->
+            <Rectangle Width="4" Height="4" Canvas.Left="{Binding ShapeSkRect.Left}" Canvas.Top="{Binding ShapeSkRect.MidY}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
+            <!-- Center left resize handle -->
+            <Rectangle MouseDown="{s:Action ShapeEditMouseDown}"
+                       MouseUp="{s:Action ShapeEditMouseUp}"
+                       MouseMove="{s:Action CenterLeftResize}"
+                       Width="10" Height="10" Canvas.Left="{Binding ShapeSkRect.Left}" Canvas.Top="{Binding ShapeSkRect.MidY}" Fill="Transparent" Margin="-5,-5,0,0" Cursor="SizeWE" />
+        </Canvas>
+        <Canvas>
+            <!-- Anchor point -->
+            <Ellipse MouseDown="{s:Action AnchorEditMouseDown}"
+                     MouseUp="{s:Action ShapeEditMouseUp}"
+                     MouseMove="{s:Action AnchorMove}"
+                     Width="6" Height="6" Fill="{DynamicResource SecondaryAccentBrush}" Canvas.Left="{Binding AnchorSkPoint.X}" Canvas.Top="{Binding AnchorSkPoint.Y}" Margin="-3,-3,0,0"
+                     Cursor="SizeAll" />
+        </Canvas>
     </Canvas>
 </UserControl>

src/Artemis.UI/Screens/Module/ProfileEditor/Visualization/Tools/EditToolViewModel.cs

@@ -29,6 +29,7 @@ namespace Artemis.UI.Screens.Module.ProfileEditor.Visualization.Tools
 
         public SKRect ShapeSkRect { get; set; }
         public SKPoint AnchorSkPoint { get; set; }
+        public int RotationAngle { get; set; }
 
         private void Update()
         {
@@ -38,6 +39,7 @@ namespace Artemis.UI.Screens.Module.ProfileEditor.Visualization.Tools
                 {
                     ShapeSkRect = layer.LayerShape.GetUnscaledRectangle();
                     AnchorSkPoint = layer.LayerShape.GetUnscaledAnchor();
+                    RotationAngle = layer.RotationProperty.CurrentValue;
                 }
             }
         }
@@ -64,15 +66,29 @@ namespace Artemis.UI.Screens.Module.ProfileEditor.Visualization.Tools
             e.Handled = true;
         }
 
+        public void AnchorEditMouseDown(object sender, MouseButtonEventArgs e)
+        {
+            if (_isDragging)
+                return;
+
+            // Use the regular mousedown
+            ShapeEditMouseDown(sender, e);
+            // Override the drag offset
+            var dragStartPosition = GetRelativePosition(sender, e);
+            _dragOffsetX = AnchorSkPoint.X - dragStartPosition.X;
+            _dragOffsetY = AnchorSkPoint.Y - dragStartPosition.Y;
+            _dragStart = dragStartPosition;
+        }
+
         public void ShapeEditMouseUp(object sender, MouseButtonEventArgs e)
         {
-            ((IInputElement) sender).ReleaseMouseCapture();
             ProfileEditorService.UpdateSelectedProfileElement();
 
             _isDragging = false;
             _draggingHorizontally = false;
             _draggingVertically = false;
 
+            ((IInputElement) sender).ReleaseMouseCapture();
             e.Handled = true;
         }
 
@@ -82,7 +98,9 @@ namespace Artemis.UI.Screens.Module.ProfileEditor.Visualization.Tools
                 return;
 
             var position = GetRelativePosition(sender, e);
-            layer.LayerShape.SetFromUnscaledAnchor(new SKPoint((float) position.X, (float) position.Y), ProfileEditorService.CurrentTime);
+            var x = (float) (position.X + _dragOffsetX);
+            var y = (float) (position.Y + _dragOffsetY);
+            layer.LayerShape.SetFromUnscaledAnchor(new SKPoint(x, y), ProfileEditorService.CurrentTime);
             ProfileEditorService.UpdateProfilePreview();
         }
 
@@ -136,8 +154,7 @@ namespace Artemis.UI.Screens.Module.ProfileEditor.Visualization.Tools
                 skRect.Left = (float) Math.Min(position.X, skRect.Bottom);
             }
 
-            layer.LayerShape.SetFromUnscaledRectangle(skRect, ProfileEditorService.CurrentTime);
-            ProfileEditorService.UpdateProfilePreview();
+            ApplyShapeResize(skRect);
         }
 
         public void TopCenterResize(object sender, MouseEventArgs e)
@@ -149,8 +166,7 @@ namespace Artemis.UI.Screens.Module.ProfileEditor.Visualization.Tools
 
             var skRect = layer.LayerShape.GetUnscaledRectangle();
             skRect.Top = (float) Math.Min(position.Y, skRect.Bottom);
-            layer.LayerShape.SetFromUnscaledRectangle(skRect, ProfileEditorService.CurrentTime);
-            ProfileEditorService.UpdateProfilePreview();
+            ApplyShapeResize(skRect);
         }
 
         public void TopRightRotate(object sender, MouseEventArgs e)
@@ -175,8 +191,7 @@ namespace Artemis.UI.Screens.Module.ProfileEditor.Visualization.Tools
                 skRect.Right = (float) Math.Max(position.X, skRect.Left);
             }
 
-            layer.LayerShape.SetFromUnscaledRectangle(skRect, ProfileEditorService.CurrentTime);
-            ProfileEditorService.UpdateProfilePreview();
+            ApplyShapeResize(skRect);
         }
 
         public void CenterRightResize(object sender, MouseEventArgs e)
@@ -188,14 +203,7 @@ namespace Artemis.UI.Screens.Module.ProfileEditor.Visualization.Tools
 
             var skRect = layer.LayerShape.GetUnscaledRectangle();
             skRect.Right = (float) Math.Max(position.X, skRect.Left);
-            layer.LayerShape.SetFromUnscaledRectangle(skRect, ProfileEditorService.CurrentTime);
-            ProfileEditorService.UpdateProfilePreview();
-        }
-
-        private Point GetRelativePosition(object sender, MouseEventArgs mouseEventArgs)
-        {
-            var parent = VisualTreeHelper.GetParent((DependencyObject) sender);
-            return mouseEventArgs.GetPosition((IInputElement) parent);
+            ApplyShapeResize(skRect);
         }
 
         public void BottomRightRotate(object sender, MouseEventArgs e)
@@ -220,8 +228,7 @@ namespace Artemis.UI.Screens.Module.ProfileEditor.Visualization.Tools
                 skRect.Right = (float) Math.Max(position.X, skRect.Left);
             }
 
-            layer.LayerShape.SetFromUnscaledRectangle(skRect, ProfileEditorService.CurrentTime);
-            ProfileEditorService.UpdateProfilePreview();
+            ApplyShapeResize(skRect);
         }
 
         public void BottomCenterResize(object sender, MouseEventArgs e)
@@ -233,8 +240,7 @@ namespace Artemis.UI.Screens.Module.ProfileEditor.Visualization.Tools
 
             var skRect = layer.LayerShape.GetUnscaledRectangle();
             skRect.Bottom = (float) Math.Max(position.Y, skRect.Top);
-            layer.LayerShape.SetFromUnscaledRectangle(skRect, ProfileEditorService.CurrentTime);
-            ProfileEditorService.UpdateProfilePreview();
+            ApplyShapeResize(skRect);
         }
 
         public void BottomLeftRotate(object sender, MouseEventArgs e)
@@ -259,8 +265,7 @@ namespace Artemis.UI.Screens.Module.ProfileEditor.Visualization.Tools
                 skRect.Left = (float) Math.Min(position.X, skRect.Right);
             }
 
-            layer.LayerShape.SetFromUnscaledRectangle(skRect, ProfileEditorService.CurrentTime);
-            ProfileEditorService.UpdateProfilePreview();
+            ApplyShapeResize(skRect);
         }
 
         public void CenterLeftResize(object sender, MouseEventArgs e)
@@ -272,7 +277,31 @@ namespace Artemis.UI.Screens.Module.ProfileEditor.Visualization.Tools
 
             var skRect = layer.LayerShape.GetUnscaledRectangle();
             skRect.Left = (float) Math.Min(position.X, skRect.Right);
-            layer.LayerShape.SetFromUnscaledRectangle(skRect, ProfileEditorService.CurrentTime);
+            ApplyShapeResize(skRect);
+        }
+
+        private Point GetRelativePosition(object sender, MouseEventArgs mouseEventArgs)
+        {
+            var parent = VisualTreeHelper.GetParent((DependencyObject) sender);
+            return mouseEventArgs.GetPosition((IInputElement) parent);
+        }
+
+        private void ApplyShapeResize(SKRect newRect)
+        {
+            if (!(ProfileEditorService.SelectedProfileElement is Layer layer))
+                return;
+
+            // Store the original position to create an offset for the anchor
+            var original = layer.PositionProperty.CurrentValue;
+            layer.LayerShape.SetFromUnscaledRectangle(newRect, ProfileEditorService.CurrentTime);
+            var updated = layer.PositionProperty.CurrentValue;
+            // Apply the offset to the anchor so it stays in at same spot
+            layer.AnchorPointProperty.SetCurrentValue(new SKPoint(
+                layer.AnchorPointProperty.CurrentValue.X + (original.X - updated.X),
+                layer.AnchorPointProperty.CurrentValue.Y + (original.Y - updated.Y)
+            ), ProfileEditorService.CurrentTime);
+
+            // Update the preview
             ProfileEditorService.UpdateProfilePreview();
         }
     }