본문 바로가기
Flutter

[Flutter] GlobalKey란 무엇인가??

by Kim JK 2021. 8. 6.
반응형

 

GlobalKey에 대한 설명이다.

대충 ..요소를 식별하고 글로벌키는 다른 키로의 액세스를 제공한다고 한다.

그리고 상위 위젯에 적용했을 시 하위 위젯에까지 적용이 된다고 한다.

 

GlobalKey에 제네릭을 사용하여 특정 클래스와 매칭을 시킬수 있다.

나는 Form에 글로벌키를 사용하고,  하위 위젯인 TextFormField의 유효성을 체크하는 코드를 짜보았다.


class _SignUpFormState extends State<SignUpForm> {
GlobalKey<FormState> _formKey = GlobalKey<FormState>();   //글로벌 키 선언
TextEditingController _emailController = TextEditingController();
TextEditingController _pwController = TextEditingController();
TextEditingController _pwCheckController = TextEditingController();

@override
void dispose() {
// TODO: implement dispose
_emailController.dispose();
_pwCheckController.dispose();
_pwController.dispose();
super.dispose();
}

@override
Widget build(BuildContext context) {
return Padding(
padding: const EdgeInsets.all(common_gap),
child: Form(
key: _formKey, //위젯에 적용

.....

 

 

 

이런식으로 key를 넣게되면 글로벌키가 잘 적용이된다.

 

TextFormField(
obscureText: true,
cursorColor: Colors.grey,
controller: _pwCheckController,
decoration: textInputDeco('Confirm Password'),
validator: (text) {
if (text!.isNotEmpty && _pwController.text == text) {
return null;
} else {
return '입력한 비밀번호가 서로 일치하지 않습니다.';
}
},
),

 

 

하위 위젯인 TextFormField에서 이런식으로 유효성을 체크한뒤..

 

FlatButton _submitBtn(BuildContext context) {
return FlatButton(
color: Colors.blue,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(6)),
onPressed: () {

if (_formKey.currentState!.validate()) {
print('validation success');
Provider.of<FirebaseAuthState>(context, listen: false)
.registerUser(context, email: _emailController.text, password: _pwController.text);
}
},

 

 

 

GlobalKey의 하위 메소드 currentState를 통해 FormState클래스의 validate를 체크해주었다.

 

Form widget은 identify를 위해서 GlobalKey를 사용한다고한다.

반응형