Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Query: Smooth DismissiblePane Implementation within ActionPane? #476

Open
KiloNovemberDelta opened this issue May 3, 2024 · 0 comments
Open

Comments

@KiloNovemberDelta
Copy link

KiloNovemberDelta commented May 3, 2024

Hello,

Firstly, a huge thank you for this incredible package!

In my application, I have a list of products. I aim for users to validate a product by swiping from left to right, or be able to edit/delete it by swiping from right to left.

However, I'm encountering difficulty implementing just the DismissiblePane for the validation functionality. It seems ActionPane requires children, and therefore, the motion from the user is not smooth to validate the product. When a user swipes, they're initially obstructed by the ActionPaneAction, and only then can they dismiss the tile.

Do you know if it's possible to exclusively employ a DismissiblePane within an ActionPane?
Thank you!

Here is my minimal code :

Slidable(
    key: ValueKey(index),
    groupTag: '0',
    startActionPane: ActionPane(
      motion: const DrawerMotion(),
      dismissible: DismissiblePane(
          key: const ValueKey(0),
          closeOnCancel: true,
          dismissThreshold: 0.8,
          confirmDismiss: () async {
            doSth();
            return false;
          },
          onDismissed: () {
            print("Panel dismiss called");
          }),
      children: [
        SlidableAction(
          onPressed: (_) {}, // I don't want to perform any action here, but the motion do a stop here
          backgroundColor: Colors.green,
          foregroundColor: Colors.white,
          icon: Icons.done,
        ),
      ],
    ),
    endActionPane: ActionPane(
      extentRatio: 0.4,
      motion: const ScrollMotion(),
      children: [
        SlidableAction(
          onPressed: (_) {},
          backgroundColor: Colors.blue,
          foregroundColor: Colors.white,
          icon: Icons.edit,
        ),
        SlidableAction(
          onPressed: (_) {
            product.isVisible = false;
            setState(() {});
            _deleteSelectedItems();
          },
          backgroundColor: Colors.red,
          foregroundColor: Colors.white,
          icon: Icons.delete,
        ),
      ],
    ),
    child: ChildProduct(product),
  );
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant