Event customization

[redfish31]

It would be nice to be able to define the color of the dot for each event individually.

It would be useful to be able to view the types of events directly.

[alvarohurtadobo]

Its already possible using the CalendarsBuilder's singleMarkerBuilder function, you can create a function that assigns a unique color to each event (Refer to the Multi Calendar official example), a fast example is:

int stringToInt(String input) {
  int hash = 0;
  for (int i = 0; i < input.length; i++) {
    hash = (hash * 31 + input.codeUnitAt(i)*32) & 0x7FFFFFFF;
  }
  return hash;
}

Color eventToColor(Event event) {
  final hue = stringToInt(event.title) % 120;
  print("For event $event hue is $hue");
  return HSVColor.fromAHSV(
    1.0, // opacidad
    hue * 1.0,
    0.7, // saturación fija para colores vivos
    0.9, // brillo fijo para buena visibilidad
  ).toColor();
}

Then you add the builder to your Table calendar:

TableCalendar<Event>(
            firstDay: kFirstDay,
            lastDay: kLastDay,
            focusedDay: _focusedDay,
            calendarFormat: _calendarFormat,
            eventLoader: _getEventsForDay,
            calendarBuilders: CalendarBuilders<Event>(
              singleMarkerBuilder: (context, day, event) {
                return Container(
                  width: 10,
                  height: 10,
                  margin: EdgeInsets.all(0),
                  decoration: BoxDecoration(
                    color: eventToColor(event),
                    borderRadius: BorderRadius.all(Radius.circular(5)),
                  ),
                );
              },
            ),
....

And you apply the same function to assign the same color to your widget outside the Calendar, your result will be as follows: