diff --git a/README.md b/README.md index 63ea34c..1689432 100644 --- a/README.md +++ b/README.md @@ -27,25 +27,6 @@ Next, import 'flutter_reaction_button.dart' into your dart code. import 'package:flutter_reaction_button/flutter_reaction_button.dart'; ``` -## Parameters -| parameter | description | default | -| -------------------------- | ------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| OnReactionChanged | triggered when reaction button value change || -| reactions | reactions appear in reactions box when long pressed on ReactionnButtonToggle or click on ReactionButton || -| initialReaction | Default reaction button widget | first item in reactions list | -| boxPosition | Vertical position of reactions box relative to the button | VerticalPosition.TOP | -| boxHorizontalPosition | Horizontal position of reactions box relative to the button | HorizontalPosition.START | -| boxOffset | Offset to reposition the box from the computed place | Offset.zero | -| boxColor | Reactions box color | Colors.white | -| boxElevation | Reactions box elevation | 5 | -| boxRadius | Reactions box radius | 50 | -| boxPadding | Reactions box padding | const EdgeInsets.all(0) | -| boxDuration | Reactions box show/hide duration | 200 milliseconds | -| shouldChangeReaction | Should change initial reaction after selected one or not | true | -| itemScale | Scale ratio when item hovered | 0.3 | -| itemScaleDuration | Scale duration while dragging | const Duration(milliseconds: 100) | - - ## LICENSE ```legal diff --git a/example/README.md b/example/README.md index d2eb2a9..30e8a55 100644 --- a/example/README.md +++ b/example/README.md @@ -1,21 +1,19 @@ # flutter_reaction_button_example -ReactionButtonToggle: +ReactionButton: ```dart -ReactionButtonToggle( - onReactionChanged: (String? value, bool isChecked) { - debugPrint('Selected value: $value, isChecked: $isChecked'); +ReactionButton( + onReactionChanged: (Reaction? reaction) { + debugPrint('Selected value: ${reaction?.value}'); }, reactions: >[ Reaction( value: 'like', - previewIcon: widget, icon: widget, ), Reaction( value: 'love', - previewIcon: widget, icon: widget, ), ... @@ -35,28 +33,25 @@ ReactionButtonToggle( ReactionButton: ```dart -ReactionButton( + toggle: false, + onReactionChanged: (Reaction? reaction) { + debugPrint('Selected language: ${reaction?.value}'); }, reactions: >[ Reaction( value: 'en', - previewIcon: widget, icon: widget, ), Reaction( value: 'ar', - previewIcon: widget, icon: widget, ), ... ], initialReaction: Reaction( value: null, - icon: Icon( - Icons.language, - ), + icon: Icon(Icons.language), ), ) ``` \ No newline at end of file diff --git a/example/lib/image.dart b/example/lib/image.dart index 0febd50..8665b99 100644 --- a/example/lib/image.dart +++ b/example/lib/image.dart @@ -16,7 +16,7 @@ class ImageWidget extends StatefulWidget { } class _ImageWidgetState extends State { - String? _selectedReaction; + Reaction? _selectedReaction; @override Widget build(BuildContext context) { @@ -39,7 +39,7 @@ class _ImageWidgetState extends State { ), ), child: ReactionButton( - onReactionChanged: (String? value) { + onReactionChanged: (Reaction? value) { setState(() { _selectedReaction = value; }); diff --git a/example/lib/main.dart b/example/lib/main.dart index 7f49616..f079d9b 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -31,10 +31,11 @@ class MyApp extends StatelessWidget { dimension: 30, child: ReactionButton( toggle: false, - onReactionChanged: (String? value) { + onReactionChanged: (Reaction? reaction) { ScaffoldMessenger.of(context).showSnackBar( SnackBar( - content: Text('Selected language: $value'), + content: + Text('Selected language: ${reaction?.value}'), ), ); }, diff --git a/example/lib/post.dart b/example/lib/post.dart index 0132ee3..63ad8f7 100644 --- a/example/lib/post.dart +++ b/example/lib/post.dart @@ -41,8 +41,8 @@ class PostWidget extends StatelessWidget { children: [ ReactionButton( itemSize: const Size.square(40), - onReactionChanged: (String? value) { - debugPrint('Selected value: $value'); + onReactionChanged: (Reaction? reaction) { + debugPrint('Selected value: ${reaction?.value}'); }, reactions: reactions, placeholder: data.defaultInitialReaction, diff --git a/lib/src/widgets/reaction_button.dart b/lib/src/widgets/reaction_button.dart index 6e42fcf..15d2401 100644 --- a/lib/src/widgets/reaction_button.dart +++ b/lib/src/widgets/reaction_button.dart @@ -26,11 +26,12 @@ class ReactionButton extends StatefulWidget { this.boxPadding = const EdgeInsets.all(4), this.boxAnimationDuration = const Duration(milliseconds: 200), this.itemAnimationDuration = const Duration(milliseconds: 100), + this.hoverDuration = const Duration(milliseconds: 400), this.child, }) : _type = child != null ? ReactionType.container : ReactionType.button; /// This triggers when reaction button value changed. - final ValueChanged onReactionChanged; + final ValueChanged?> onReactionChanged; /// Default widget when [isChecked == false] final Reaction? placeholder; @@ -79,6 +80,8 @@ class ReactionButton extends StatefulWidget { final Widget? child; + final Duration hoverDuration; + final ReactionType _type; @override @@ -99,10 +102,18 @@ class _ReactionButtonState extends State> { bool get _isContainer => widget._type == ReactionType.container; + void _updateReaction(Reaction? reaction) { + _isChecked = reaction != widget.placeholder; + widget.onReactionChanged.call(reaction); + setState(() { + _selectedReaction = reaction; + }); + } + void _onHover(Offset offset) { _hoverTimer?.cancel(); _hoverTimer = Timer( - const Duration(milliseconds: 400), + widget.hoverDuration, () { _onShowReactionsBox(offset); }, @@ -151,14 +162,6 @@ class _ReactionButtonState extends State> { Overlay.of(context).insert(_overlayEntry!); } - void _updateReaction(Reaction? reaction) { - _isChecked = reaction != widget.placeholder; - widget.onReactionChanged.call(reaction?.value); - setState(() { - _selectedReaction = reaction; - }); - } - void _disposeOverlayEntry() { _overlayEntry ?..remove()