Lee Casey
Lee Casey

Reputation: 193

DateRangePicker - Grey out unavailable dates

As the title suggests I am using DateRangePicker to add date ranges to an array. If possible I would like to be able to "grey" out already selected dates in the array. Is there anyway to do this?

Upvotes: 0

Views: 446

Answers (2)

Lee Casey
Lee Casey

Reputation: 193

Here is the solution to returning the dates in-between the range in case anyone else needs it.

List<DateTime> getDaysInBetweenIncludingStartEndDate(
    {required DateTime startDateTime, required DateTime endDateTime}) {
  // Converting dates provided to UTC
  // So that all things like DST don't affect subtraction and addition on dates
  DateTime startDateInUTC =
      DateTime.utc(startDateTime.year, startDateTime.month, startDateTime.day);
  DateTime endDateInUTC =
      DateTime.utc(endDateTime.year, endDateTime.month, endDateTime.day);

  // Created a list to hold all dates
  List<DateTime> daysInFormat = [];

  // Starting a loop with the initial value as the Start Date
  // With an increment of 1 day on each loop
  // With condition current value of loop is smaller than or same as end date
  for (DateTime i = startDateInUTC;
      i.isBefore(endDateInUTC) || i.isAtSameMomentAs(endDateInUTC);
      i = i.add(const Duration(days: 1))) {
    // Converting back UTC date to Local date if it was local before
    // Or keeping in UTC format if it was UTC

    if (startDateTime.isUtc) {
      daysInFormat.add(i);
    } else {
      daysInFormat.add(DateTime(i.year, i.month, i.day));
    }
  }
  return daysInFormat;
}

Upvotes: 1

Lautaro urtiaga
Lautaro urtiaga

Reputation: 152

Yes, you can send disabled dates into the component.

Check this sample of the documentation.

For further options, check the whole docs.

Upvotes: 0

Related Questions