[Flutter/플러터] 플러터 위젯에서 위젯으로 값 전달

안녕하세요!

플러터 샘플 앱 분석의 일환으로 위젯에서 위젯으로 값 전달에 대해 알아보겠습니다.

 

[Flutter/플러터] 플러터 샘플 앱 분석하기

 

위젯에서 위젯으로 값 전달

• MaterialApp 클래스에서 home 프로퍼티에 MyHomePage 인스턴스를 인수로 전달하며, 그와 동시에 MyHomePage의 title 인수값으로 'Flutter Demo Home Page'를 전달함

    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),  //title 인수값 전달
    );

 

• 전달받은 title 인수값은 MyHomePage 클래스의 생성자의 this.title 매개변수로 전달되어 필드 상수인 String title에 대입
• 상태 클래스에서 StatefulWidget 클래스에 접근하려면 widget 프로퍼티를 사용

class MyHomePage extends StatefulWidget {

	//생성자
  const MyHomePage({super.key, required this.title});	//this.title 매개변수로 전달

  final String title;	//String title에 MyHomePage title 인수값을 대입

... 생략 ...

}


//상태 클래스
class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),	//StatefulWidget 클래스에 접근하기 위해 widget 프로퍼티 사용
      ),
    );
  }
}