CODEWITHSUNDEEP
flutterdartflutter-layout
Abhijith Konnayil
Abhijith Konnayil

Reputation: 4656

Flutter Transform | origin vs alignment

I need to know the difference between the origin and alignment property of the Transform widget. What will happen if we set both origin and alignment? From docs, what I understood is both and setting the origin.

origin

The origin of the coordinate system (relative to the upper left corner of this render object) in which to apply the matrix.

Alignment

The alignment of the origin, relative to the size of the box. This is equivalent to setting an origin based on the size of the box. If it is specified at the same time as the [origin], both are applied.

Upvotes: 1

Views: 1847

Answers (1)

DAVE chintan
DAVE chintan

Reputation: 332

Origin is used to fix X and Y positions.

Center(
  child: Container(
    color: Colors.black,
    child: Transform(
      origin: Offset(20,40) ,
      //alignment: Alignment.center,
      transform: Matrix4.skewY(0.3)..rotateZ(24 / 12.0),
      child: Container(
        padding: const EdgeInsets.all(8.0),
        color: const Color(0xFFE8581C),
        child: const Text('hello'),
      ),
    ),
  ),
),

whereas Alignment shows the specific position like center, left,centerRight, etc.

Upvotes: 1

Related Questions