Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/Purvik/SwipeTo

SwipeTo is a wrapper for a chat view widget which can be used initiate callback when user horizontally swipe on it.
https://github.com/Purvik/SwipeTo

hactoberfest

Last synced: about 2 months ago
JSON representation

SwipeTo is a wrapper for a chat view widget which can be used initiate callback when user horizontally swipe on it.

Awesome Lists containing this project

README

        

# swipe_to

SwipeTo is a wrapper for a chat view widget which can be used initiate callback when user horizontally swipe on it.

## Getting Started
To use this packages, you just simply need to wrap your child component in `SwipeTo` widget and pass a `VoidCallback` that you can carry forward with your task.

In the `pubspec.yaml` of your flutter project, add the following dependency:

```yaml
dependencies:
...
swipe_to: 1.0.6
```

In your library add the following import:

```dart
import 'package:swipe_to/swipe_to.dart';
```
## Parameter Info
* **``child``** : (@required) `StateLess` or `StateFull` flutter widget.
* **``onRightSwipe``** : callback which will be initiated at the end of right swipe animation. If not passed right swipe will be disabled
* **``onLeftSwipe``** : callback which will be initiated at the end of left swipe animation. If not passed left swipe will be disabled
* **``iconOnRightSwipe``** : IconData that will be displayed on left beneath child widget when swiped right. If not specified default is `Icons.reply`
* **``rightSwipeWidget``** : Widget that will be displayed beneath child widget when swipe right. If `iconOnRightSwipe` is defined this will have no effect.
* **``iconOnLeftSwipe``** : IconData that will be displayed on right beneath child widget when swiped left. If not specified default is `Icons.reply`
* **``leftSwipeWidget``** : Widget that will be displayed beneath child widget when swipe left. If `iconOnLeftSwipe` is defined this will have no effect.
* **``iconSize``** : Double value defining size of displayed icon beneath child widget. If not specified default it will take **26**
* **``iconColor``** : Color value defining color of displayed icon beneath child widget. If not specified `primaryColor` from theme will be taken
* **``offsetDx``** : Double dx value used in ``Offset()`` till which position of child widget will get animated. If not specified **0.3** default will be taken. onRightSwipe +dx value will be used and for onLeftSwipe -dx value will be used
* **``animationDuration``** : Duration value to define animation duration. If not specified default is **150 milliseconds**
* **``swipeSensitivity``** : Swipe sensitivity integer value which will be in range of default min 5 to max 35. Crossing mentioned value of this parameter (+ve in right and -ve in left direction) will trigger swipe animation.

## Major changes onwards [ver 0.0.1+5]
* For a single child widget, we can now enable swipe for both left and right direction
* ``swipeDirection`` parameter is removed. Now ``onLeftSwipe`` and `onRightSwipe` callback will enable swiping for a particular direction if passed
* ``iconData`` is now split into two parameter, ``iconOnRightSwipe`` & ``iconOnLeftSwipe`` for future use
* ``endOffset`` is now change to accept a double value only
* ``callBack`` is now split into two parameter, ``onLeftSwipe`` & ``onRightSwipe``

## Using `SwipeTo` widget for `ListView` items
While using `SwipeTo` widget for `ListView` items, make sure to pass a `Key()` as `key` parameter of `SwipeTo` widget. Suggested to use `UniqueKey()` which will differentiate each individual widget in the Widget Tree. Check example below. To view example code [click here](https://github.com/Purvik/SwipeTo/blob/master/example/lib/list_home.dart).

```dart
ListView(
children: snapshot.data!.map((name) {
return SwipeTo(
key: UniqueKey(),
iconOnLeftSwipe: Icons.arrow_forward,
iconOnRightSwipe: Icons.arrow_back,
onRightSwipe: (details) {
log("\n Left Swipe Data --> $name");
},
swipeSensitivity: 20,
child: ListTile(
tileColor: Colors.cyan.shade200,
title: Text(name),
),
);
}).toList(),
);
```
## Deprecated/Removed Parameters
* **swipeDirection** : Enum value from [``swipeToLeft``, ``swipeToRight``] only. Make sure to pass relative Offset value according to passed ``swipeDirection`` value. If not specified ``swipeToRight`` will be taken as default.
* **iconData** : IconData that will be displayed beneath child widget. if not specified default is `Icons.reply`
* **endOffset** : Offset value till which position of child widget will get animated. if not specified **Offset(0.3, 0.0)** default will be taken
* **callBack** : (@required) callback which will be initiated at the end of swipe animation

**Example** : **SwipeToRight**
Wrap your desired widget with `SwipeTo` & pass a call to `onRightSwipe` parameter.
```dart
SwipeTo(
child: Container(
padding: const EdgeInsets.symmetric(vertical: 10.0, horizontal: 8.0),
child: Text('Hey You! Swipe me right 👉🏿'),
),
onRightSwipe: (details) {
print('Callback from Swipe To Right');
},
),
```
**Example** : **SwipeToLeft**
Wrap your desired widget with `SwipeTo` & pass a call to `onLeftSwipe` parameter.
```dart
SwipeTo(
child: Container(
padding: const EdgeInsets.symmetric(vertical: 10.0, horizontal: 8.0),
child: Text('👈🏿 Hey You! Swipe me Left'),
),
onLeftSwipe: (details) {
print('Callback from Swipe To Left');
},
),
```

**Example** : **SwipeToLeft & SwipeToRight**
Wrap your desired widget with `SwipeTo` & pass a call to `onLeftSwipe` & `onRightSwipe` parameters.
```dart
SwipeTo(
child: Container(
padding: const EdgeInsets.symmetric(vertical: 10.0, horizontal: 8.0),
child: Text('👈🏿 Swipe me Left | YOU |Swipe me right 👉🏿'),
),
onLeftSwipe: (details) {
print('Callback from Swipe To Left');
},
onRightSwipe: (details) {
print('Callback from Swipe To Right');
},
),
```
## Sample Outputs



## References to learn
https://medium.com/@purvik1239/enable-swiping-right-left-for-your-flutter-application-widgets-a7b556674f9c