https://github.com/presswink/flutter_touch_ripple_effect
A ripple effect package for Flutter widget
https://github.com/presswink/flutter_touch_ripple_effect
dart dart-package dartlang flutter flutter-package flutter-widget flutterpackage
Last synced: 10 months ago
JSON representation
A ripple effect package for Flutter widget
- Host: GitHub
- URL: https://github.com/presswink/flutter_touch_ripple_effect
- Owner: presswink
- License: apache-2.0
- Created: 2021-01-22T03:57:41.000Z (about 5 years ago)
- Default Branch: main
- Last Pushed: 2025-03-05T06:24:57.000Z (12 months ago)
- Last Synced: 2025-04-08T15:49:43.764Z (11 months ago)
- Topics: dart, dart-package, dartlang, flutter, flutter-package, flutter-widget, flutterpackage
- Language: C
- Homepage:
- Size: 362 KB
- Stars: 4
- Watchers: 2
- Forks: 4
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# touch_ripple_effect
A new flutter package for any flutter widgets to add touch ripple effect and touch feedback.
## find package on [pub.dev](https://pub.dev/packages?q=touch_ripple_effect)
## demo of TouchRippleEffect Widget in search icon Button
## demo of TouchFeedback Widget in Hit me button
## Getting Started
1 ) open pubspec.yaml file in project dir and write [touch_ripple_effect:](https://github.com/Adityapanther/flutter-touch-ripple-effect) at below cupertino_icons.
pubspec.yaml:
```bash
touch_ripple_effect: 2.5.3
```
2 ) open command prompt in project dir and run
Command Line:
```bash
flutter pub get
```
## properties of TouchRippleEffect Widget
| properties | details | default value | required |
|-----------------|----------------------------------------------------------------------------|------------------|----------|
| width | TouchRippleEffect widget width size | null | false |
| height | TouchRippleEffect widget height size | null | false |
| child | child widget in which you want to apply Touch Ripple effect | null | true |
| rippleColor | color that's you want to see as a ripple effect | null | true |
| onTap | Listen onTap or click of child Widget (note: either onTap or onLongPress) | null | false |
| awaitAnimation | Await the animation to complete onTap | true | false |
| rippleDuration | how much time take to display ripple effect | 300 milliseconds | false |
| backgroundColor | background color of TouchRippleEffect | transparent | false |
| borderRadius | border radius of TouchRippleEffect widget | null | false |
| shadow | add shadow to ripple widget | null | false |
| onLongPress | will handle widget long press (note: either onTap or onLongPress) | null | false |
## properties of TouchFeedback Widget
| properties | details | default value | required |
|------------------|-------------------------------------------------------------|------------------|----------|
| child | child widget in which you want to apply Touch Ripple effect | null | true |
| rippleColor | color that's you want to see as a ripple effect | null | true |
| onTap | Listen onTap or click of child Widget | null | false |
| feedbackDuration | how much time take to display ripple effect | 300 milliseconds | false |
| backgroundColor | background color of TouchRippleEffect | transparent | false |
| borderRadius | border radius of TouchRippleEffect widget | null | false |
## Contributor
[@Adityapanther](https://github.com/Adityapanther/)
[@matejhocevar](https://github.com/matejhocevar)