Skip to content

Commit

Permalink
Merge branch 'doc'
Browse files Browse the repository at this point in the history
  • Loading branch information
@GeekAbdelouahed
GeekAbdelouahed committed Oct 29, 2021
2 parents 87871a7 + 28028de commit fae4bb6
Show file tree
Hide file tree
Showing 17 changed files with 141 additions and 321 deletions.
92 changes: 52 additions & 40 deletions CHANGELOG.md
View file
Original file line number Diff line number Diff line change
@@ -1,78 +1,90 @@
## 0.0.1
## 2.0.0

* Describe initial release.
* Change `FlutterReactionButton` to `ReactionButton`
* Change `FlutterReactionButtonCheck` to `ReactionButtonToggle`
* Change `Function(Reaction, int, bool) onReactionChanged` to `Function(T?, bool) onReactionChanged`
* Change `Function(Reaction, int) onReactionChanged` to `Function(T?) onReactionChanged`
* Dynamic scale depending on the hover position
* Dynamic horizontal alignment
* Scrollable position
* Minor bugs fixed

## 0.1.0
## 1.0.8

* Update Description pubspec.yaml.
* Added support null safety

## 0.1.1
## 1.0.7+3

* Reactions List @required.
* Deprecated Reaction id

## 0.1.2
## 1.0.7+2

* From plugin to packages.
* Improvement box flow

## 0.1.2+1
## 1.0.7

* Add Example.
* Remove reaction id
* Clean code

## 0.1.3
## 1.0.6+2

* Selected rection index.
* Minor bugs fixed

## 1.0.0
## 1.0.6+1

* Add ripple effect.
* Minor bugs fixed

## 1.0.1
## 1.0.6

* define reaction by id.
* alternative to popup menu.
* enable/disable reaction click.
* Reaction title

## 1.0.2
## 1.0.5

* Items spacing
* Box padding

## 1.0.4

* code improvements
* Reactions box alignment

## 1.0.3

* change state externally
* Change state externally

## 1.0.4
## 1.0.2

* reactions box alignment
* Code improvements

## 1.0.5
## 1.0.1

* items spacing / box padding
* Define reaction by id.
* Alternative to popup menu.
* Enable/disable reaction click.

## 1.0.6
## 1.0.0

* reaction title
* Add ripple effect.

## 1.0.6+1
## 0.1.3

* minor bugs fixed
* Selected rection index.

## 1.0.6+2
## 0.1.2+1

* minor bugs fixed
* Add Example.

## 1.0.7
## 0.1.2

* Remove reaction id
* Clean code
* From plugin to packages.

## 1.0.7+2
## 0.1.1

* Improvement box flow
* Reactions List @required.

## 1.0.7+3
## 0.1.0

* Deprecated Reaction id
* Update Description pubspec.yaml.

## 1.0.8
## 0.0.1

* Added support null safety
* Describe initial release.
166 changes: 21 additions & 145 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,12 @@ Flutter button reaction it is fully customizable widget such as Facebook reactio

## Preview

<img src="https://github.com/GeekAbdelouahed/flutter-reaction-button/raw/master/images/Preview.png"/>
<img src="https://github.com/GeekAbdelouahed/flutter-reaction-button/raw/doc/images/Preview.png"/>


## Demo

<img src="https://github.com/GeekAbdelouahed/flutter-reaction-button/raw/doc/images/preview.gif"/>

## Usage

Expand All @@ -27,151 +32,22 @@ Next, import 'flutter_reaction_button.dart' into your dart code.
import 'package:flutter_reaction_button/flutter_reaction_button.dart';
```

## Examples

# flutter_reaction_button
## 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 | Position of reactions box according to the button | Position.TOP |
| 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 | Shold 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) |

This is example Flutter Reaction Button Check:

<img src="https://github.com/GeekAbdelouahed/flutter-reaction-button/raw/master/images/Flutter-Reaction-Button-Check.gif"/>

```dart
FlutterReactionButtonCheck(
onReactionChanged: (reaction, index, isChecked) {
print('reaction selected index: $index');
},
reactions: <Reaction>[
Reaction(
previewIcon: buildWidgetPreview(
icon: 'like.gif',
),
icon: buildWidget(
icon: 'like_fill.png'
),
),
Reaction(
previewIcon: buildWidgetPreview(
icon: 'love.gif',
),
icon: buildWidget(
icon: 'love.png'
),
),
Reaction(
previewIcon: buildWidgetPreview(
icon: 'wow.gif',
),
icon: buildWidget(
icon: 'wow.png'
),
),
Reaction(
previewIcon: buildWidgetPreview(
icon: 'haha.gif',
),
icon: buildWidget(
icon: 'haha.png'
),
),
Reaction(
previewIcon: buildWidgetPreview(
icon: 'sad.gif',
),
icon: buildWidget(
icon: 'sad.png'
),
),
Reaction(
previewIcon: buildWidgetPreview(
icon: 'angry.gif',
),
icon: buildWidget(
icon: 'angry.png'
),
),
],
initialReaction: Reaction(
icon: buildWidget(
icon: 'like.png'
),
),
selectedReaction: Reaction(
icon: buildWidget(
icon: 'like_fill.png'
),
),
)
```



This is a example Flutter Reaction Button:

<img src="https://github.com/GeekAbdelouahed/flutter-reaction-button/raw/master/images/Flutter-Reaction-Button.gif"/>

```dart
FlutterReactionButton(
onReactionChanged: (reaction, index) {
print('reaction selected index: $index');
},
reactions: <Reaction>[
Reaction(
previewIcon: buildWidgetPreview(
title: 'English',
icon: 'united-kingdom-round.png',
),
icon: buildWidget(
icon: 'united-kingdom.png'
),
),
Reaction(
previewIcon: buildWidgetPreview(
title: 'Arabic',
icon: 'algeria-round.png',
),
icon: buildWidget(
icon: 'algeria.png'
),
),
Reaction(
previewIcon: buildWidgetPreview(
title: 'German',
icon: 'germany-round.png',
),
icon: buildWidget(
icon: 'germany.png'
),
),
Reaction(
previewIcon: buildWidgetPreview(
title: 'Spanish',
icon: 'spain-round.png',
),
icon: buildWidget(
icon: 'spain.png'
),
),
Reaction(
previewIcon: buildWidgetPreview(
title: 'Chinese',
icon: 'china-round.png',
),
icon: buildWidget(
icon: 'china.png'
),
),
],
initialReaction: Reaction(
previewIcon: buildWidgetPreview(
title: 'English',
icon: 'united-kingdom-round.png',
),
icon: buildWidget(
icon: 'united-kingdom.png'
),
),
)
```

## LICENSE

Expand Down
Loading

0 comments on commit fae4bb6

Please sign in to comment.