How To Use Transform Widget Using Flutter Android App

admin_img Posted By Bajarangi soft , Posted On 30-10-2020

This is extremely useful for custom shapes and many different kinds of animations in Flutter. This can be used to transform any widget and distort it to any shape we like or move it around as well.The Transform widget gives us a few constructors to help simplify the creation of transformations. Common operations such as scaling, rotation or translation are all provided via constructors.

How To Use Transform Widget Using Flutter Android App

Transform Widget
Complete Code For Transform Widget In Flutter 
Main.dart

import 'dart:math';
import 'package:flutter/material.dart';

void main() {
  runApp(new MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Transform',
      home: new BasicTransform(),
    );
  }
}

class BasicTransform extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.black54,
      appBar: AppBar(
        backgroundColor: Colors.lightGreen,
          title: Text("Transform Widget"
          )),
      body: Center(
        child: Container(
          color: Colors.lightGreen[100],
          child: Transform(
            alignment: Alignment.topRight,
            transform: Matrix4.skewY(0.3)..rotateZ(-pi / 12.0),
            child: Container(
              padding: const EdgeInsets.all(15.0),
              color: Colors.lightGreen,
              child: const Text('BajarangiSoft.com!',
                  style: TextStyle(fontSize: 20.0,color: Colors.white)),
            ),
          ),
        ),
      ),
    );
  }
}

Related Post