Rostyk
Rostyk

Reputation: 1159

How to check whether a user swiped left or right(dismissible) flutter

I use the dismissible widget in Flutter.
I know that ondismiss() can give us a piece of information about where a user swiped left or right but the information is given only after an element is dismissed from the screen. Can I detect whether a user is going to swipe it left or right? Perhaps, I can check if a background is visible, I'm talking about the background and second background

Upvotes: 1

Views: 1207

Answers (1)

Ankit Mahadik
Ankit Mahadik

Reputation: 2445

You can use confirmDismiss to perform any logic before dismiss and you have to return true or false value if you return true than element will be removed and perform action in onDismissed.

Dismissible(
          key: ValueKey(id),
          background: Container(
            color: Theme.of(context).errorColor,
            child: Icon(
              Icons.delete,
              color: Colors.white,
              size: 40,
            ),
            alignment: Alignment.centerRight,
            padding: EdgeInsets.only(right: 20),
            margin: EdgeInsets.symmetric(
              horizontal: 15,
              vertical: 4,
            ),
          ),
          direction: DismissDirection.endToStart,
          confirmDismiss: (direction) {
            return showDialog(
              context: context,
              builder: (ctx) => AlertDialog(
                    title: Text('Are you sure?'),
                    content: Text(
                      'Do you want to remove the item from the cart?',
                    ),
                    actions: <Widget>[
                      FlatButton(
                        child: Text('No'),
                        onPressed: () {
                          Navigator.of(ctx).pop(false);
                        },
                      ),
                      FlatButton(
                        child: Text('Yes'),
                        onPressed: () {
                          Navigator.of(ctx).pop(true);
                        },
                      ),
                    ],
                  ),
            );
          },
          onDismissed: (direction) {
            Provider.of<Cart>(context, listen: false).removeItem(productId);
          },
          child: Card(
            margin: EdgeInsets.symmetric(
              horizontal: 15,
              vertical: 4,
            ),
            child: Padding(
              padding: EdgeInsets.all(8),
              child: ListTile(
                leading: CircleAvatar(
                  child: Padding(
                    padding: EdgeInsets.all(5),
                    child: FittedBox(
                      child: Text('\$$price'),
                    ),
                  ),
                ),
                title: Text(title),
                subtitle: Text('Total: \$${(price * quantity)}'),
                trailing: Text('$quantity x'),
              ),
            ),
          ),
        );

Upvotes: 1

Related Questions