Search code examples
flutterdartdatepickerdarkmode

Date picker theme change


I am finding this hard to change the Date picker year in dark theme as it is not visible how to fix this.. Change the color of the year and arrow buttons for dark theme.

This is my code for date picker theme

 datePickerTheme: DatePickerThemeData(
      weekdayStyle: const TextStyle(color: Colors.white),
      headerForegroundColor: Colors.white,
      dayForegroundColor: MaterialStateColor.resolveWith((states) => Colors.white),
      todayForegroundColor: MaterialStateColor.resolveWith((states) => Colors.white),
      backgroundColor: const Color(0xff31343b),
      elevation: .5,
      yearForegroundColor: MaterialStateColor.resolveWith((states) => Colors.white),
    ),

enter image description here

Need to change the Date picker color in dark theme in flutter.


Solution

  • It looks like it might be controlled by the onSurface property of the theme's color scheme. If you don't want to change the onSurface for the entire application you could give the showDatePicker this builder instead:

    builder: (context, child) {
      return Theme(
          data: Theme.of(context).copyWith(
              colorScheme: Theme.of(context)
                  .colorScheme
                  .copyWith(onSurface: Colors.red)), //change to your desired color
          child: child!);
    },
    

    I'm not sure if this totally fixes it but you can try this.