Skip to content

Instantly share code, notes, and snippets.

@CloudyPadmal
Last active April 22, 2022 12:34
Show Gist options
  • Save CloudyPadmal/4512122c0db5d730aeee6c59f376a2cf to your computer and use it in GitHub Desktop.
Save CloudyPadmal/4512122c0db5d730aeee6c59f376a2cf to your computer and use it in GitHub Desktop.
Dismissible Swipe view for two actions
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Dismissible',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Flutter Dismissible Demo'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
final itemsList = List<String>.generate(10, (n) => "List item ${n}");
ListView generateItemsList() {
return ListView.builder(
itemCount: itemsList.length,
itemBuilder: (context, index) {
return Dismissible(
key: Key(itemsList[index]),
child: InkWell(
onTap: () {
print("${itemsList[index]} clicked");
},
child: ListTile(title: Text('${itemsList[index]}'))),
background: slideRightBackground(),
secondaryBackground: slideLeftBackground(),
confirmDismiss: (direction) async {
if (direction == DismissDirection.endToStart) {
final bool res = await showDialog(
context: context,
builder: (BuildContext context) {
return AlertDialog(
content: Text(
"Are you sure you want to delete ${itemsList[index]}?"),
actions: <Widget>[
FlatButton(
child: Text(
"Cancel",
style: TextStyle(color: Colors.black),
),
onPressed: () {
Navigator.of(context).pop();
},
),
FlatButton(
child: Text(
"Delete",
style: TextStyle(color: Colors.red),
),
onPressed: () {
// TODO: Delete the item from DB etc..
setState(() {
itemsList.removeAt(index);
});
Navigator.of(context).pop();
},
),
],
);
});
return res;
} else {
// TODO: Navigate to edit page;
}
},
);
},
);
}
Widget slideRightBackground() {
return Container(
color: Colors.green,
child: Align(
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
SizedBox(
width: 20,
),
Icon(
Icons.edit,
color: Colors.white,
),
Text(
" Edit",
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.w700,
),
textAlign: TextAlign.left,
),
],
),
alignment: Alignment.centerLeft,
),
);
}
Widget slideLeftBackground() {
return Container(
color: Colors.red,
child: Align(
child: Row(
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
Icon(
Icons.delete,
color: Colors.white,
),
Text(
" Delete",
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.w700,
),
textAlign: TextAlign.right,
),
SizedBox(
width: 20,
),
],
),
alignment: Alignment.centerRight,
),
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: generateItemsList(),
);
}
}
@muhammad-hamza-shahid
Copy link

Hi! while I am using this code the function of confirmDismiss : (direction) on line 42 my VS code says this is not defined, and I have also checked it in my dismissible.dart file there is no definition for confirmDismiss, Can you help me in this situation. Thanks

@CloudyPadmal
Copy link
Author

Hello, according to https://api.flutter.dev/flutter/widgets/Dismissible-class.html, the class still has the confirmDismiss property. I wonder why it's giving any error to you. What kind of an error log are you getting?

@muhammad-hamza-shahid
Copy link

Actually the issue is resolved, I was usind an old version of flutter and at that time this property was not present. Once I updated the issue is resolved.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment