Как использовать событие onKeyUp в TextField во флаттере

Question

Я использую флаттер, чтобы сделать простое приложение. В приведенном ниже коде, когда событие изменения TextBox запускается, я вызываю метод с именем updateTitle().

Но я должен вызывать тот же метод updateTitle(), когда ключ поднят, как мы используем в javascript и других языках.

              TextField(
                controller: titleController,
                style: textStyle,
                onChanged: (value) => updateTitle(),
                decoration: InputDecoration(
                    labelText: "Title",
                    labelStyle: textStyle,
                    border: OutlineInputBorder(
                      borderRadius: BorderRadius.circular(5.0),
                    )),
              ),

Answer 1

Для вашего случая использования onChangedработает так же, как onkyeup должно сработать. Каждый раз, когда пользователь нажимает новый символ в текстовом поле, он запускается.

Чтобы включить / отключить кнопку, необходимо прослушать это событие, выполнить тест, чтобы увидеть, не является ли поле пустым, изменить переменную, которая будет обрабатывать состояние кнопки, и вызвать setState(),

Это просто пример кода. Не проверено, но должно работать как есть.

class _SoAnswerState extends State<SoAnswer> {

    bool _buttonActive = false;

    @override
    Widget build(BuildContext context) {

    ...

        TextField(
            controller: titleController,
            style: textStyle,
            onChanged: (value) => updateButtonState(value), // onChanged return the value of the field
            decoration: InputDecoration(
                labelText: "Title",
                labelStyle: textStyle,
                border: OutlineInputBorder(
                    borderRadius: BorderRadius.circular(5.0),
                )
            ),
        ),

    ...
    }

    void updateButtonState(String text){
        // if text field has a value and button is inactive
        if(text != null && text.length > 0 && !_buttonActive){
            setState(() {
                _buttonActive = true;
            }
        }else if((text == null || text.length == 0) && _buttonActive){
            setState(() {
                _buttonActive = true;
            }
        }
    }