TextField widget

TextField widget

플러터에서 text-input을 사용하는 방법에 대해서 알아보겠습니다.
속성값으로는 maxLength, decoration, keyboardType 등이 있습니다.

const TextField(
  maxLength: 50,
  decoration: InputDecoration(
    label: Text('Title'),
    prefixIcon: Icon(Icons.add),
  ),
),

그렇다면 TextField의 값은 어떻게 사용할까요?
먼저 고전적인 방법부터 사용해 보겠습니다.

var _enterdTitle = '';
void _saveTitleInput(String input) {
  _enterdTitle = input;
}

const TextField(
  onChanged: _saveTitleInput,
),

변수를 생성해 주고, 값이 변경될때마다 변수를 변경해주는 방법입니다.

controller

이러한 과정은 너무 번거롭기 때문에, controller를 사용하는 방법이 있습니다.
다음과 같이 손쉽게 사용할 수 있습니다.

final _titleController = TextEditingController();

TextField(controller: _titleController)

ElevatedButton(
  onPressed: ()=> print(_titleController.text),
  child: const Text("Save"),
),