Flutter - How to place card back in the stack after left swipe

478 Views Asked by At

I am using swipe_stack. It pretty much serves the purpose for me except that I want to place the swiped card back at the bottom of the stack on left swipe. I don't know how to achieve this. Here is the git for this repo: SwipeStack I have imported the repo in my project so I can make changes to it. However, I don't how to achieve it.

                  child: SwipeStack(
                key: dashboardController.swipeKeyFlashDeals,
                padding: const EdgeInsets.only(
                  top: 10,
                  bottom: 20,
                  left: 5,
                  right: 10,
                ),
                children: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10].map((int index) {
                  return SwiperItem(
                      builder: (SwiperPosition position, double progress) {
                    return FlipCard(
                      direction: FlipDirection.HORIZONTAL,
                      speed: 500,
                      onFlipDone: (status) {
                        print(status);
                      },

                      /// FRONT SIDE
                      front: Material(
                        elevation: 4,
                        borderRadius: const BorderRadius.all(Radius.circular(20)),
                        child: Stack(children: [
                ….
                      ]),
            ….
                      ///BACK SIDE
                      back: ClipRRect(
                        borderRadius: BorderRadius.circular(25),
                        child: BackdropFilter(
                          filter: ImageFilter.blur(
                            sigmaX: 75,
                            sigmaY: 75,
                          ),
                          child: …
            ))
                }).toList(),
                visibleCount: 3,
                stackFrom: StackFrom.Right,
                translationInterval: 10,
                scaleInterval: 0.03,
                onEnd: () => debugPrint("onEnd"),
                onSwipe: (int index, SwiperPosition position) {

                  return debugPrint("onSwipe $index $position");
                },
                onRewind: (int index, SwiperPosition position) =>
                    debugPrint("onRewind $index $position"),
              ),
1

There are 1 best solutions below

1
Eduardo Nonemacher On

Have you considered adding a function to the onSwipe property that adds the child you are swiping, back to the first position of the SwipeStack children?

The best way should be to change the implementation of the SwipeStack itself. Instead of removing the child from the children's list add him back to the top of the list. And create a bool keepChildrenOnSwipeLeft to control that.