Flutter Animasi Container

Flutter Animasi Container

pubspec.yaml

nice_button: ^0.1.7

main.dart

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

void main() => runApp(App());

class App extends StatefulWidget {
  _AppState createState() => _AppState();
}

class _AppState extends State<App> {
  Duration _animationDuration = Duration(milliseconds: 1000);
  Color _backgroundColor = Colors.blueGrey;
  double _height = 300;
  double _width = 300;
  double _borderWidth = 300;
  double _borderRadius = 10;
  double _padding = 50;

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        appBar: new AppBar(
          title: Text("Animasi Container"),
        ),
        body: Layout(context),
      ),
    );
  }

  Widget Layout(BuildContext context) {
    return Column(
      children: <Widget>[

        SizedBox(
          height: 50,
        ),

        Center(
          child: AnimatedContainer(
            duration: _animationDuration,
            height: _height,
            width: _width,
            padding: EdgeInsets.all(_padding),
            decoration: BoxDecoration(
              color: _backgroundColor,
              borderRadius: BorderRadius.all(
                Radius.circular(_borderRadius),
              ),
            ),
            child: FlutterLogo(),
          ),
        ),

        SizedBox(
          height: 50,
        ),

        

        Row(
          children: <Widget>[

            NiceButton(
              mini: true,
              icon: Icons.play_arrow,
              background: Colors.blue,
              onPressed: () {
                setState(() {
                  _height = 200;
                  _width = 200;
                  _borderRadius = 30;
                  _padding = 10;
                });
              },
            ),

            NiceButton(
              mini: true,
              icon: Icons.rotate_90_degrees_ccw,
              background: Colors.blueGrey,
              onPressed: () {
                setState(() {
                  _height = 300;
                  _width = 300;
                  _borderRadius = 50;
                  _padding = 100;
                });
              },
            ),

          ],
        ),

      ],
    );
  }
}

Flutter Developer