I have a small task, however, I've been trying to reproduce this in Flutter for 2 days, but can't manage it, unfortunately. Would ask you to help me a little. It should be a table with buttons where you can book as a customer at a certain time, but if someone has already booked something in between, you can only book up to the date or after, see the video. And I'm sorry if this is a bit of an unusual question, however, I'm getting desperate Thank you in advance.
PS: It would be important to mention that the design is not as important as the functionality
You can use the Table widget and ElevatedButton within your Table widget like this:
Table(
border: TableBorder.all(),
columnWidths: const <int, TableColumnWidth>{
0: FixedColumnWidth(96),
1: FixedColumnWidth(96),
2: FixedColumnWidth(96),
3: FixedColumnWidth(96),
4: FixedColumnWidth(96),
},
defaultVerticalAlignment: TableCellVerticalAlignment.middle,
children: <TableRow>[
TableRow(
children: <Widget>[
Container(
height: 64,
color: Colors.grey[200],
),
Container(
height: 64,
color: Colors.grey[200],
),
Container(
height: 64,
color: Colors.grey[200],
),
Container(
height: 64,
color: Colors.grey[200],
),
Container(
height: 64,
color: Colors.grey[200],
),
],
),
TableRow(
decoration: const BoxDecoration(
color: Colors.grey,
),
children: <Widget>[
Container(
height: 64,
color: Colors.grey[200],
),
SizedBox(
height: 64,
child: ElevatedButton(
onPressed: () {},
style: ElevatedButton.styleFrom(
backgroundColor: Colors.orange,
),
child: const Icon(
Icons.check,
color: Colors.white,
),
),
),
SizedBox(
height: 64,
child: ElevatedButton(
onPressed: () {},
style: ElevatedButton.styleFrom(
backgroundColor: Colors.grey[400],
),
child: Icon(
Icons.dangerous,
color: Colors.grey[600],
),
),
),
SizedBox(
height: 64,
child: ElevatedButton(
onPressed: () {},
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
child: Container(),
),
),
SizedBox(
height: 64,
child: ElevatedButton(
onPressed: () {},
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
child: Container(),
),
),
],
),
],
)
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.