dependencies:
flutter:
sdk: flutter
flutter_slidable: ^0.6.0
Slidable(
actionPane: SlidableDrawerActionPane(),
actionExtentRatio: 0.25,
child: Container(
color: [Link],
child: ListTile(
leading: CircleAvatar(
backgroundColor: [Link],
child: Text('$3'),
foregroundColor: [Link],
),
title: Text('Tile n°$3'),
subtitle: Text('SlidableDrawerDelegate'),
),
),
actions: <Widget>[
IconSlideAction(
caption: 'Archive',
color: [Link],
icon: [Link],
onTap: () => _showSnackBar('Archive'),
),
IconSlideAction(
caption: 'Share',
color: [Link],
icon: [Link],
onTap: () => _showSnackBar('Share'),
),
],
secondaryActions: <Widget>[
IconSlideAction(
caption: 'More',
color: Colors.black45,
icon: Icons.more_horiz,
onTap: () => _showSnackBar('More'),
),
IconSlideAction(
caption: 'Delete',
color: [Link],
icon: [Link],
onTap: () => _showSnackBar('Delete'),
),
],
);
import 'package:flutter/[Link]';
import 'package:flutter_slidable/flutter_slidable.dart';
void main() {
runApp(
MaterialApp(
home: MyApp(),
);
class MyApp extends StatefulWidget{
@override
_MyAppState createState() => _MyAppState();
class _MyAppState extends State<MyApp> {
List<Person> persons= [];
@override
void initState() {
//adding item to list, you can add using json from network
[Link](Person(id:"1", name:"Hari Prasad Chaudhary", phone:"9812122233",
address:"Kathmandu, Nepal"));
[Link](Person(id:"2", name:"Krishna Karki", phone:"9812122244", address:"Pokhara, Nepal"));
[Link](Person(id:"3", name:"Ujjwal Joshi", phone:"98121224444", address:"Bangalore, India"));
[Link](Person(id:"4", name:"Samir Hussain Khan", phone:"9812122255", address:"Karachi,
Pakistan"));
[Link]();
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title:Text("Slide And Delete List"),
backgroundColor: [Link],
),
body: SingleChildScrollView(
child: Container(
padding: [Link](10),
child: Column(
children: [Link]((personone){
return Slidable( //enable slidable in list
key: Key([Link]), //set key
// you have to set key, other wise, after removing item from list, -
// - slidable will be opened.
actionPane: SlidableDrawerActionPane(),
actionExtentRatio: 0.15,
actions: [ //action button to show in head
ElevatedButton(
child: Icon([Link]),
onPressed: (){
//action for phone call
},
),
//add more action buttons here
],
child: Card(
child:ListTile(
title: Text([Link]),
subtitle: Text([Link] + "\n" + [Link]),
),
),
secondaryActions: [ //action button to show on tail
ElevatedButton(
style: [Link](
primary: [Link]
),
child: Icon([Link]),
onPressed: (){
//delete action for this button
[Link]((element){
return [Link] == [Link];
}); //go through the loop and match content to delete from list
setState(() {
//refresh UI after deleting element from list
});
},
),
//add more action buttons here.
],
);
}).toList(),
),
),
);
class Person{ //modal class for Person object
String id, name, phone, address;
Person({[Link], [Link], [Link], [Link]});