Как проверить форму внутри bottomSheet, включенного в Scaffold?

Я хотел бы проверить форму внутри bottomSheet, который включен в Scaffold.

Проблема в том, что я закрываю bottomSheet и нажимаю «СОХРАНИТЬ» (на панели приложений).

Кажется, final form = _formAddPlayerKey.currentState; вернуть null, когда bottomSheet закрыт.

Когда bottomSheet открыт, я могу проверить форму.

Мой код, эшафот с нижним листом внутри:

return Scaffold(

      key: _scaffoldKey,
      appBar: AppBar(

        title: Text('MyTitle'),
        actions: <Widget>[
          //--- Form validation
          FlatButton(
            onPressed: () {
                  final form = _formAddPlayerKey.currentState;

              if (form.validate()) {
                form.save();

                print('SAV OK!!!');
              }
            },
            child: Text(
              'SAVE',
              style: Theme.of(context)
                  .textTheme
                  .subhead
                  .copyWith(color: Colors.white),
            ),
          )
        ],
      ),
      floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
      floatingActionButton: 

          showFab
              ? FloatingActionButton(

                  child: const Icon(Icons.comment, color: Colors.white),
                  onPressed: () {
                    var bottomSheetController =
                        _scaffoldKey.currentState.showBottomSheet(
                      (context) => Container(
                        color: Colors.pink.withOpacity(
                            0.2), //Theme.of(context).accentColor.withOpacity(0.5),
                        //backgroundColor: Theme.of(context).accentColor.withOpacity(0.5),
                        height: MediaQuery.of(context).size.height,
                        width: MediaQuery.of(context).size.width,
                        child: Form(
                          key: _formAddPlayerKey,
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.start,
                            children: <Widget>[

                              SizedBox(
                                height: 10,
                              ),
                              Container(

                                color: Colors.white.withOpacity(0.5),

                                //Colors.white,
                                margin: EdgeInsets.all(16.0),
                                child: TextFormField(
                                  maxLines: 4,
                                  style: TextStyle(
                                    fontWeight: FontWeight.bold,
                                    fontSize: 30,
                                  ),
                                  decoration: InputDecoration(
                                    hoverColor: Colors.white,
                                    fillColor: Colors.white,
                                    labelText: 'Observation',
                                    border: OutlineInputBorder(),
                                    prefixIcon: Icon(Icons.note),
                                  ),
                                  keyboardType: TextInputType.text,
                                  initialValue:
                                      'My observation....',
                                  validator: (value) {
                                    return validateMyValue(value);
                                  },
                                  onSaved: (value) =>
                                      _MyValue = value,
                                ),
                              ),
                            ],
                          ),
                        ),
                      ),
                    );

                    showFoatingActionButton(false);

                    /// close ?



                    bottomSheetController.closed.then((value) {
                      showFoatingActionButton(true);
                    });
                  })
              : Container(),

      bottomNavigationBar: _buildBottomNavigationBar(context),
      body: _buildBody(context),
    );
  }

  void showFoatingActionButton(bool value) {
    setState(() {
      showFab = value;
    });
  }

flutter state forms scaffold bottom-sheet
person rach    schedule 12.02.2020    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Просто определите свой ключ формы глобально, то есть в классе State

var _formAddPlayerKey = GlobalKey<FormState>();

Всякий раз, когда вы хотите проверить свою форму с помощью этого соответствующего ключа, вам просто нужно ввести это,

bool validate = _formAddPlayerKey.currentState.validate();

Если проверка логической переменной истинна, ваша форма соответствует отметкам, и если проверка не удалась, она автоматически устанавливает сообщения об ошибках, которые вы уже определили в свойстве проверки виджета TextFormField.

person Yogesh Chawla    schedule 13.02.2020
comment
Спасибо за ваш ответ (я уже определил ключ глобально, как вы предлагаете, я отредактирую код), но проблема сохраняется, когда закрывается bottonSheet, когда выполняется onPressed (когда я нажимаю) У меня есть эта ошибка: Validate () вызывается при нулевом значении ... Кажется, что форма внутри bottonSheet уничтожается, когда закрывается bottonSheet, поэтому форма имеет значение null, ключ имеет значение null, а метод validate () формы formstate формы вызывается при нулевом значении .. .. - person rach; 14.02.2020
comment
Да, при флаттере, если представление отсоединено от экрана, оно разрушает его текущее состояние представления, для проверки вы можете сохранить FormState при закрытии BottomSheet следующим образом: _formAddPlayerKey.save (); - person Yogesh Chawla; 14.02.2020
comment
Спасибо за ответ, Йогеш. Я провел несколько тестов и, наконец, решил не использовать BottomSheet для своего пользовательского интерфейса, потому что это не практиковалось. - person rach; 27.03.2020