다트 이해하기 - (8) Flutter의 initState 함수

Flutter의 initState 함수란?

Flutter에서 initState 함수는 StatefulWidget의 상태를 초기화할 때 사용하는 메서드입니다.
쉽게 말해, "앱이 처음 실행될 때 한 번만 호출되는 준비 작업 함수"라고 생각하면 됩니다.
예를 들어, 데이터를 불러오거나 타이머를 설정하는 등 초기화가 필요한 작업을 initState에서 수행합니다.

---

initState의 주요 특징

1. 딱 한 번 호출됨
   • initState는 State 객체가 처음 생성될 때 한 번만 호출됩니다.
   • 이후 상태가 변경되어도 initState는 다시 호출되지 않습니다.
2. 초기화 작업에 적합
   • 데이터를 불러오거나 리스너를 추가하는 등 초기 설정 작업에 사용됩니다.
3. super.initState() 호출 필요
   • initState를 오버라이드할 때 super.initState() 를 반드시 호출해야 Flutter의 내부 초기화가 제대로 동작합니다.

---

initState 함수의 기본 구조

@override
void initState() {
  super.initState(); // 부모 클래스의 초기화 메서드 호출
  // 초기화 작업
}

---

간단한 예제: 앱 시작 시 타이머 설정

아래는 앱이 실행되면 3초 후에 텍스트를 업데이트하는 예제입니다.

import 'package:flutter/material.dart';
import 'dart:async'; // 타이머를 사용하기 위해 필요

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  String message = "안녕하세요!";

  @override
  void initState() {
    super.initState();
    // 3초 후에 메시지 변경
    Timer(Duration(seconds: 3), () {
      setState(() {
        message = "Flutter를 배우고 있어요!";
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('initState 함수 예제')),
        body: Center(
          child: Text(
            message,
            style: TextStyle(fontSize: 24),
          ),
        ),
      ),
    );
  }
}

 

---

언제 initState를 사용해야 할까?

• 초기 데이터 로드:
  • 예: API 호출, 데이터베이스에서 데이터 가져오기.
• 애니메이션 시작:
  • 애니메이션 컨트롤러 초기화.
• 리스너 추가:
  • 텍스트 입력이나 네트워크 이벤트를 감지하는 리스너 설정.
• 타이머 설정:
  • 특정 시간 후에 동작을 실행.

 

주의할 점

1. UI 관련 작업 금지:
   • initState에서 직접 UI를 업데이트하거나 context를 사용해 위젯 트리에 접근하면 오류가 발생할 수 있습니다.
   • 이유: 위젯이 아직 완전히 렌더링되지 않았기 때문입니다.
2. 반드시 super.initState() 호출:
   • initState를 오버라이드할 때 Flutter의 기본 초기화 작업을 위해 super.initState()를 호출해야 합니다.
3. dispose와 함께 사용:
   • 리스너나 애니메이션 컨트롤러를 initState에서 추가했다면, dispose 함수에서 반드시 정리(cleanup)해야 메모리 누수를 방지할 수 있습니다.