WIP on making edit tool compatible with proper translations

This commit is contained in:
SpoinkyNL committed 2020-01-17 00:29:43 +01:00
1 parent 2424bfc7d0
commit d79437b3fd
3 files changed
+292 -113

No files matched your search

@@ -10,119 +10,183 @@
d:DesignWidth="800"
d:DataContext="{d:DesignInstance {x:Type local:EditToolViewModel}}">
<Canvas UseLayoutRounding="False">
<Canvas>
<!-- The rectangle around the shape that allows modification -->
<Canvas.RenderTransform>
<TransformGroup Children="{Binding LayerTransformChildren}" />
</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}" />
<Canvas >
<!-- The part of the layer's shape that is inside the layer -->
<Path Data="{Binding ShapeGeometry, Mode=OneWay}"
Fill="Transparent"
Stroke="{DynamicResource PrimaryHueMidBrush}"
StrokeThickness="1"
StrokeDashArray="2 2"
Cursor="Hand"
MouseDown="{s:Action ShapeEditMouseDown}"
MouseUp="{s:Action ShapeEditMouseUp}"
MouseMove="{s:Action Move}">
</Path>
<!-- 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" />
<!-- Mutation points -->
<Rectangle Width="4" Height="4" Canvas.Left="{Binding TopLeft.X}" Canvas.Top="{Binding TopLeft.Y}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
<Rectangle Width="4" Height="4" Canvas.Left="{Binding TopRight.X}" Canvas.Top="{Binding TopRight.Y}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
<Rectangle Width="4" Height="4" Canvas.Left="{Binding BottomRight.X}" Canvas.Top="{Binding BottomRight.Y}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
<Rectangle Width="4" Height="4" Canvas.Left="{Binding BottomLeft.X}" Canvas.Top="{Binding BottomLeft.Y}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
<Rectangle Width="4" Height="4" Canvas.Left="{Binding TopCenter.X}" Canvas.Top="{Binding TopCenter.Y}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
<Rectangle Width="4" Height="4" Canvas.Left="{Binding RightCenter.X}" Canvas.Top="{Binding RightCenter.Y}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
<Rectangle Width="4" Height="4" Canvas.Left="{Binding BottomCenter.X}" Canvas.Top="{Binding BottomCenter.Y}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
<Rectangle Width="4" Height="4" Canvas.Left="{Binding LeftCenter.X}" Canvas.Top="{Binding LeftCenter.Y}" Fill="{DynamicResource SecondaryAccentBrush}" Margin="-2,-2,0,0" />
<!-- 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 ShapeAnchor.X}" Canvas.Top="{Binding ShapeAnchor.Y}" Margin="-3,-3,0,0"
Cursor="SizeAll" />
</Canvas>
<Canvas>
<Canvas.RenderTransform>
<TransformGroup Children="{Binding ShapeTransformCollection}" />
</Canvas.RenderTransform>
<!-- 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"
Width="15" Height="15"
Canvas.Left="{Binding ShapeRectangle.Left}"
Canvas.Top="{Binding ShapeRectangle.Top}"
Fill="Blue"
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" />
Width="6"
Height="6"
Canvas.Left="{Binding ShapeRectangle.Left}"
Canvas.Top="{Binding ShapeRectangle.Top}"
Fill="Red"
Margin="-3,-3,0,0"
Cursor="SizeNWSE" />
<!-- 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" />
Width="10"
Height="10"
Canvas.Left="{Binding ShapeRectangle.MidX}"
Canvas.Top="{Binding ShapeRectangle.Top}"
Fill="Red"
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"
Width="15"
Height="15"
Canvas.Left="{Binding ShapeRectangle.Right}"
Canvas.Top="{Binding ShapeRectangle.Top}"
Fill="Blue"
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" />
Width="6"
Height="6"
Canvas.Left="{Binding ShapeRectangle.Right}"
Canvas.Top="{Binding ShapeRectangle.Top}"
Fill="Red"
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 -->
<!-- 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" />
Width="10"
Height="10"
Canvas.Left="{Binding ShapeRectangle.Right}"
Canvas.Top="{Binding ShapeRectangle.MidY}"
Fill="Red"
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"
Width="15"
Height="15"
Canvas.Left="{Binding ShapeRectangle.Right}"
Canvas.Top="{Binding ShapeRectangle.Bottom}"
Fill="Blue"
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" />
Width="6"
Height="6"
Canvas.Left="{Binding ShapeRectangle.Right}"
Canvas.Top="{Binding ShapeRectangle.Bottom}"
Fill="Red"
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" />
Width="10"
Height="10"
Canvas.Left="{Binding ShapeRectangle.MidX}"
Canvas.Top="{Binding ShapeRectangle.Bottom}"
Fill="Red"
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"
Width="15"
Height="15"
Canvas.Left="{Binding ShapeRectangle.Left}"
Canvas.Top="{Binding ShapeRectangle.Bottom}"
Fill="Blue"
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" />
Width="6"
Height="6"
Canvas.Left="{Binding ShapeRectangle.Left}"
Canvas.Top="{Binding ShapeRectangle.Bottom}"
Fill="Red"
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" />
</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" />
Width="10"
Height="10"
Canvas.Left="{Binding ShapeRectangle.Left}"
Canvas.Top="{Binding ShapeRectangle.MidY}"
Fill="Red"
Margin="-5,-5,0,0"
Cursor="SizeWE" />
</Canvas>
</Canvas>
</UserControl>
@@ -33,9 +33,10 @@ namespace Artemis.UI.Screens.Module.ProfileEditor.Visualization.Tools
profileEditorService.ProfilePreviewUpdated += (sender, args) => Update();
}
public SKRect ShapeSkRect { get; set; }
public SKPoint AnchorSkPoint { get; set; }
public TransformCollection LayerTransformChildren { get; set; }
public SKRect ShapeRectangle { get; set; }
public SKPoint ShapeAnchor { get; set; }
public RectangleGeometry ShapeGeometry { get; set; }
public TransformCollection ShapeTransformCollection { get; set; }
private void Update()
{
@@ -43,13 +44,41 @@ namespace Artemis.UI.Screens.Module.ProfileEditor.Visualization.Tools
{
if (layer.LayerShape != null)
{
ShapeSkRect = _layerEditorService.GetShapeRenderRect(layer.LayerShape).ToSKRect();
AnchorSkPoint = layer.LayerShape.GetUnscaledAnchor();
Execute.PostToUIThread(() => LayerTransformChildren = _layerEditorService.GetLayerTransformGroup(layer).Children);
ShapeRectangle = _layerEditorService.GetShapeRenderRect(layer.LayerShape).ToSKRect();
ShapeAnchor = _layerEditorService.GetLayerAnchor(layer, true);
Execute.PostToUIThread(() =>
{
var shapeGeometry = new RectangleGeometry(_layerEditorService.GetShapeRenderRect(layer.LayerShape));
shapeGeometry.Transform = _layerEditorService.GetLayerTransformGroup(layer);
shapeGeometry.Freeze();
ShapeGeometry = shapeGeometry;
ShapeTransformCollection = _layerEditorService.GetLayerTransformGroup(layer).Children;
// Get a square path to use for mutation point placement
var path = _layerEditorService.GetLayerPath(layer);
TopLeft = path.Points[0];
TopRight = path.Points[1];
BottomRight = path.Points[2];
BottomLeft = path.Points[3];
TopCenter = new SKPoint((TopLeft.X + TopRight.X) / 2, (TopLeft.Y + TopRight.Y) / 2);
RightCenter = new SKPoint((TopRight.X + BottomRight.X) / 2, (TopRight.Y + BottomRight.Y) / 2);
BottomCenter = new SKPoint((BottomLeft.X + BottomRight.X) / 2, (BottomLeft.Y + BottomRight.Y) / 2);
LeftCenter = new SKPoint((TopLeft.X + BottomLeft.X) / 2, (TopLeft.Y + BottomLeft.Y) / 2);
});
}
}
}
public SKPoint TopLeft { get; set; }
public SKPoint TopRight { get; set; }
public SKPoint BottomRight { get; set; }
public SKPoint BottomLeft { get; set; }
public SKPoint TopCenter { get; set; }
public SKPoint RightCenter { get; set; }
public SKPoint BottomCenter { get; set; }
public SKPoint LeftCenter { get; set; }
public void ShapeEditMouseDown(object sender, MouseButtonEventArgs e)
{
@@ -82,8 +111,8 @@ namespace Artemis.UI.Screens.Module.ProfileEditor.Visualization.Tools
ShapeEditMouseDown(sender, e);
// Override the drag offset
var dragStartPosition = GetRelativePosition(sender, e);
_dragOffsetX = AnchorSkPoint.X - dragStartPosition.X;
_dragOffsetY = AnchorSkPoint.Y - dragStartPosition.Y;
// _dragOffsetX = AnchorSkPoint.X - dragStartPosition.X;
// _dragOffsetY = AnchorSkPoint.Y - dragStartPosition.Y;
_dragStart = dragStartPosition;
}
@@ -117,25 +146,30 @@ namespace Artemis.UI.Screens.Module.ProfileEditor.Visualization.Tools
return;
var position = GetRelativePosition(sender, e);
var skRect = layer.LayerShape.RenderRectangle;
var skRect = _layerEditorService.GetShapeRenderRect(layer.LayerShape).ToSKRect();
var x = (float) (position.X + _dragOffsetX);
var y = (float) (position.Y + _dragOffsetY);
// TODO: Update the translation
// if (!Keyboard.IsKeyDown(Key.LeftShift) && !Keyboard.IsKeyDown(Key.RightShift))
// layer.LayerShape.SetFromUnscaledRectangle(SKRect.Create(x, y, skRect.Width, skRect.Height), ProfileEditorService.CurrentTime);
// else
// {
// if (_draggingVertically)
// layer.LayerShape.SetFromUnscaledRectangle(SKRect.Create(skRect.Left, y, skRect.Width, skRect.Height), ProfileEditorService.CurrentTime);
// else if (_draggingHorizontally)
// layer.LayerShape.SetFromUnscaledRectangle(SKRect.Create(x, skRect.Top, skRect.Width, skRect.Height), ProfileEditorService.CurrentTime);
// else
// {
// _draggingHorizontally = Math.Abs(position.X - _dragStart.X) > Math.Abs(position.Y - _dragStart.Y);
// _draggingVertically = Math.Abs(position.X - _dragStart.X) < Math.Abs(position.Y - _dragStart.Y);
// }
// }
if (Keyboard.IsKeyDown(Key.LeftShift) || Keyboard.IsKeyDown(Key.RightShift))
{
if (_draggingVertically)
x = skRect.Left;
else if (_draggingHorizontally)
y = skRect.Top;
else
{
_draggingHorizontally = Math.Abs(position.X - _dragStart.X) > Math.Abs(position.Y - _dragStart.Y);
_draggingVertically = Math.Abs(position.X - _dragStart.X) < Math.Abs(position.Y - _dragStart.Y);
return;
}
}
// Convert the desired X and Y position to a translation
var layerRect = _layerEditorService.GetLayerRenderRect(layer).ToSKRect();
var translation = layer.PositionProperty.CurrentValue;
var scaled = _layerEditorService.GetScaledPoint(layer, new SKPoint(x , y));
Console.WriteLine(scaled);
layer.PositionProperty.SetCurrentValue(scaled, ProfileEditorService.CurrentTime);
ProfileEditorService.UpdateProfilePreview();
}