Flutter Animation : AnimatedAlign

mobile academy

import 'package:flutter/material.dart';

class AlignAnimation extends StatefulWidget {
  const AlignAnimation({Key? key}) : super(key: key);

  @override
  State<AlignAnimation> createState() => _AlignAnimationState();
}

class _AlignAnimationState extends State<AlignAnimation> {
  Alignment _alignment = Alignment.center;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Center(
        child: Column(
          children: [
            const SizedBox(height: 50,),

            SizedBox(
              width: 500,
              height: 300,
              child: AnimatedAlign(
                alignment: _alignment, 
                duration: const Duration(milliseconds: 800),
                curve: Curves.bounceOut,
                child: const CircleAvatar(
                  radius: 50,
                  backgroundImage: AssetImage(
                    'assets/user1.jpg'
                  ),
                ),
              ),
            ),

            const SizedBox(height: 8,),

            ElevatedButton(
              onPressed: () {
                setState(() {
                  _alignment = const Alignment(1.0, -1.0);
                });
                
              }, 
              child: const Text('Click Me!'),
            )

          ],
        ),
      ),
    );
  }
}
Select your currency
USD United States (US) dollar