AnimatedPadding Example in Flutter

<p>In this article, I'm going to share an example on AnimatedPadding Widget. Using AnimatedPadding Widget, you can animate the padding of the child widgets for the given duration.</p> <p>Here is how the final output is going to look. ![](https://fluttercentral.com/Uploads/0b67db27-acd5-412a-901b-a6ad1eb9ea0f.gifwidth="50%height="auto](</p> <p>Here is the full code from main.dart file. You can simply copy-paste and run the code to see the output. color: rgb(212, 212, 212); background-color: rgb(30, 30, 30); font-family: Consolas, "Courier New", monospace; font-size: 14px; line-height: 19px; white-space: pre-wrap;](color: #569cd6;](import color: #ce9178;]('package:flutter/material.dart'; color: #569cd6;](void main() => runApp(MyApp()); color: #569cd6;](class MyApp color: #569cd6;](extends StatefulWidget { color: #569cd6;](@override _MyAppState createState() => _MyAppState();} color: #569cd6;](class _MyAppState color: #569cd6;](extends State { double padValue = color: #b5cea8;](0; color: #569cd6;](@override Widget build(BuildContext context) { color: #569cd6;](return MaterialApp( home: Scaffold( appBar: AppBar( title: Text(color: #ce9178;]("AnimatedPadding"), ), body: Column( children: [ Expanded( child: AnimatedPadding( child: Container( color: Colors.red, ), duration: color: #569cd6;](const Duration(seconds: color: #b5cea8;](1), padding: EdgeInsets.all(padValue), curve: Curves.easeInOut, ), ), Text(color: #ce9178;]('Padding Value: $padValue'), ButtonBar( alignment: MainAxisAlignment.center, children: [ RaisedButton( child: Text(color: #ce9178;]('Add Padding'), onPressed: () { setState(() { padValue = padValue + color: #b5cea8;](10; }); }, ), RaisedButton( child: Text(color: #ce9178;]('Sub Padding'), onPressed: () { setState(() { color: #569cd6;](if(padValue != color: #b5cea8;](0) { padValue = padValue - color: #b5cea8;](10; } }); }, ) ], )<br /> ], ), ), ); }}</p> <p>Thanks,Srikanth</p>