time_scheduler_table 1.0.0 time_scheduler_table: ^1.0.0 copied to clipboard
A scheduler with the ability to add, delete and update events by clicking on cells.
A time scheduler for Android & IOS where you can create events by clicking on cells, edit (update) and delete the events you have created. You can assign colours to events and if the name of the event is too long, you can see the full name and description by long pressing on the event.
Features #
GIFS
SCREENSHOTS
Getting started #
flutter pub add time_scheduler_table
Usage #
Define a TextEditingController for event add and event update alerts:
TextEditingController textController = TextEditingController();
Create a list of event models with title, column index, row index and color.
The row and column index, specify the index of the elements in the column and row titles (Mon, Tue or 08:00, 09:00). They starts from 0:
List<EventModel> eventList = [
EventModel(
title: "Math",
columnIndex: 0, // columnIndex is columnTitle's index (Monday : 0 or Day 1 : 0)
rowIndex: 2, // rowIndex is rowTitle's index (08:00 : 0 or Time 1 : 0)
color: Colors.orange,
),
EventModel(
title: "History",
columnIndex: 1,
rowIndex: 5,
color: Colors.pink,
),
EventModel(
title: "Guitar & Piano Course",
columnIndex: 4,
rowIndex: 8,
color: Colors.green,
),
EventModel(
title: "Meeting",
columnIndex: 3,
rowIndex: 1,
color: Colors.deepPurple,
),
EventModel(
title: "Guitar and Piano Course",
columnIndex: 2,
rowIndex: 9,
color: Colors.blue,
)
];
Create your Time Scheduler Widget:
TimeSchedulerTable(
cellHeight: 64,
cellWidth: 72,
columnTitles: const [ // You can assign any value to columnTitles. For Example : ['Column 1','Column 2','Column 3', ...]
"Mon",
"Tue",
"Wed",
"Thur",
"Fri",
"Sat",
"Sun"
],
currentColumnTitleIndex: DateTime.now().weekday - 1,
rowTitles: const [ // You can assign any value to rowTitles. For Example : ['Row 1','Row 2','Row 3', ...]
'08:00 - 09:00',
'09:00 - 10:00',
'10:00 - 11:00',
'11:00 - 12:00',
'12:00 - 13:00',
'13:00 - 14:00',
'14:00 - 15:00',
'15:00 - 16:00',
'16:00 - 17:00',
'17:00 - 18:00',
'18:00 - 19:00',
'19:00 - 20:00',
'20:00 - 21:00',
],
title: "Event Schedule",
titleStyle: const TextStyle(
fontSize: 18, fontWeight: FontWeight.bold, color: Colors.black),
eventTitleStyle: const TextStyle(color: Colors.white, fontSize: 8),
isBack: false, // back button
eventList: eventList,
eventAlert: EventAlert(
alertTextController: textController,
borderRadius: const BorderRadius.all(
Radius.circular(12.0),
),
addAlertTitle: "Add Event",
editAlertTitle: "Edit",
addButtonTitle: "ADD",
deleteButtonTitle: "DELETE",
updateButtonTitle: "UPDATE",
hintText: "Event Name",
textFieldEmptyValidateMessage: "Cannot be empty!",
addOnPressed: (event) { // when an event added to your list
// Your code after event added.
},
updateOnPressed: (event) { // when an event updated from your list
// Your code after event updated.
},
deleteOnPressed: (event) { // when an event deleted from your list
// Your code after event deleted.
},
),
),
columnTitles
contain days or values that you define. It is not required.
The default value is :
["Mon", "Tue", "Wed", "Thur", "Fri", "Sat", "Sun"]
You can define it as you want. For Example:
columnTitles: const ["Column 1", "Column 2", "Column 3", ...],
currentColumnTitleIndex: 2,
If you define like this, selected column is 3 if currentColumnTitleIndex
is 2.
rowTitles
contain times or values that you define. It is not required.
The default value is :
[
'06:00 - 07:00',
'07:00 - 08:00',
'08:00 - 09:00',
'09:00 - 10:00',
'10:00 - 11:00',
'11:00 - 12:00',
'12:00 - 13:00',
'13:00 - 14:00',
'14:00 - 15:00',
'15:00 - 16:00',
'16:00 - 17:00',
'17:00 - 18:00',
'18:00 - 19:00',
'19:00 - 20:00',
'20:00 - 21:00',
'21:00 - 22:00',
'22:00 - 23:00',
'23:00 - 00:00',
],
You can define it as you want. For Example:
rowTitles: const ["Row 1", "Row 2", "Row 3", ...],
Thanks to Mesut Demir ☕