Change button color on showDatePicker

60 views Asked by At

I want to achieve the above design for my showDatePicker.

Right now the button color is white and I want it to be pink.

Is it possible?

Here is what I'm looking for:

enter image description here

Here is my code:

showDatePicker(
      context: context,
      builder: (context, child) {
        return Theme(
          data: ThemeData.light().copyWith(
            colorScheme: const ColorScheme.light(
              primary: Colors.white,
              onPrimary: Colors.black, // header text color
            ),
          ),
          child: child!,
        );
      },
    )
1

There are 1 answers

2
Manish On

You can make it like this to achieve

    Theme(
      data: Theme.of(context).copyWith(
        colorScheme: const ColorScheme.light(
          primary: Colors.pink,
        ),
        datePickerTheme: const DatePickerThemeData(
          headerBackgroundColor: Colors.white,
          backgroundColor: Colors.white,
          headerForegroundColor: Colors.black,
        ),
        textButtonTheme: TextButtonThemeData(
          style: TextButton.styleFrom(foregroundColor: Colors.black),
        ),
      ),
      child: child!,
    );