반응형
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return const MaterialApp(
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({super.key, required this.title});
final String title;
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: const Center(
child:
Text("Hello World"),
),
);
}
}
1. 프로그램은 main 에서 시작한다.
2. 플러터는 모두 위젯으로 이루어져있다. 위젯은 크게 스테이트풀 위젯과 스테이트리스 위젯으로 나뉜다.
3. 스테이트리스 위젯 => 상태값을 가지지 않고있다. 값이바뀌었다고 화면이 업뎃되지 않는다.
그래서 build 함수만 구현하면 되는 단순한 구조이다.
4. 스테이트풀 위젯 => 상태값을 가지고 있어서 값이 있으면 화면을 다시그리도록 되어 있다.
상태값을 가지기 위해 createState 을 구현해야 하며, createState 는 State 를 구현한 클래스와 연결된다.
5. 스테이트풀 위젯 하위의 스테이트리스 위젯은 스테이트풀위젯이 다시그려지면 같이 다시 그려진다.
6. 기본적인 앱은 위와 같은 구조가 되고 아래같이 정리할 수 있다.
main -> MyApp(Stateless) -> MyHomePage(Stateful)
-> MyHomePageState(State)
--- MaterialApp
-- Scaffold -- AppBar -- title - Text
|
-- body -- Center -- child -- Text
반응형