I need the code to calculate a 2D transformation matrix from scale, rotation, translate and skew components.
The code should work like this calculator: http://angrytools.com/css-generator/transform, I tried to understand the explantion below, but I am not good with math.
Here a sample code of the converter that I am trying to implement.
public class TransformationMatrix2D
{
public double A { get; set; }
public double B { get; set; }
public double C { get; set; }
public double D { get; set; }
public double TX { get; set; }
public double TY { get; set; }
}
public class TransformationMatrix2DCalculator
{
public (double X, double Y) Translate { get; set; }
public double Rotate { get; set; }
public (double X, double Y) Scale { get; set; }
public double Skew { get; set; }
private const double TransformDegrees = 180 / Math.PI;
public TransformationMatrix2DCalculator(double translateX = 0, double translateY = 0, double rotate = 0, double scaleX = 1, double scaleY = 1, double skew = 0)
{
Translate = (translateX, translateY);
Rotate = rotate;
Scale = (scaleX, scaleY);
Skew = skew;
}
public TransformationMatrix2D Matrix => null; //TODO: to be implemented
}
UPDATE
I found how to apply rotation, translate and scale, but I don't know how to apply skew:
public TransformationMatrix2D GetMatrix()
{
var angle = Rotate / TransformDegrees;
var a = Math.Cos(angle) * Scale.X;
var b = Math.Sin(angle) * Scale.X;
var c = -Math.Sin(angle) * Scale.Y;
var d = Math.Cos(angle) * Scale.Y;
//TODO: complete transformations (skew support is missing)
return new TransformationMatrix2D()
{
A = a,
B = b,
C = c,
D = d,
TX = Translate.X,
TY = Translate.Y
};
}