Flutter

Flutter : TextField

iosroid 2019. 9. 6. 10:42

Flutter 의 텍스트 입력을 받는 위젯이다.

TextField class

TextField({Key key, TextEditingController controller, FocusNode focusNode, InputDecoration decoration: const InputDecoration(), ... })

A text field lets the user enter text, either with hardware keyboard or with an onscreen keyboard.

Material Design 의 사용자의 텍스트 입력을 받을 수 있는 위젯이다.

 

 

 

Plain TextField

아래 줄만 그려지고 그 위에 문자 입력이 가능하다.

onChanged() 를 통해 사용자의 입력 값을 얻는다.

입력값이 화면에 출력되는 예제

TextField, obsecureText

입력받은 문자열을 가려서 보여준다. password 입력의 예.

암호입력 예제

TextField, decoration

TextEditingController 를 사용하여 입력 데이터를 얻는다.

addListner() 를 통해 초기화를 해주고 더이상 필요 없을 시 별도로 dispose() 를 해줘야 한다.

InputDecoration 를 사용하여 입력칸의 모양을 꾸민다.

사각형 데코와 힌트 텍스트가 적용된 예제

Reference

Flutter Documentation