GlobalKey

GlobalKey는 Flutter에서 위젯의 상태를 전역적으로 접근할 수 있도록 하는 키입니다. GlobalKey는 위젯 트리 전체에서 유일하며, 특정 위젯의 상태를 직접 제어하거나 정보를 얻을 때 사용됩니다.

정의 및 기능:

• GlobalKey는 고유한 식별자로, Flutter의 위젯 트리에서 특정 위젯을 직접 찾고 상호작용하는 데 사용됩니다.
• 위젯의 상태에 직접 접근하거나, 위젯의 위치나 크기 같은 정보를 얻을 수 있습니다.
• 동적인 위젯 리스트에서 특정 항목의 상태를 관리하거나, 폼의 상태를 직접 제어하는 데 유용합니다.

예시:

• GlobalKey<FormState>는 Form 위젯의 상태를 관리하는 데 자주 사용됩니다. 예를 들어, 폼을 제출할 때 폼의 유효성을 검사하거나 폼 필드의 현재 값을 가져올 때 사용할 수 있습니다.
• GlobalKey<ScaffoldState>는 Scaffold 위젯의 상태에 접근하여, 드로어를 열거나 스낵바를 표시하는 데 사용됩니다.

활용 방안:

• 폼 제출: GlobalKey<FormState>를 사용하여 폼의 유효성을 검사하고, 데이터를 저장합니다.
• 위젯 제어: GlobalKey를 사용하여 특정 위젯을 제어하거나, 위젯의 속성(크기, 위치 등)에 접근합니다.
• 상태 관리: 동적인 목록이나 그리드에서 특정 항목의 상태를 관리하거나 업데이트합니다.

주의사항:

• 오버유즈 주의: GlobalKey는 강력한 도구이지만, 남용하면 성능 문제나 코드의 복잡성을 증가시킬 수 있습니다. 필요한 경우에만 사용하는 것이 좋습니다.
• 유일성 보장: GlobalKey는 전역적으로 유일해야 하므로, 같은 키를 여러 위젯에 사용하지 않도록 주의해야 합니다.
• 메모리 누수 주의: GlobalKey를 잘못 사용하면 메모리 누수가 발생할 수 있습니다. 위젯이 파괴될 때 GlobalKey를 적절히 해제해야 합니다.

정의

GlobalKey는 Flutter에서 사용되는 키값으로, 앱의 모든 화면에서 공유할 수 있는 고유한 식별자를 제공합니다. GlobalKey를 사용하여 컨트롤러, 위젯, 또는 데이터를 다른 화면에서 참조할 수 있습니다.

예시

다음은 GlobalKey를 사용하여 컨트롤러를 공유하는 예시입니다.

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final GlobalKey<MyControllerState> _controllerKey =
      GlobalKey<MyControllerState>();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("GlobalKey"),
      ),
      body: Center(
        child: MyController(
          key: _controllerKey,
        ),
      ),
    );
  }
}

class MyController extends StatefulWidget {
  final GlobalKey<MyControllerState> key;

  MyController({
    required this.key,
  }) : super();

  @override
  _MyControllerState createState() => _MyControllerState();
}

class _MyControllerState extends State<MyController> {
  int _count = 0;

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Text(
          "Count: ${_count}",
          style: TextStyle(fontSize: 24),
        ),
        ElevatedButton(
          onPressed: () {
            setState(() {
              _count++;
            });
          },
          child: Text("Increment"),
        ),
      ],
    );
  }
}

위 예시에서 MyHomePage 위젯은 MyController 위젯의 GlobalKey를 생성하고 이를 _controllerKey 변수에 저장합니다. MyController 위젯은 _count 변수를 사용하여 카운트를 관리합니다. MyHomePage 위젯의 build() 메서드는 MyController 위젯을 로드하고 _controllerKey 변수를 사용하여 _count 변수에 접근합니다.

활용 방안

GlobalKey는 다음과 같은 경우에 활용할 수 있습니다.

• 앱의 모든 화면에서 공유할 수 있는 데이터를 관리할 때
• 컨트롤러, 위젯, 또는 데이터를 다른 화면에서 참조할 때
• 앱의 상태를 추적하고 관리할 때

주의사항

GlobalKey는 앱의 모든 화면에서 공유할 수 있는 키값이므로, 키값을 안전하게 관리해야 합니다. 키값을 유출하거나 잘못 사용하면 보안 및 안정성 문제가 발생할 수 있습니다.

또한, GlobalKey는 앱의 성능에 영향을 미칠 수 있습니다. GlobalKey를 많이 사용하면 앱의 성능이 저하될 수 있으므로, 사용에 주의해야 합니다.

GlobalKey는 Flutter에서 매우 유용한 도구이지만, 그 사용법과 주의사항을 잘 이해하고 사용하는 것이 중요합니다.

GlobalKey<FormState> 객체인 _formKey는 Flutter의 Form 위젯에 연결되어 폼의 상태를 관리합니다. 이 키는 다음과 같은 목적으로 사용됩니다.

1. 유효성 검사: _formKey.currentState.validate()를 호출하여 폼 내 모든 TextFormField의 validator 메서드를 실행할 수 있습니다. 이 메서드들이 null을 반환하면 필드가 유효하다고 판단하고, 그렇지 않으면 유효하지 않다고 판단합니다.

2. 상태 저장: _formKey.currentState.save()를 호출하여 모든 TextFormField의 onSaved 메서드를 실행할 수 있습니다. 이를 통해 사용자가 입력한 정보를 저장합니다.

3. 폼 상태 접근: _formKey.currentState를 통해 현재 폼의 상태에 직접 접근할 수 있습니다. 예를 들어, 폼이 수정되었는지, 현재 어떤 필드가 활성화되어 있는지 등을 확인할 수 있습니다.

코드에서는 다음과 같이 사용되고 있습니다:

void _onSubmitTap() {
  if (_formKey.currentState != null) {
    if (_formKey.currentState!.validate()) {  // 1. 유효성 검사
      _formKey.currentState!.save();          // 2. 상태 저장
      // 이동 로직
    }
  }
}

1. _formKey.currentState!.validate()를 호출하여 폼 내의 모든 TextFormField의 유효성을 검사합니다. 만약 모든 필드가 유효하다면, validate() 메서드는 true를 반환합니다.
2. _formKey.currentState!.save()를 호출하여 모든 TextFormField의 onSaved 메서드를 실행합니다. 이 메서드들은 각 필드의 값을 formData 맵에 저장합니다.

따라서, _onSubmitTap 메서드는 유효성 검사를 통과한 경우에만 사용자의 데이터를 저장하고 다음 화면으로 이동하게 됩니다.

final GlobalKey<FormState> _formKey = GlobalKey<FormState>(); 이 코드는 Flutter에서 매우 중요한 역할을 합니다. 이 코드를 자세히 살펴보겠습니다.

1. GlobalKey

   • Flutter에서는 위젯의 상태를 접근하거나 조작하기 위해 GlobalKey를 사용합니다. 특히 상태가 있는 위젯(StatefulWidget)의 상태를 외부에서 접근할 때 유용합니다.

2. FormState

   • 이 키는 Form 위젯의 상태에 특화되어 있습니다. 따라서 <FormState> 타입을 명시적으로 사용하여 Form 위젯의 상태에 접근하고자 함을 나타냅니다.

3. _formKey

   • 이 키는 Form 위젯을 참조하기 위한 고유한 식별자로 사용됩니다. 이를 통해 폼의 유효성 검사, 저장 등의 동작을 수행할 수 있습니다.

예제에서 이 키는 아래와 같이 사용됩니다:

Form(
  key: _formKey,
  //... (생략)
)

위 코드에서 Form 위젯의 key 속성에 _formKey를 할당함으로써, 이 후에 이 키(_formKey)를 사용하여 Form의 상태에 접근할 수 있게 됩니다.

예시:

if (_formKey.currentState!.validate()) {
  _formKey.currentState!.save();
}

위 예시에서 _formKey.currentState를 사용하여 FormState에 접근하고 있습니다. validate() 메서드는 폼의 모든 TextFormField에 있는 validator 함수를 호출하여 입력의 유효성을 확인하며, save() 메서드는 각 필드의 onSaved 콜백을 호출하여 데이터를 저장합니다.

요약하면, final GlobalKey<FormState> _formKey = GlobalKey<FormState>();는 Form 위젯의 상태에 접근하고 조작할 수 있도록 하는 중요한 역할을 하는 코드입니다.

// 이 메서드는 이메일 입력 필드의 유효성을 검사합니다.
validator: (value) {
  // 사용자가 입력한 값이 null이 아니고, 빈 문자열이면
  if (value != null && value.isEmpty) {
    // 사용자에게 이메일을 입력하라는 메시지를 반환합니다.
    return "Please write your email";
  }
  // 그렇지 않으면 유효하다는 뜻의 null을 반환합니다.
  return null;
},

// 이 메서드는 비밀번호 입력 필드의 유효성을 검사합니다.
validator: (value) {
  // 사용자가 입력한 값이 null이 아니고, 빈 문자열이면
  if (value != null && value.isEmpty) {
    // 사용자에게 비밀번호를 입력하라는 메시지를 반환합니다.
    return "Please write your password";
  }
  // 그렇지 않으면 유효하다는 뜻의 null을 반환합니다.
  return null;
},

// 이 메서드는 폼 필드에서 데이터를 저장할 때 호출됩니다.
onSaved: (newValue) {
  // 사용자가 입력한 새로운 값이 null이 아니면
  if (newValue != null) {
    // formData 딕셔너리에 'password' 키로 새로운 값을 저장합니다.
    formData['password'] = newValue;
  }
}

validator에서 null을 반환하면 유효하다는 뜻입니다.