Containers can also be used to provide interesting visual effects on a widget. Let’s showcase adding transforms.

A transform can be applied to mathematically change the appearance of a widget within a Container. We can tilt or skew with syntax like:

Container(child: const Text('Hello World'), transform: Matrix4.skewX(0.3))

We can rotate with:

Container(child: const Text('Hello World'), transform: Matrix4.rotationZ(3.14))

And do all sorts of operations defined in the Matrix4 class as well as additional methods in the Flutter library.

Note that the parameters to these functions tend to be in radians. Without understanding the math, certain parameters will cause unexpected behavior.

Let’s try applying some transformations.


We have an existing Container, try modifying the myTransform variable.


Try something like



Line 4 might look like:
var myTransform = Matrix4.skewX(0.3);

Take this course for free

Mini Info Outline Icon
By signing up for Codecademy, you agree to Codecademy's Terms of Service & Privacy Policy.

Or sign up using:

Already have an account?