Question

我试图让DateTime出现在flutter / Dart项目中，但它不起作用。对于我的其他选择，我使用的是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（填充： EdgeInsets（20.0，0.0，20.0，0.0），bg：BoxDecoration（border： Border.all（BorderSide（MaterialAccentColor（主要值： Color（0xff448aff）），0.8，BorderStyle.solid）），borderRadius： BorderRadius.circular（32.0）））：不正确使用ParentDataWidget。

Answer 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

Answer 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,
              ),
            ],
          ),
        ),
      ),
    );
  }
}

尝试使Flutter / Dart DateTime出现在下拉菜单中

2 个答案: