Draw circle on wpf canvas according to its RenderTransform

Question

So I was trying to set a scale and translation values to a wpf canvas render transform, and then draw some circles according to this new transformation matrix.

I have the code like this.

Setting the canvas render transform scale and translation properties.

window.canvas.RenderTransform.Value.Scale(xScale, yScale);
window.canvas.RenderTransform.Value.Translate(offsetX, offsetY);

and adding a circle like this.

Ellipse circle = new Ellipse()
{
    Width = 5,
    Height = 5,
    Stroke = Brushes.Red,
    StrokeThickness = 8
};
circle.SetValue(Canvas.LeftProperty, (double) x);
circle.SetValue(Canvas.TopProperty,  (double) y);
window.canvas.Children.Add(circle);

But the canvas doesn't apply the transformation matrix on the circle points, what should I do?

Answer 1

The expression

window.canvas.RenderTransform.Value

returns a copy of the transform matrix, because struct Matrix is a value type, not a reference type. Any operation you perform on the copy is lost.

Use

var matrix = new Matrix();
matrix.Scale(xScale, yScale);
matrix.Translate(offsetX, offsetY);
window.canvas.RenderTransform = new MatrixTransform(matrix);

or just

window.canvas.RenderTransform =
    new MatrixTransform(xScale, 0, 0, yScale, offsetX, offsetY);

In case a MatrixTransform was previously assigned to the RenderTransform property, you may also just set its Matrix value:

var matrix = new Matrix();
matrix.Scale(xScale, yScale);
matrix.Translate(offsetX, offsetY);
((MatrixTransform)window.canvas.RenderTransform).Matrix = matrix;