A widget for Flutter that allows you to fade in and out a child widget.
When a widget is faded out it is no longer in the view tree. Meaning that it can't be used or interacted with. Handy for hiding buttons.
Getting started #
In your Flutter project, add the package to your dependencies
dependencies: ... flutter_fader: ^1.0.0
Usage example #
Examples of how to use the widget, and that can also be ran on your device, can be found in the example directory
Import the fader package
Create a fader controller, this allows you to control when the Fader fades in or out
FaderController faderController = new FaderController();
Create a fader widget, and pass it the fader controller
Fader( controller: faderController, duration: const Duration(milliseconds: 50), child: Text("Hello, world!"), )
Now you can fade the child widget in and out at will
[1.0.0+4] - 2019-12-26
- Changed order and date format of changelog
[1.0.0+3] - 2019-12-26
- Spelling mistake in example readme.
- Removed lib/main.dart from example directory
- Update comments in flutter_fader.dart
- Update main readme with better wording and a fixed link
[1.0.0+2] - 2019-12-24
- Added badge to readme
[1.0.0+1] - 2019-12-24
- Updated the examples directory to example, in order to comply with pub standards
[1.0.0] - 2019-12-24
- Created a stand-alone package for my fader widget
- Created tests for the widget
- Created examples that show how to use the widget
Hello and welcome to the examples! #
Here you will find a couple of examples that show some use cases of how to use the flutter fader!
How to Run #
First you'll want to cd into the one the example directories.
cd fader_with_buttons or
Then you'll want to run flutter create (this will generate all the android/iOS goodies you need to run the example on your device. I don't include them in source control for the sake of cleanliness)
flutter create .
Now you can run the example
flutter run or by running from the IDE/editor of your choice!
Overview of examples #
Fader with buttons #
Two buttons, pressing the top one with fade it out, and pressing the bottom one will fade the top one back in
Fader with scroll #
A very long scroll view, and a floating action button. When you scroll down the floating action button will fade out, when you scroll up it'll fade back in.
Use this package as a library
1. Depend on it
Add this to your package's pubspec.yaml file:
dependencies: flutter_fader: ^1.0.0+4
2. Install it
You can install packages from the command line:
$ flutter pub get
Alternatively, your editor might support
flutter pub get.
Check the docs for your editor to learn more.
3. Import it
Now in your Dart code, you can use:
Describes how popular the package is relative to other packages. [more]
Code health derived from static analysis. [more]
Reflects how tidy and up-to-date the package is. [more]
Weighted score of the above. [more]
We analyzed this package on Feb 19, 2020, and provided a score, details, and suggestions below. Analysis was completed with status completed using:
- Dart: 2.7.1
- pana: 0.13.5
- Flutter: 1.12.13+hotfix.7
flutter format to format