Skip to content

Instantly share code, notes, and snippets.

@bharathraj-e
Created April 12, 2023 18:26
Show Gist options
  • Save bharathraj-e/df5fe84008daa86ae3b4801201b0ff91 to your computer and use it in GitHub Desktop.
Save bharathraj-e/df5fe84008daa86ae3b4801201b0ff91 to your computer and use it in GitHub Desktop.
Kanban board / jira borad basic ui in flutter
Scaffold(
appBar: AppBar(
title: const Text('Jira Board'),
),
body: Column(
children: [
Expanded(
child: Row(
children: [
Expanded(
child: DragTarget<int>(
builder: (BuildContext context, List<dynamic> incoming, List<dynamic> rejected) {
return Container(
decoration: BoxDecoration(
color: incoming.isEmpty ? Colors.grey[200] : Colors.grey[300],
border: Border.all(color: Colors.grey),
),
child: Column(
children: [
Container(
padding: const EdgeInsets.all(10),
child: const Text(
'To Do',
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 20,
),
),
),
Expanded(
child: ListView.builder(
itemBuilder: (BuildContext context, int index) {
int task = c1[index];
return Draggable(
feedback: Material(
child: Container(
padding: const EdgeInsets.all(10),
margin: const EdgeInsets.all(5),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(5),
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.5),
spreadRadius: 1,
blurRadius: 3,
offset: const Offset(0, 1),
),
],
),
child: Text('Task $task'),
),
),
childWhenDragging: Container(),
data: task,
child: Container(
padding: const EdgeInsets.all(10),
margin: const EdgeInsets.all(5),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(5),
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.5),
spreadRadius: 1,
blurRadius: 3,
offset: const Offset(0, 1),
),
],
),
child: Text('Task $task'),
),
);
},
itemCount: c1.length,
),
),
],
),
);
},
onWillAccept: (data) {
return data != 1;
},
onAccept: (data) {
print(data);
setState(() {
if (!c1.contains(data)) {
c1.add(data);
}
c2.remove(data);
});
},
),
),
Expanded(
child: DragTarget<int>(
builder: (BuildContext context, List<dynamic> incoming, List<dynamic> rejected) {
return Container(
decoration: BoxDecoration(
color: incoming.isEmpty ? Colors.grey[200] : Colors.grey[300],
border: Border.all(color: Colors.grey),
),
child: Column(
children: [
Container(
padding: const EdgeInsets.all(10),
child: const Text(
'To Do',
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 20,
),
),
),
Expanded(
child: ListView.builder(
itemBuilder: (BuildContext context, int index) {
int task = c2[index];
return Draggable(
feedback: Container(
padding: const EdgeInsets.all(10),
margin: const EdgeInsets.all(5),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(5),
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.5),
spreadRadius: 1,
blurRadius: 3,
offset: const Offset(0, 1),
),
],
),
child: Text('Task $task'),
),
childWhenDragging: Container(),
data: task,
child: Container(
padding: const EdgeInsets.all(10),
margin: const EdgeInsets.all(5),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(5),
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.5),
spreadRadius: 1,
blurRadius: 3,
offset: const Offset(0, 1),
),
],
),
child: Text('Task $task'),
),
);
},
itemCount: c2.length,
),
),
],
),
);
},
onWillAccept: (data) {
return true;
},
onAccept: (data) {
print(data);
setState(() {
if (!c2.contains(data)) {
c2.add(data);
}
c1.remove(data);
});
},
),
),
],
),
),
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment