Question

我正在使用showDatePicker显示日历。如何更改按钮颜色以及今天的日期背景颜色

我尝试过在主题数据中设置不同的颜色。但确定，取消和今天的日期仍为蓝色

Theme(data: ThemeData(
      splashColor: Color(0xFFFE9BC0),
    )
    child: myWidget(),
);

Answer 1

我所做的更改datePicker颜色的操作是：

Theme(
  data: ThemeData(primarySwatch: Colors.red),
  child: myWidget(),
);

设置适当的primarySwatch而不是splashColor会更改选择器的所有外观，这是因为色板就像一个调色板。
您可以做的另一件事是，将primarySwatch设置为与您要用作主色的MaterialColor相似的MaterialColor，然后像这样自定义初始色或原色：

Theme(
  data: ThemeData(primarySwatch: Colors.red, splashColor: Colors.green),
  child: myWidget(),
);

希望有帮助！

Answer 2

如果您在 2021 年更改颜色时仍然面临空安全问题..那么这里是简单的解决方案

    Future<void> _selectDate(BuildContext context) async {
DateTime? picked = await showDatePicker(
      context: context,
    builder: (BuildContext context, Widget ?child) {
      return Theme(
        data: ThemeData(
          primarySwatch: Colors.grey,
          splashColor: Colors.black,
          textTheme: TextTheme(
            subtitle1: TextStyle(color: Colors.black),
            button: TextStyle(color: Colors.black),
          ),
          accentColor: Colors.black,
          colorScheme: ColorScheme.light(
              primary: Color(0xffffbc00),
              primaryVariant: Colors.black,
              secondaryVariant: Colors.black,
              onSecondary: Colors.black,
              onPrimary: Colors.white,
              surface: Colors.black,
              onSurface: Colors.black,
              secondary: Colors.black),
              dialogBackgroundColor: Colors.white,
        ),
        child: child ??Text(""),
      );
    }
    initialDate: selectedDate,
    firstDate: DateTime(1960, 8),
    lastDate: DateTime.now());
if (picked != null && picked != selectedDate)
  setState(() {
    selectedDate = picked;
     

    String da = picked.day.toString() +
        "-" +
        picked.month.toString() +
        "-" +
        picked.year.toString();
    dateOfBirth.text = da;
  });}

更改showDatePicker的日历按钮颜色

2 个答案: