Skip to content

A Flutter pub package for add a ripple effect on your app

License

Notifications You must be signed in to change notification settings

crushman1/ripple_effect

 
 

Repository files navigation

Pub Package GitHub Actions

ripple_effect

A easy way to achieve a ripple effect on you flutter app.

Usage

First you need to wrap your page/Scaffold with the RipplePage widget, the ripple efect will growth until this widget. Then wrap with the RippleEffect where the animation should begin. When the animation should begin, call the RippleEffect.start method passing you callback method(often navigate to other page).

The RipplePage and RippleEffect widgets need their GlobalKeys respectively to work.

Example

class Stateless extends StatelessWidget {
  final pageKey = RipplePage.createGlobalKey();
  final effectKey = RippleEffect.createGlobalKey();
  
  @override
  Widget build(BuildContext context) {
    return RipplePage(
      child: Scaffold(
        body: Center(),
        floatingActionButton: RippleEffect(
          pageKey: pageKey,
          effectKey: effectKey,
          color: Colors.blue,
          child: FloatingActionButton(
            backgroundColor: Colors.blue,
            onPressed: () =>
                 RippleEffect.start(effectKey, () => toNextPage(context)),
            child: Icon(Icons.arrow_back),
          ),
        )
      ),
    );
  }
}

About

A Flutter pub package for add a ripple effect on your app

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • Dart 100.0%