Flutter

Flutter Ripple Animation

This will add a line like this to your package’s pubspec.yaml:

dependencies:
  ripple_animation: ^0.0.1+2

import it in your Dart code, you can use:

import 'package:ripple_animation/ripple_animation.dart';

Now follow the below code for put ripple animation in your App

 Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          backgroundColor: Colors.white,
          title: Text('Ripple Animation',style: TextStyle(color: Colors.black),),
          centerTitle: true,
        ),
        body: Center(
          child: Container(
            width:MediaQuery.of(context).size.width,
            height:MediaQuery.of(context).size.width,
            decoration: BoxDecoration(
                shape: BoxShape.circle,
                color:Colors.red.withOpacity(0.7)
            ),
            child: Center(
              child: RippleAnimation(
                duration: Duration(milliseconds: 2500),
                ripplesCount: 4,
                minRadius: 200,
                repeat: true,
                color: Colors.red,
                child: Container(
                  width: 70,
                  height: 70,
                  decoration: BoxDecoration(
                    color: Colors.white,
                    shape: BoxShape.circle
                  ),
                  child: Icon(Icons.bluetooth),
                ),
              ),
            ),
          ),
        ));
  }

Output :

Ripple Animations

Tagged , , , , ,

Leave a Reply

Your email address will not be published. Required fields are marked *