change(package): complety remove the unswipe feature
This commit is contained in:
Ricardo Dalarme
parent
fb292ee1ec
commit
c5f220488e
25
README.md
25
README.md
|
|
@ -10,29 +10,21 @@ We build this package because we wanted to:
|
|||
|
||||
- have a complete customizable slider
|
||||
- be able to swipe in every direction
|
||||
- trigger unswipe however we want
|
||||
- choose our own settings for the swiper such as duration, angle, padding..
|
||||
- NEW: trigger swipe, swipe left and swipe right however we want
|
||||
- NEW: add functions while un-/swiping, on end or when the swiper is disabled
|
||||
- NEW: detect the direction (left, right, top, bottom) in which the card was swiped away
|
||||
- NEW: unswipe all cards
|
||||
|
||||
## ❗NEW Features ❗
|
||||
|
||||
### Trigger swipe left and swipe right through controller
|
||||
You can now trigger swipe left and swipe right with our ```CardSwiperController``` regardless of the chosen ```AppinioSwipeDirection``` (which is still used when ```swipe``` is called through the controller). Just like the unswipe and swipe call, you can call ```swipeLeft``` or ```swipeRight``` through the controller anywhere you want.
|
||||
|
||||
### Unswipe all cards
|
||||
You can now unswipe as many cards as possible. If you set the parameter ```unlimitedUnswipe```to ```true``` (default value: ```false```) the limit of 1 card is extended to the number of cards that have been swiped away. The way to call ```unswipe``` hasn't changed.
|
||||
You can now trigger swipe left and swipe right with our ```CardSwiperController``` regardless of the chosen ```AppinioSwipeDirection``` (which is still used when ```swipe``` is called through the controller). You can call ```swipeLeft``` or ```swipeRight``` through the controller anywhere you want.
|
||||
|
||||
### Detect direction of swipe
|
||||
We've added the direction in which the card was swiped away to the function ```onSwipe```. The ```AppinioSwipeDirection``` gets now returned when the function gets called.
|
||||
|
||||
### Sending Feedback when widget is unswiped
|
||||
We've added the function ```unswipe``` that now gets returned with the boolean ```true``` when the last card is unswiped and with boolean ```false``` when there is no last card to unswipe.
|
||||
|
||||
### Trigger swipe through controller
|
||||
You can now trigger the swipe with our ```CardSwiperController```. Just like the unswipe call, you can call the ```swipe``` trough the controller anywhere you want. Just make sure to pass the controller to the parameter ```controller``` from our ```CardSwiper```.
|
||||
You can now trigger the swipe with our ```CardSwiperController```. You can call the ```swipe``` trough the controller anywhere you want. Just make sure to pass the controller to the parameter ```controller``` from our ```CardSwiper```.
|
||||
|
||||
## Show Cases
|
||||
|
||||
|
|
@ -42,10 +34,6 @@ Trigger swipe right and swipe left however you want...
|
|||
|
||||
<img src="https://github.com/appinioGmbH/flutter_packages/blob/main/assets/swiper/swipe_left_right.gif?raw=true" height="250" />
|
||||
|
||||
Unswipe the cards however you want...
|
||||
|
||||
<img src="https://github.com/appinioGmbH/flutter_packages/blob/main/assets/swiper/unswipe.gif?raw=true" height="250" />
|
||||
|
||||
Customize the angle...
|
||||
|
||||
<img src="https://github.com/appinioGmbH/flutter_packages/blob/main/assets/swiper/angle.gif?raw=true" height="250" />
|
||||
|
|
@ -129,7 +117,7 @@ class Example extends StatelessWidget {
|
|||
| Parameter | Default | Description | Required |
|
||||
| ------------- |:-------------|:-----|:-----:|
|
||||
| cards | - | List of Widgets for the swiper | true
|
||||
| controller | - | Trigger unswipe | false
|
||||
| controller | - | Trigger swipe | false
|
||||
| padding | EdgeInsets.symmetric(horizontal: 20, vertical: 25) | Control swiper padding | false
|
||||
| duration | 200 milliseconds | The duration that every animation should last | false
|
||||
| maxAngle | 30 | Maximum angle the card reaches while swiping | false
|
||||
|
|
@ -139,21 +127,16 @@ class Example extends StatelessWidget {
|
|||
| onSwipe | - | Called with the new index and detected swipe direction when the user swiped | false
|
||||
| onEnd | - | Called when there is no Widget left to be swiped away | false
|
||||
| direction | right | Direction in which the card is swiped away when triggered from the outside | false
|
||||
| allowUnswipe | true | Set to ```false``` if unswipe should be disabled away | false
|
||||
| unlimitedUnswipe | false | Set to ```true``` if the user can unswipe as many cards as possible | false
|
||||
| unswipe | - | Called with the boolean ```true``` when the last card gets unswiped and with the boolean ```false``` if there is no card to unswipe | false
|
||||
|
||||
#### Controller
|
||||
|
||||
The ```Controller``` is used to control the ```swipe```, ```swipeLeft```, ```swipeRight``` or ```unswipe``` function of the swiper from outside of the widget. You can create a controller called ```CardSwiperController``` and save the instance for further usage. Please have a closer look to our Example for the usage.
|
||||
The ```Controller``` is used to control the ```swipe```, ```swipeLeft```, ```swipeRight``` function of the swiper from outside of the widget. You can create a controller called ```CardSwiperController``` and save the instance for further usage. Please have a closer look to our Example for the usage.
|
||||
|
||||
| Method | Description
|
||||
| ------------- |:-------------
|
||||
| swipe | Changes the state of the controller to swipe and swipes the card in your selected direction.
|
||||
| swipeLeft | Changes the state of the controller to swipe left and swipes the card to the left side.
|
||||
| swipeRight | Changes the state of the controller to swipe right and swipes the card to the right side.
|
||||
| unswipe | Changes the state of the controller to unswipe and brings back the last card that was swiped away.
|
||||
|
||||
|
||||
<hr/>
|
||||
Made with ❤ by Flutter team at <a href="https://appinio.com">Appinio GmbH</a>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import 'package:flutter_card_swiper/card_swiper.dart';
|
||||
import 'package:flutter/cupertino.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_card_swiper/card_swiper.dart';
|
||||
|
||||
class ExampleButton extends StatelessWidget {
|
||||
final Function onTap;
|
||||
|
|
@ -78,20 +78,3 @@ Widget swipeLeftButton(CardSwiperController controller) {
|
|||
),
|
||||
);
|
||||
}
|
||||
|
||||
//unswipe card
|
||||
Widget unswipeButton(CardSwiperController controller) {
|
||||
return ExampleButton(
|
||||
onTap: () => controller.unswipe(),
|
||||
child: Container(
|
||||
height: 60,
|
||||
width: 60,
|
||||
alignment: Alignment.center,
|
||||
child: const Icon(
|
||||
Icons.rotate_left_rounded,
|
||||
color: CupertinoColors.systemGrey2,
|
||||
size: 40,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
import 'dart:developer';
|
||||
|
||||
import 'package:flutter_card_swiper/card_swiper.dart';
|
||||
import 'package:example/example_candidate_model.dart';
|
||||
import 'package:example/example_card.dart';
|
||||
import 'package:flutter/cupertino.dart';
|
||||
import 'package:flutter_card_swiper/card_swiper.dart';
|
||||
|
||||
import 'example_buttons.dart';
|
||||
|
||||
|
|
@ -66,9 +66,7 @@ class _ExamplePageState extends State<Example> {
|
|||
SizedBox(
|
||||
height: MediaQuery.of(context).size.height * 0.75,
|
||||
child: CardSwiper(
|
||||
unlimitedUnswipe: true,
|
||||
controller: controller,
|
||||
unswipe: _unswipe,
|
||||
cards: cards,
|
||||
onSwipe: _swipe,
|
||||
padding: const EdgeInsets.only(
|
||||
|
|
@ -82,18 +80,11 @@ class _ExamplePageState extends State<Example> {
|
|||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
const SizedBox(
|
||||
width: 80,
|
||||
),
|
||||
swipeLeftButton(controller),
|
||||
const SizedBox(
|
||||
width: 20,
|
||||
),
|
||||
swipeRightButton(controller),
|
||||
const SizedBox(
|
||||
width: 20,
|
||||
),
|
||||
unswipeButton(controller),
|
||||
],
|
||||
)
|
||||
],
|
||||
|
|
@ -104,12 +95,4 @@ class _ExamplePageState extends State<Example> {
|
|||
void _swipe(int index, CardSwiperDirection direction) {
|
||||
log("the card was swiped to the: " + direction.name);
|
||||
}
|
||||
|
||||
void _unswipe(bool unswiped) {
|
||||
if (unswiped) {
|
||||
log("SUCCESS: card was unswiped");
|
||||
} else {
|
||||
log("FAIL: no card left to unswipe");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ class CardSwiper extends StatefulWidget {
|
|||
/// list of widgets for the swiper
|
||||
final List<Widget?>? cards;
|
||||
|
||||
/// controller to trigger unswipe action
|
||||
/// controller to trigger actions
|
||||
final CardSwiperController? controller;
|
||||
|
||||
/// duration of every animation
|
||||
|
|
@ -24,12 +24,6 @@ class CardSwiper extends StatefulWidget {
|
|||
/// set to true if swiping should be disabled, exception: triggered from the outside
|
||||
final bool isDisabled;
|
||||
|
||||
/// set to false if unswipe should be disabled
|
||||
final bool allowUnswipe;
|
||||
|
||||
/// set to true if the user can unswipe as many cards as possible
|
||||
final bool unlimitedUnswipe;
|
||||
|
||||
/// function that gets called with the new index and detected swipe direction when the user swiped or swipe is triggered by controller
|
||||
final Function onSwipe;
|
||||
|
||||
|
|
@ -39,9 +33,6 @@ class CardSwiper extends StatefulWidget {
|
|||
/// function that gets triggered when the swiper is disabled
|
||||
final Function onTapDisabled;
|
||||
|
||||
/// function that gets called with the boolean true when the last card gets unswiped and with the boolean false when there is no card to unswipe
|
||||
final Function unswipe;
|
||||
|
||||
/// direction in which the card gets swiped when triggered by controller, default set to right
|
||||
final CardSwiperDirection direction;
|
||||
|
||||
|
|
@ -54,12 +45,9 @@ class CardSwiper extends StatefulWidget {
|
|||
this.maxAngle = 30,
|
||||
this.threshold = 50,
|
||||
this.isDisabled = false,
|
||||
this.allowUnswipe = true,
|
||||
this.unlimitedUnswipe = false,
|
||||
this.onTapDisabled = emptyFunction,
|
||||
this.onSwipe = emptyFunctionIndex,
|
||||
this.onEnd = emptyFunction,
|
||||
this.unswipe = emptyFunctionBool,
|
||||
this.direction = CardSwiperDirection.right,
|
||||
}) : assert(maxAngle >= 0 && maxAngle <= 360),
|
||||
assert(threshold >= 1 && threshold <= 100),
|
||||
|
|
@ -82,7 +70,7 @@ class _CardSwiperState extends State<CardSwiper>
|
|||
|
||||
int _currentIndex = 0;
|
||||
|
||||
int _swipeTyp = 0; // 1 = swipe, 2 = unswipe, 3 = goBack
|
||||
int _swipeTyp = 0; // 1 = swipe, 3 = goBack
|
||||
bool _tapOnTop = false; //position of starting drag point on card
|
||||
|
||||
late AnimationController _animationController;
|
||||
|
|
@ -90,18 +78,7 @@ class _CardSwiperState extends State<CardSwiper>
|
|||
late Animation<double> _topAnimation;
|
||||
late Animation<double> _scaleAnimation;
|
||||
late Animation<double> _differenceAnimation;
|
||||
late Animation<double> _unSwipeLeftAnimation;
|
||||
late Animation<double> _unSwipeTopAnimation;
|
||||
|
||||
bool _vertical = false;
|
||||
bool _horizontal = false;
|
||||
bool _isUnswiping = false;
|
||||
int _swipedDirectionVertical = 0; //-1 left, 1 right
|
||||
int _swipedDirectionHorizontal = 0; //-1 bottom, 1 top
|
||||
|
||||
AppinioUnswipeCard? _lastCard;
|
||||
// ignore: prefer_final_fields
|
||||
List<AppinioUnswipeCard?> _lastCards = [];
|
||||
CardSwiperDirection detectedDirection = CardSwiperDirection.none;
|
||||
|
||||
bool get _isLastCard => _currentIndex == widget.cards!.length - 1;
|
||||
|
|
@ -156,26 +133,6 @@ class _CardSwiperState extends State<CardSwiper>
|
|||
_animationController.forward();
|
||||
}
|
||||
}
|
||||
})
|
||||
//unswipe widget from the outside
|
||||
..addListener(() {
|
||||
if (widget.controller!.state == CardSwiperState.unswipe) {
|
||||
if (widget.allowUnswipe) {
|
||||
if (!_isUnswiping) {
|
||||
if (_lastCard != null || _lastCards.isNotEmpty) {
|
||||
if (widget.unlimitedUnswipe) {
|
||||
_unswipe(_lastCards.last!);
|
||||
} else {
|
||||
_unswipe(_lastCard!);
|
||||
}
|
||||
widget.unswipe(true);
|
||||
_animationController.forward();
|
||||
} else {
|
||||
widget.unswipe(false);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -189,14 +146,8 @@ class _CardSwiperState extends State<CardSwiper>
|
|||
//when value of controller changes
|
||||
if (_animationController.status == AnimationStatus.forward) {
|
||||
setState(() {
|
||||
if (_swipeTyp != 2) {
|
||||
_left = _leftAnimation.value;
|
||||
_top = _topAnimation.value;
|
||||
}
|
||||
if (_swipeTyp == 2) {
|
||||
_left = _unSwipeLeftAnimation.value;
|
||||
_top = _unSwipeTopAnimation.value;
|
||||
}
|
||||
_scale = _scaleAnimation.value;
|
||||
_difference = _differenceAnimation.value;
|
||||
});
|
||||
|
|
@ -208,30 +159,6 @@ class _CardSwiperState extends State<CardSwiper>
|
|||
if (status == AnimationStatus.completed) {
|
||||
setState(() {
|
||||
if (_swipeTyp == 1) {
|
||||
if (widget.unlimitedUnswipe) {
|
||||
_lastCards.add(
|
||||
AppinioUnswipeCard(
|
||||
widget: widget.cards!.last!,
|
||||
horizontal: _horizontal,
|
||||
vertical: _vertical,
|
||||
swipedDirectionHorizontal: _swipedDirectionHorizontal,
|
||||
swipedDirectionVertical: _swipedDirectionVertical,
|
||||
),
|
||||
);
|
||||
} else {
|
||||
_lastCard = AppinioUnswipeCard(
|
||||
widget: widget.cards!.last!,
|
||||
horizontal: _horizontal,
|
||||
vertical: _vertical,
|
||||
swipedDirectionHorizontal: _swipedDirectionHorizontal,
|
||||
swipedDirectionVertical: _swipedDirectionVertical,
|
||||
);
|
||||
}
|
||||
_swipedDirectionHorizontal = 0;
|
||||
_swipedDirectionVertical = 0;
|
||||
_vertical = false;
|
||||
_horizontal = false;
|
||||
|
||||
widget.onSwipe(_currentIndex, detectedDirection);
|
||||
|
||||
if (_isLastCard) {
|
||||
|
|
@ -240,13 +167,6 @@ class _CardSwiperState extends State<CardSwiper>
|
|||
} else {
|
||||
_currentIndex++;
|
||||
}
|
||||
} else if (_swipeTyp == 2) {
|
||||
if (widget.unlimitedUnswipe) {
|
||||
_lastCards.removeLast();
|
||||
} else {
|
||||
_lastCard = null;
|
||||
}
|
||||
_isUnswiping = false;
|
||||
}
|
||||
_animationController.reset();
|
||||
_left = 0;
|
||||
|
|
@ -417,14 +337,10 @@ class _CardSwiperState extends State<CardSwiper>
|
|||
});
|
||||
if (_left > widget.threshold ||
|
||||
_left == 0 && widget.direction == CardSwiperDirection.right) {
|
||||
_swipedDirectionHorizontal = 1;
|
||||
detectedDirection = CardSwiperDirection.right;
|
||||
} else {
|
||||
_swipedDirectionHorizontal = -1;
|
||||
detectedDirection = CardSwiperDirection.left;
|
||||
}
|
||||
(_top <= 0) ? _swipedDirectionVertical = 1 : _swipedDirectionVertical = -1;
|
||||
_horizontal = true;
|
||||
}
|
||||
|
||||
//moves the card away to the top or bottom
|
||||
|
|
@ -456,16 +372,10 @@ class _CardSwiperState extends State<CardSwiper>
|
|||
});
|
||||
if (_top > widget.threshold ||
|
||||
_top == 0 && widget.direction == CardSwiperDirection.bottom) {
|
||||
_swipedDirectionVertical = -1;
|
||||
detectedDirection = CardSwiperDirection.bottom;
|
||||
} else {
|
||||
_swipedDirectionVertical = 1;
|
||||
detectedDirection = CardSwiperDirection.top;
|
||||
}
|
||||
(_left >= 0)
|
||||
? _swipedDirectionHorizontal = 1
|
||||
: _swipedDirectionHorizontal = -1;
|
||||
_vertical = true;
|
||||
}
|
||||
|
||||
//moves the card back to starting position
|
||||
|
|
@ -490,69 +400,13 @@ class _CardSwiperState extends State<CardSwiper>
|
|||
).animate(_animationController);
|
||||
});
|
||||
}
|
||||
|
||||
//unswipe the card: brings back the last card that was swiped away
|
||||
void _unswipe(AppinioUnswipeCard card) {
|
||||
_isUnswiping = true;
|
||||
widget.cards!.add(card.widget);
|
||||
_swipeTyp = 2;
|
||||
//unSwipe horizontal
|
||||
if (card.horizontal == true) {
|
||||
_unSwipeLeftAnimation = Tween<double>(
|
||||
begin: (card.swipedDirectionHorizontal == 1)
|
||||
? MediaQuery.of(context).size.width
|
||||
: -MediaQuery.of(context).size.width,
|
||||
end: 0,
|
||||
).animate(_animationController);
|
||||
_unSwipeTopAnimation = Tween<double>(
|
||||
begin: (card.swipedDirectionVertical == 1)
|
||||
? -MediaQuery.of(context).size.height / 4
|
||||
: MediaQuery.of(context).size.height / 4,
|
||||
end: 0,
|
||||
).animate(_animationController);
|
||||
_scaleAnimation = Tween<double>(
|
||||
begin: 1.0,
|
||||
end: _scale,
|
||||
).animate(_animationController);
|
||||
_differenceAnimation = Tween<double>(
|
||||
begin: 0,
|
||||
end: _difference,
|
||||
).animate(_animationController);
|
||||
}
|
||||
//unSwipe vertical
|
||||
if (card.vertical == true) {
|
||||
_unSwipeLeftAnimation = Tween<double>(
|
||||
begin: (card.swipedDirectionHorizontal == 1)
|
||||
? MediaQuery.of(context).size.width / 4
|
||||
: -MediaQuery.of(context).size.width / 4,
|
||||
end: 0,
|
||||
).animate(_animationController);
|
||||
_unSwipeTopAnimation = Tween<double>(
|
||||
begin: (card.swipedDirectionVertical == 1)
|
||||
? -MediaQuery.of(context).size.height
|
||||
: MediaQuery.of(context).size.height,
|
||||
end: 0,
|
||||
).animate(_animationController);
|
||||
_scaleAnimation = Tween<double>(
|
||||
begin: 1.0,
|
||||
end: _scale,
|
||||
).animate(_animationController);
|
||||
_differenceAnimation = Tween<double>(
|
||||
begin: 0,
|
||||
end: _difference,
|
||||
).animate(_animationController);
|
||||
}
|
||||
|
||||
setState(() {});
|
||||
}
|
||||
}
|
||||
|
||||
//for null safety
|
||||
void emptyFunction() {}
|
||||
void emptyFunctionIndex(int index, CardSwiperDirection direction) {}
|
||||
void emptyFunctionBool(bool unswiped) {}
|
||||
|
||||
//to call the swipe or unswipe function from outside of the appinio swiper
|
||||
//to call the swipe function from outside of the appinio swiper
|
||||
class CardSwiperController extends ChangeNotifier {
|
||||
CardSwiperState? state;
|
||||
|
||||
|
|
@ -573,30 +427,8 @@ class CardSwiperController extends ChangeNotifier {
|
|||
state = CardSwiperState.swipeRight;
|
||||
notifyListeners();
|
||||
}
|
||||
|
||||
//calls unswipe the card by changing the status of the controller
|
||||
void unswipe() {
|
||||
state = CardSwiperState.unswipe;
|
||||
notifyListeners();
|
||||
}
|
||||
}
|
||||
|
||||
class AppinioUnswipeCard {
|
||||
Widget widget;
|
||||
bool horizontal;
|
||||
bool vertical;
|
||||
int swipedDirectionHorizontal;
|
||||
int swipedDirectionVertical;
|
||||
|
||||
AppinioUnswipeCard({
|
||||
required this.widget,
|
||||
required this.horizontal,
|
||||
required this.vertical,
|
||||
required this.swipedDirectionHorizontal,
|
||||
required this.swipedDirectionVertical,
|
||||
});
|
||||
}
|
||||
|
||||
enum CardSwiperState { swipe, swipeLeft, swipeRight, unswipe }
|
||||
enum CardSwiperState { swipe, swipeLeft, swipeRight }
|
||||
|
||||
enum CardSwiperDirection { none, left, right, top, bottom }
|
||||
|
|
|
|||
Loading…
Reference in New Issue