Hey everyone today we are going to talk about Matrix4 in a flutter. I have seen many people who want to make attractive websites and mobile applications but they have no idea. Even though most of these people have not even tried and just copy and paste the code from somewhere. Firstly, I was also doing the same thing, but once I started learning by myself I went deep into that thing and learned that gratefully. Well, we are going to learn a few things about matrix4 today.

So we are going to create a basic example with an explanation of Matrix4, classes of matrix4, and methods of matrix4.

What is Matrix4?

So as we all know matrix4 is nothing but a 4 X 4 matrix which is also known as a 4D matrix. The most common use of a matrix4 in 3D computer graphics is as a transformation matrix-like translation, rotation or scaling applied to any components.

So now let's talk about factory constructors in Matrix4... Let's first have a look at factory constructors.

What is Factory Constructor?

In a factory constructor, a Factory is just a method referred to as a creational designs pattern which provides an interface for creating objects in a superclass but allows subclasses to alter the type of objects that will be created.

There are some advantages of that like improving the quality of code and improving performance by caching.

Types of factory constructors in Matrix4

• Matrix4.zero
• Matrix4.identity
• Matrix4.rotate
• Matrix4.translation

Matrix4.zero

Matrix4.zero matrix is simply a zero matrix which contains all the values zero.

Matrix4.identity

Matrix. identity is nothing but a matrix which gets the same number as an original value. No matter which matrix is multiplied if it gives us the same number is known as a matrix. identity.

Implementation

```Matrix4.identity() => Matrix4.zero()..setIdentity();

![Identity-matrix-examples.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1650870242667/XxgUMQeu3.png)

**Matrix.rotate**

Matrix. rotate helps us to give rotation to our components with x,y, and z-direction.

The implementation for this is as below.


```Transform(
          transform: Matrix4.identity()
            ..rotateX(x)
            ..rotateY(y)
            ..rotateZ(z),
          child: GestureDetector(
              onPanUpdate: (details) {
                setState(() {
                  y = y - details.delta.dx / 100;
                  x = x - details.delta.dy / 100;
                });
              },
              child: Container(
                color: Colors.red,
                height: 200,
                width: 200,
              ),),
        ),

Matrix4.translation

Matrix4.translation is a type when the cursor is moved from one location to another location without changing its behaviour is known as translation.

Implementation

setState(() { _position = dragDetails.position; double newX = _position.dx; double newY = _position.dy; final Matrix4 newMatrix = Matrix4.identity() ..translate(newX, -newY) }, ),

Hey! you just learn matrix stuff in a short manner.

This is very basic, we can do many more things. Look through this Documentation to know what else you can do.

Conclusion

This article is not only for flutter developers. The aim of the article was if you are interested in graphic designing things So this article will be useful for you. it's just like other skills, the more you will practice the better you'll get at it.

if you reach till the end, thanks for reading and let me know your feedback in the comment section. Follow Jatin Tolwani on hashnode

Social Links:

• Twitter: J3_tolwani
• LinkedIn: Jatin Tolwani
• Instagram: j3_tolwani