flutter - FormBuilderDateTimePicker 不会打开日历

Question

我无法FormBuilderDateTimePicker显示日历。时钟适用于我的开始时间和结束时间，如果我使用日历，日历也有效，FormBuilderDateRangePicker但我无法在 FormBuilderDateTimePicker 上打开日历。

这是我的代码。

import 'package:flutter/cupertino.dart';
import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:flutter_form_builder/flutter_form_builder.dart';
import 'package:intl/intl.dart';

import 'package:komae_v2/data.dart';

class BookASit extends StatefulWidget {
  @override
  BookASitState createState() {
    return BookASitState();
  }
}

class BookASitState extends State<BookASit> {
  var data;
  final GlobalKey<FormBuilderState> _fbKey = GlobalKey<FormBuilderState>();

  final ValueChanged _onChanged = (val) => print(val);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Book A Sit!'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(10),
        child: ListView(
          children: <Widget>[
            FormBuilder(
              // context,
              key: _fbKey,
              autovalidate: true,
              readOnly: false,
              child: Column(
                children: <Widget>[
                  SizedBox(height: 15),
                  FormBuilderTypeAhead(
                    decoration: const InputDecoration(
                      labelText: 'Select a Child',
                    ),
                    attribute: 'child',
                    onChanged: _onChanged,
                    itemBuilder: (context, children) {
                      return ListTile(
                        title: Text(children),
                      );
                    },
                    controller: TextEditingController(text: ''),
                    initialValue: '',
                    suggestionsCallback: (query) {
                      if (query.isNotEmpty) {
                        var lowercaseQuery = query.toLowerCase();
                        return allChildren.where((children) {
                          return children
                              .toLowerCase()
                              .contains(lowercaseQuery);
                        }).toList(growable: false)
                          ..sort((a, b) => a
                              .toLowerCase()
                              .indexOf(lowercaseQuery)
                              .compareTo(
                                  b.toLowerCase().indexOf(lowercaseQuery)));
                      } else {
                        return allChildren;
                      }
                    },
                  ),
                  SizedBox(height: 15),
                  Row(
                    children: <Widget>[
                      Flexible(
                        fit: FlexFit.loose,
                        child: Row(
                          children: <Widget>[
                            Flexible(
                              fit: FlexFit.loose,
                              child: FormBuilderDateTimePicker(
                                attribute: 'time',
                                onChanged: _onChanged,
                                inputType: InputType.time,
                                decoration: const InputDecoration(
                                  labelText: 'Start Time',
                                ),
                                validator: (val) => null,
                                initialTime: TimeOfDay(hour: 8, minute: 0),
                                initialValue: DateTime.now(),
                                // readonly: true,
                              ),
                            ),
                          ],
                        ),
                      ),
                      Flexible(
                        fit: FlexFit.loose,
                        child: Row(
                          children: <Widget>[
                            Flexible(
                              fit: FlexFit.loose,
                              child: FormBuilderDateTimePicker(
                                attribute: 'time',
                                onChanged: _onChanged,
                                inputType: InputType.time,
                                decoration: const InputDecoration(
                                  labelText: 'End Time',
                                ),
                                validator: (val) => null,
                                initialTime: TimeOfDay(hour: 8, minute: 0),
                                // initialValue: DateTime.now(),
                                // readonly: true,
                              ),
                            ),
                          ],
                        ),
                      ),
                    ],
                  ),

                  SizedBox(height: 15),
                  FormBuilderDateTimePicker(
                    attribute: "date",
                    initialDate: DateTime.now(),
                    initialValue: DateTime.now(),
                    inputType: InputType.date,
                    format: DateFormat("MM-dd-yyyy"),
                    decoration: InputDecoration(labelText: "Date"),
                  ),
                  SizedBox(height: 15),
                  FormBuilderChipsInput(
                    decoration: const InputDecoration(
                        labelText:
                            'Select contacts to send the sit request to'),
                    attribute: 'chips_test',
                    onChanged: _onChanged,
                    maxChips: 5,
                    findSuggestions: (String query) {
                      if (query.isNotEmpty) {
                        var lowercaseQuery = query.toLowerCase();
                        return contacts.where((profile) {
                          return profile.name
                                  .toLowerCase()
                                  .contains(query.toLowerCase()) ||
                              profile.email
                                  .toLowerCase()
                                  .contains(query.toLowerCase());
                        }).toList(growable: false)
                          ..sort((a, b) => a.name
                              .toLowerCase()
                              .indexOf(lowercaseQuery)
                              .compareTo(b.name
                                  .toLowerCase()
                                  .indexOf(lowercaseQuery)));
                      } else {
                        return const <Contact>[];
                      }
                    },
                    chipBuilder: (context, state, profile) {
                      return InputChip(
                        key: ObjectKey(profile),
                        label: Text(profile.name),
                        // avatar: CircleAvatar(
                        //   backgroundImage: NetworkImage(profile.imageUrl),
                        // ),
                        onDeleted: () => state.deleteChip(profile),
                        materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
                      );
                    },
                    suggestionBuilder: (context, state, profile) {
                      return ListTile(
                        key: ObjectKey(profile),
                        leading: CircleAvatar(child: Text('A')
                            // backgroundImage: NetworkImage(profile.imageUrl),
                            ),
                        title: Text(profile.name),
                        subtitle: Text(profile.email),
                        onTap: () => state.selectSuggestion(profile),
                      );
                    },
                  ),

                ],
              ),
            ),
            SizedBox(height: 15),
            Row(
              children: <Widget>[
                Expanded(
                  child: MaterialButton(
                    color: Theme.of(context).accentColor,
                    child: Text(
                      'Submit',
                      style: TextStyle(color: Colors.white),
                    ),
                    onPressed: () {
                      if (_fbKey.currentState.saveAndValidate()) {
                        print(_fbKey.currentState.value);
                      } else {
                        print(_fbKey.currentState.value);
                        print('validation failed');
                      }
                    },
                  ),
                ),
                SizedBox(width: 20),
                Expanded(
                  child: MaterialButton(
                    color: Theme.of(context).accentColor,
                    child: Text(
                      'Reset',
                      style: TextStyle(color: Colors.white),
                    ),
                    onPressed: () {
                      _fbKey.currentState.reset();
                    },
                  ),
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }
}

我的调试器突出显示了这一行：

newValue = await _showDatePicker(context, currentValue) ?? currentValue; 有这个特例

_failedAssertion: "initialEntryMode != null"
message: null
_messageString: "is not true"

标签： flutter

Answer 1

正如 assertion 所说的 assertion initialEntryMode != null，initialEntryMode参数是null，这是这个小部件不允许的（至少对于您当前的配置）。使用时为该参数添加一个值FormBuilderDateTimePicker。

前任：

FormBuilderDateTimePicker(
  attribute: "date",
  initialDate: DateTime.now(),
  initialValue: DateTime.now(),
  inputType: InputType.date,
  format: DateFormat("MM-dd-yyyy"),
  decoration: InputDecoration(labelText: "Date"),
  initialEntryMode: DatePickerEntryMode.calendar,
),