Flat 10% off on the purchase of any two apps or more. Use coupon code - FESTIVAL10
Native Shopify Mobile App with 20 new features
Kickstart your hyperlocal marketplace in Corona pandemic with a starter guide
Android App Development
iOS App Development
Cross Platform App Development
Hire on-demand project developers and turn your idea into working reality.
Big thanks to Webkul and his team for helping get Opencart 220.127.116.11 release ready!
Owner and Founder. Opencart
In Flutter, if you need to create a widget that can be dismissed, you can wrap the widget as the child of Dismissible. Dismissible Widget in flutter is usually used to wrap each list item so that it can be dismissed, either horizontally or vertically. I’m going to give you some examples of how to use the widget, including how to show the confirmation dialog, set backgrounds that will be shown when the child is being dismissed, and set dismiss direction.
A widget that can be dismissed by dragging in the indicated direction. Dragging or flinging this widget in the DismissDirection causes the child to slide out of view.
You must pass the key (Key) and the child (Widget). Since the widget might be deleted from the widget list, key becomes crucial. Make sure each dismissible widget has a different key if there are numerous ones. Avoid using index as a key since dismissing one widget may alter the index of other widgets. The second necessary property is kid, where you must pass a dismissible widget.
The onDismissed property is another crucial one. It’s a callback function that takes one DismissDirection parameter.
For instance, we’re going
The itemBuilder, which is used to build the list items, returns a Dismissible. In addition of the required arguments (key and child), onDismissed callback is also passed. The below example shows you how to set different action for each direction.
Dismissible is often used for delete action. If you think the performed action is crucial and cannot be undone, it’s better to show confirmation before the action defined inside onDismissed is performed. You can do it by passing confirmDismissCallback to the constructor. It’s a callback that accepts one parameter of type DismissDirection and returns Future<bool>. The below example shows an AlertDialog where the user can confirm to delete the item or cancel the action.
The default dismiss direction is horizontal. You can swipe to the right or left. Swiping to left or right may end up in a different action depending on what you define in onDismissed callback. Not only different actions, Flutter allows you to set different widgets that will be shown when the child is being dismissed. Use background to define the widget to be displayed when the child is swiped to the right and secondaryBackground for the widget when the child is swiped to the left. If you only set background, it will be used for both directions.
Below is the Dismissible Widget In Flutter code that you can copy if you want to try the code in this tutorial. This includes the confirmation modal and different backgrounds for each direction.
Here’s the list of properties of Dismissible you can pass to the constructor.
const Duration(milliseconds: 300)
Map<DismissDirection, double> dismissThresholds
const <DismissDirection, double>
const Duration(milliseconds: 200)
That’s all for this Article 🎊 .
We learned about the Dismissible Widget in Flutter in this blog.
Visit the link for additional information on the Dismissible Widget in Flutter.
Thanks for reading this blog. You can also check other blogs from here for more knowledge.
Your email address will not be published. Required fields are marked*
Save my name email and website in this browser for the next time I comment.
Be the first to comment.
Great Product, Great Team, and Great Support Service. And if you want to add more features to the product, they can submit any idea that comes to your mind. They really care about their clients and we are really happy and honored to deal with Webkul.
Enquiry or Requirement
If you have more details or questions, you can reply to the received confirmation email.