jushutch / swiping_card_deck

A widget for swiping through a deck of cards with gestures or buttons.
https://pub.dev/packages/swiping_card_deck
BSD 3-Clause "New" or "Revised" License
13 stars 10 forks source link

Cards spinning around center #40

Open Laurin-G opened 1 year ago

Laurin-G commented 1 year ago

Unexpected behavior :x:

Swiped cards dont move sideways but instead spin around their center when swiped, if the SizedBox of the Card has a width very close to the screen width. For example: width: MediaQuery.of(context).size.width * 1.0, or width: MediaQuery.of(context).size.width * 0.99,

Expected behavior :heavy_check_mark:

I expected the card to still move left and right while being rotated.

Reproducing :computer_mouse:

  1. Execute flutter run on the code sample
  2. Swipe the cards.
Code sample ```dart import 'package:flutter/material.dart'; import 'package:swiping_card_deck/swiping_card_deck.dart'; import 'dart:math' as math; void main() { runApp(const MaterialApp( home: Scaffold( body: Center( child: ExamplePage(), )), title: 'SwipingCardDeck', )); } class ExamplePage extends StatelessWidget { const ExamplePage({Key? key}) : super(key: key); @override Widget build(BuildContext context) { print("Deck width: ${MediaQuery.of(context).size.width}"); final SwipingCardDeck deck = SwipingCardDeck( cardDeck: getCardDeck(context), onDeckEmpty: () => debugPrint("Card deck empty"), onLeftSwipe: (Card card) => debugPrint("Swiped left!"), onRightSwipe: (Card card) => debugPrint("Swiped right!"), cardWidth: MediaQuery.of(context).size.width * 0.99, //Exception when using *1.0 swipeThreshold: MediaQuery.of(context).size.width / 3, minimumVelocity: 1000, rotationFactor: 0.8 / 3.14, swipeAnimationDuration: const Duration(milliseconds: 500), disableDragging: false, ); return Column( mainAxisSize: MainAxisSize.min, mainAxisAlignment: MainAxisAlignment.center, children: [ deck, Row( mainAxisAlignment: MainAxisAlignment.spaceEvenly, mainAxisSize: MainAxisSize.min, children: [ IconButton( icon: const Icon(Icons.clear), iconSize: 30, color: Colors.red, onPressed: deck.animationActive ? null : () => deck.swipeLeft(), ), const SizedBox(width: 40), IconButton( icon: const Icon(Icons.check), iconSize: 30, color: Colors.green, onPressed: deck.animationActive ? null : () => deck.swipeRight(), ), ], ), ], ); } List getCardDeck(BuildContext context) { List cardDeck = []; print("Card width: ${MediaQuery.of(context).size.width}"); for (int i = 0; i < 500; ++i) { cardDeck.add( Card( color: Color((math.Random().nextDouble() * 0xFFFFFF).toInt()) .withOpacity(1.0), child: SizedBox( height: MediaQuery.of(context).size.height * 0.7, // CHANGE HERE width: MediaQuery.of(context).size.width * 0.99, //Full width cards )), ); } return cardDeck; } } ```

Notes This is likely the second problem from #31

Possibly related: When the SwipingCardDecks cardWidth parameter is MediaQuery.of(context).size.width, a "Offset argument contained a NaN value." assertion from flutter fails.

Versions used swiping_card_deck: ^1.3.0 Flutter 3.7.7 • channel stable • https://github.com/flutter/flutter.git Framework • revision 2ad6cd72c0 (7 days ago) • 2023-03-08 09:41:59 -0800 Engine • revision 1837b5be5f Tools • Dart 2.19.4 • DevTools 2.20.1
jushutch commented 1 year ago

Hi @Laurin-G, thank you for opening this issue! I appreciate you using the issue template as well, that's a huge help to me! I'll start looking into this now and I don't imagine it will be a complicated fix, so I'm hoping to have a release with this bug fix deployed by the end of the week (3/26). Thank you for your patience, I'll update this thread if I have any questions, feel free to do the same!