Flutter Animation : AnimatedOpacity

mobile academy

import 'dart:math';

import 'package:flutter/material.dart';

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

  @override
  State<OpacityAnimation> createState() => _OpacityAnimationState();
}

class _OpacityAnimationState extends State<OpacityAnimation> {
  double _opacity = 0.1;
  final Random _random = Random();

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

            AnimatedOpacity(
              opacity: _opacity, 
              duration: const Duration(milliseconds: 800),
              curve: Curves.linearToEaseOut,
              child: const CircleAvatar(
                radius: 50,
                backgroundImage: AssetImage(
                  'assets/user1.jpg'
                ),
              ),
            ),

            const SizedBox(height: 8,),

            ElevatedButton(
              onPressed: () {
                setState(() {
                 _opacity = _random.nextDouble() * 0.9;
                });
                
              }, 
              child: const Text('Click Me!'),
            )

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