user9047282
user9047282

Reputation:

Disable dismiss direction on Dismissible Widget

I am writing an app to save your shopping list. Those item should be dismissable for editing the content or deleting the items. If another content is already in the textfield to be edited, then the swipe of a specific direction should be disabled. For now my Dismissible is looking like this.

    Dismissible(
    background: Container(
      alignment: Alignment.centerLeft,
      padding: EdgeInsets.only(left: 20.0),
      color: Colors.redAccent,
      child: Icon(Icons.delete, color: Colors.white),
    ),
    secondaryBackground: Container(
      alignment: Alignment.centerRight,
      padding: EdgeInsets.only(right: 20.0),
      color: Colors.orangeAccent,
      child: Icon(Icons.edit, color: Colors.white),
    ),
    child: Text("This is my dismissible widget"),
    onDismissed: (direction){
      if(direction == DismissDirection.startToEnd){
        Scaffold.of(context).showSnackBar(SnackBar(content: Text("Swipe to right")));
      } else if(direction == DismissDirection.endToStart){
        Scaffold.of(context).showSnackBar(SnackBar(content: Text("Swipe to right")));
      }
    },
  )

SOLUTION:

Add dismiss directions like this

    Dismissible(
    background: Container(
      alignment: Alignment.centerLeft,
      padding: EdgeInsets.only(left: 20.0),
      color: Colors.redAccent,
      child: Icon(Icons.delete, color: Colors.white),
    ),
    secondaryBackground: Container(
      alignment: Alignment.centerRight,
      padding: EdgeInsets.only(right: 20.0),
      color: Colors.orangeAccent,
      child: Icon(Icons.edit, color: Colors.white),
    ),
    child: Text("This is my dismissible widget"),
    /*New*/
    direction: (textController.text.isEmpty
        ? DismissDirection.horizontal
        : DismissDirection.startToEnd
    ),
    /*New*/
    onDismissed: (direction){
      if(direction == DismissDirection.startToEnd){
        Scaffold.of(context).showSnackBar(SnackBar(content: Text("Swipe to right")));
      } else if(direction == DismissDirection.endToStart){
        Scaffold.of(context).showSnackBar(SnackBar(content: Text("Swipe to right")));
      }
    },
  )

Upvotes: 11

Views: 15613

Answers (3)

pprgva
pprgva

Reputation: 21

You change on : onDismissed: (DismissDirection direction)

In lambda:

onDismissed: (DismissDirection direction){

if(direction = DismissDirection.startToEnd) 
ect ....
}

Upvotes: 0

BambinoUA
BambinoUA

Reputation: 7150

To implement this you need to declare a local variable to manipuilate dismiss direction and set its value depending of your conditions:

// Set required dismiss direction
DismissDirection dismissDirection;
if(OneConditionSatisfies && AnotherConditionSatisfies) {
  dismissDirection = DismissDirection.horizontal; // two side dismission
} else if(OneConditionSatisfies) {
  dismissDirection = DismissDirection.startToEnd; // only this one
} else if(AnotherConditionSatisfies) {
  dismissDirection = DismissDirection.endToStart; // only this one
}

// Return widget from `build` function
return Dismissible(
  ...
  direction: dismissDirection,
  ...
);

Upvotes: 8

Stephen Samonte Tan
Stephen Samonte Tan

Reputation: 342

You can disable the dismiss-able action on a list item by populating the list with an a TextItem rather than a Dismissable with a TextItem.

return new ListView(
     children: snapshot.data.documents.map((document) {
       // Convert snapshot to user item
       MyFBDocuments.ChatMessageItem documentData =
          new MyFBDocuments.ChatMessageItem.fromDocumentSnapshot(
              document);

       // One List Item 
       Widget listItem = new _ChatMessageItem(
           loading: false,
           openedGroupChat: chatInfoDoc.isGroupChat,
           messageDocument: documentData);

       // Determine if dismiss action should be shown 
       if (documentData.senderId == MyAuthentication.authenticatedUser.uid){
         // Create item with dismiss action 
         DismissDirection _dismissDirection = DismissDirection.startToEnd;

         return _DismissableListItem(
           messageDocData: documentData,
           listItem: listItem,
           onRightAction: _handleRightAction,
           onDelete: _handleLeftAction,
           dismissDirection: _dismissDirection,
         );

       } else {
         // display item without dismiss action 
         return listItem;
       }
     }).toList(),
     reverse: true,
     padding: new EdgeInsets.fromLTRB(8.0, 0.0, 8.0, 0.0),
   );

^Code was from CaughtUp: https://www.caughtup-app.com/

Upvotes: 2

Related Questions