Невозможно проверить ввод с помощью TextFormField и FlatButton - PullRequest
Новая
       31

Невозможно проверить ввод с помощью TextFormField и FlatButton

0 голосов
/ 01 августа 2020

Я сейчас работаю над приложением флаттера. Я пытаюсь получить ввод пользователя с помощью TextFormField и передать его на следующую страницу с помощью навигатора внутри FlatButton. Но по какой-то причине он работает не так, как я ожидал.

Вот код: 

TextFormField(
                decoration: InputDecoration(
                  enabledBorder: OutlineInputBorder(
                      borderRadius: BorderRadius.all(Radius.circular(8)),
                      borderSide: BorderSide(color: Colors.grey[200])),
                  focusedBorder: OutlineInputBorder(
                      borderRadius: BorderRadius.all(Radius.circular(8)),
                      borderSide: BorderSide(color: Colors.grey[300])),
                  filled: true,
                  fillColor: Colors.grey[100],
                  errorBorder: InputBorder.none,
                  focusedErrorBorder: InputBorder.none,
                  errorStyle: Theme.of(context).textTheme.caption,
                  hintText: 'Phone Number',
                ),
                keyboardType: TextInputType.phone,
                controller: _phoneController,
                maxLength: 10,
                validator: (value) {
                  print(value);
                  return isPhoneValid(value)
                      ? 'Continue'
                      : "Input : 98XXXXXXXX";
                },
              ),
              FlatButton(
                child: Text('Enter'),
                textColor: Colors.white,
                disabledColor: Colors.grey,
                padding: EdgeInsets.all(16),
                onPressed: (isPhoneValid(_phoneController.text))
                    ? () {
                        Navigator.push(context, MaterialPageRoute(builder,(context)=>HomeScreen));
                      }
                    : null,
                color: Colors.blue,
              ),

, и они находятся вне функции сборки. 

final _phoneController = TextEditingController();

  bool isPhoneValid(String value) {
    print('Function');
    print(value);
    return value.trim().length == 10;
  }

По какой-то причине onPressed в FlatButton всегда отображается в null. Пожалуйста, помогите мне в этом отношении.

Заранее спасибо.

PS: валидатор внутри TextFormField тоже не работает.

1 Ответ

1 голос
/ 01 августа 2020

Неясно, почему вы строите onPressed таким образом, он не будет работать так, как вы ожидаете. Измените свой метод onPressed на этот 

onPressed: () {
    if (isPhoneValid(_phoneController.text)) {
        Navigator.push(context, MaterialPageRoute(builder,(context)=>HomeScreen));
    }
}

EDIT

Чтобы отключить кнопку, пока текстовое поле не станет действительным, вы должны прослушивать текстовые изменения 

bool _canPressButton = false;

@override
void initState() {
  _phoneController.addListener(_checkIfCanPressButton);

  super.initState();
}

void _checkIfCanPressButton() {
  var canPressButton = isPhoneValid(_phoneController.text);
  if (canPressButton != _canPressButton) {
    setState(() => _canPressButton = canPressButton);
  }
}

Тогда вы могли бы сделать 

onPressed: _canPressButton ?
    ? () => Navigator.push(context, MaterialPageRoute(builder: (context) => HomeScreen))
    : null,
...