试图让 Flutter/Dart DateTime 出现在下拉菜单中

Posted 2023-02-22

【中文标题】试图让 Flutter/Dart DateTime 出现在下拉菜单中

【英文标题】：Trying to get a Flutter/Dart DateTime to appear in a dropdown menu

【发布时间】：2020-05-04 23:26:29

【问题描述】：

我试图让 DateTime 出现在颤振/飞镖项目中，但它不起作用。对于我的其他选择，我使用的是 TextFormField 但是当我尝试将下拉列表放在框装饰中时，它给了我一个错误。我是 Flutter/Dart 的新手，所以我想知道我做错了什么，有没有更好更有效的方法来编写它？

//some other code
...    
TextFormField(
                  decoration: InputDecoration(
                    labelText: 'Course Name',
                    contentPadding:
                        EdgeInsets.symmetric(vertical: 10.0, horizontal: 20.0),
                    border: OutlineInputBorder(
                      borderRadius: BorderRadius.all(Radius.circular(32.0)),
                    ),
                    enabledBorder: OutlineInputBorder(
                      borderSide: BorderSide(color: Colors.blueAccent, width: 1.0),
                      borderRadius: BorderRadius.all(Radius.circular(32.0)),
                    ),
                    focusedBorder: OutlineInputBorder(
                      borderSide: BorderSide(color: Colors.blueAccent, width: 2.0),
                      borderRadius: BorderRadius.all(Radius.circular(32.0)),
                    ),
                  ),
                ),
                new SizedBox(
                  height: 20.0,
                ),
                new Row(children: <Widget>[
                  Container(
                    padding: EdgeInsets.symmetric(horizontal: 20.0),
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.all(Radius.circular(32.0)),
                      border: Border.all(
                          color: Colors.blueAccent,
                          style: BorderStyle.solid,
                          width: 0.80),
                    ),
                    child: new Expanded(
                        child: new TextFormField(
                      decoration: new InputDecoration(
                        hintText: 'Enter your date of birth',
                        labelText: 'Date of Birth',
                      ),
                      controller: _controller,
                      keyboardType: TextInputType.datetime,
                    )),
                  ),
                  new IconButton(
                    icon: Icon(Icons.keyboard_arrow_down),
                    tooltip: 'Choose date',
                    onPressed: (() 
                      _chooseDate(context, _controller.text);
                    ),
                  )
                ]),
              ]),
            ),
          ),
        );
      
    

错误信息：

在构建 Container(padding: EdgeInsets(20.0, 0.0, 20.0, 0.0), bg: BoxDecoration(边框: Border.all(BorderSide(MaterialAccentColor(主值： 颜色（0xff448aff）），0.8，BorderStyle.solid）），borderRadius： BorderRadius.circular(32.0)))：ParentDataWidget 的使用不正确。

【问题讨论】：

最好使用像这样的库pub.dev/packages/datetime_picker_formfield

【参考方案1】：

使用 showDatePicker

DateTime selectedDate = DateTime.now();

Future<Null> _selectDate(BuildContext context) async 
final DateTime picked = await showDatePicker(
    context: context,
    initialDate: selectedDate,
    firstDate: DateTime(2015, 8),
    lastDate: DateTime(2101));
if (picked != null && picked != selectedDate)
  setState(() 
    selectedDate = picked;
  );

您可以在下面的 dartpad 链接中查看完整的源代码

https://dartpad.dev/e5a99a851ae747e517b75ac221b73529

【讨论】：

对不起，我的问题不清楚。我能够让 DateTime 选择器工作。我的回复的“其他代码”部分中有类似的代码。我无法将其格式化为我想要的下拉格式。

【参考方案2】：

我能够通过使用插件（flutter_datetime_picker 1.3.4）来解决这个问题。我对其进行了一些修改以满足我的需要。

TextFormField(
                decoration: InputDecoration(
                  labelText: 'Course Name',
                  contentPadding:
                      EdgeInsets.symmetric(vertical: 10.0, horizontal: 20.0),
                  border: OutlineInputBorder(
                    borderRadius: BorderRadius.all(Radius.circular(32.0)),
                  ),
                  enabledBorder: OutlineInputBorder(
                    borderSide:
                        BorderSide(color: Colors.blueAccent, width: 1.0),
                    borderRadius: BorderRadius.all(Radius.circular(32.0)),
                  ),
                  focusedBorder: OutlineInputBorder(
                    borderSide:
                        BorderSide(color: Colors.blueAccent, width: 2.0),
                    borderRadius: BorderRadius.all(Radius.circular(32.0)),
                  ),
                ),
              ),
              new SizedBox(
                height: 20.0,
              ),
              FlatButton(
                shape: RoundedRectangleBorder(
                    borderRadius: new BorderRadius.circular(32.0),
                    side: BorderSide(color: Colors.blueAccent)),
                onPressed: () 
                  DatePicker.showDatePicker(context,
                      theme: DatePickerTheme(
                        containerHeight: 210.0,
                      ),
                      showTitleActions: true,
                      minTime: DateTime(1940, 1, 1),
                      maxTime: DateTime.now(), onConfirm: (date) 
                    print('confirm $date');
                    _date = '$date.month / $date.day / $date.year';
                    //_date = '$date.year - $date.month - $date.day';
                    setState(() );
                  , currentTime: DateTime.now(), locale: LocaleType.en);
                ,
                child: Container(
                  alignment: Alignment.center,
                  height: 50.0,
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: <Widget>[
                      Row(
                        children: <Widget>[
                          Container(
                            child: Row(
                              children: <Widget>[
                                Text(
                                  " $_date",
                                  style: TextStyle(
                                      color: Colors.black, fontSize: 16.0),
                                ),
                              ],
                            ),
                          )
                        ],
                      ),
                      Text(
                        "  Change",
                        style:
                            TextStyle(color: Colors.blueAccent, fontSize: 16.0),
                      ),
                    ],
                  ),
                ),
                color: Colors.white,
              ),
              SizedBox(
                height: 20.0,
              ),
            ],
          ),
        ),
      ),
    );