Flutter中如何为date_time_picker组件添加enabledBorder颜色

要给DateTimePicker的输入框添加enabledBorder颜色，你可以通过inputDecoration参数传入自定义的InputDecoration，在其中配置enabledBorder属性即可。

修改后的完整代码如下：

DateTimePicker(
  type: DateTimePickerType.dateTimeSeparate,
  dateMask: 'd MMM, yyyy',
  cursorColor: Colors.cyan,
  firstDate: DateTime(2000),
  lastDate: DateTime(2100),
  icon: const Icon(Icons.event, color: Colors.indigo),
  dateLabelText: 'Start Date',
  timeLabelText: 'Start Hour',
  // 添加自定义输入框边框样式
  inputDecoration: const InputDecoration(
    enabledBorder: OutlineInputBorder(
      borderSide: BorderSide(color: Colors.red), // 替换为你需要的边框颜色
    ),
  ),
  selectableDayPredicate: (date) {
    // Disable weekend days to select from the calendar
    if (date.weekday == 6 || date.weekday == 7) {
      return false;
    }
    return true;
  },
  onChanged: (val) => print(val),
  validator: (val) {
    return null;
  },
  onSaved: (val) => print(val),
),

补充说明 #

• inputDecoration用于控制输入框的整体样式，enabledBorder专门定义输入框处于启用状态时的边框样式，你可以调整BorderSide的color、width等属性来匹配需求。
• 如果需要保留组件原有的输入框样式（比如标签、内边距），可以基于默认配置修改，示例如下：

  inputDecoration: const InputDecoration(
    enabledBorder: OutlineInputBorder(
      borderSide: BorderSide(color: Colors.blue, width: 2),
    ),
    labelStyle: TextStyle(color: Colors.grey),
    contentPadding: EdgeInsets.symmetric(horizontal: 16, vertical: 12),
  ),
  

内容的提问来源于stack exchange，提问作者selvaraj9k