如何更改CupertinoDatePicker的背景颜色?

3

我在我的应用程序中使用了CupertinoDatePicker。

Container(
    height: 200,
    padding: const EdgeInsets.all(16.0),
    child: CupertinoDatePicker(
        mode: CupertinoDatePickerMode.date,
        minimumYear: DateTime.now().year,
        onDateTimeChanged: (DateTime value) {
        print(value);
        },
    )

该应用程序正在使用MaterialApp(MaterialTheme)。有没有办法更改CupertinoDatePicker的背景颜色?

我尝试过将CupertinoDatePicker包装在CupertinoTheme中并将颜色设置为黑色,但并未起作用。

Container(
    height: 200,
    padding: const EdgeInsets.all(16.0),
    child: CupertinoTheme(
        data: CupertinoThemeData(
            primaryColor: Colors.black),
        child: CupertinoDatePicker(
        mode: CupertinoDatePickerMode.date,
        minimumYear: DateTime.now().year,
        onDateTimeChanged: (DateTime value) {
            print(value);
        },
        ),
    ),
)
3个回答

2
在撰写本文时,目前还不可能实现,并且在源代码的date_picker.dart中有一条注释,内容如下:

// 未来可以考虑从主题中设置默认背景颜色。 const Color _kBackgroundColor = CupertinoColors.white;


是的,我已经复制了CupertinoDatePicker类,并使用_kBackgroundColor作为CupertinoColors.black创建了一个新的小部件。 - Sawan Kumar Bundelkhandi

2
目前为止,Flutter在Master频道上为CupertinoDatePicker添加了backgroundColor属性。请参见https://github.com/flutter/flutter/commit/19cdb21cb67acf51fb9b4e4e7a367d0bcd82fc7b#diff-54c54e67345e65bac63291794f109fd1。它支持以下版本: master (#39056) v1.10.14 v1.10.13 v1.10.12 v1.10.11 v1.10.10 v1.10.9 v1.10.8 v1.10.7 v1.10.6 v1.10.5 v1.10.4 v1.10.3 v1.10.2 v1.10.1 v1.10.0 v1.9.7 v1.9.6
您可以按照以下方式设置backgroundColor:
CupertinoTimerPicker(
     backgroundColor: Colors.black,
     initialTimerDuration: timer,
     mode: CupertinoTimerPickerMode.hms,
     onTimerDurationChanged: (Duration newTimer) {
                                       setState(() {
                                       timer = newTimer;
                     });

@Virkam Kapoor,您能否提及支持此功能的版本? - Jibeex
我已经更新了答案,并列出了支持的版本。 - Vikram Kapoor
文本颜色怎么样?如果文本颜色总是灰色,改变背景颜色就没有太大用处了...我们应该能够将文本颜色更改为与背景颜色形成对比的颜色... - Ernesto

0
如果您为Flutter应用程序选择了暗主题,则CupertinoDatePicker的文本颜色会变为白色。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接