🦋 Flutter에서 위젯의 역할과 속성 이해하기

# Flutter에서 위젯의 역할과 속성 이해하기

**## 주요 특징**
* **위젯(Widget)**: Flutter UI의 가장 기본적인 구성 요소입니다. 모든 화면은 위젯들의 조합으로 이루어져 있습니다.
* **상속(Inheritance)**: 위젯은 다른 위젯을 상속받아 기능을 확장할 수 있습니다.
* **프로퍼티(Property)**: 위젯의 동작이나 모양을 제어하는 데 사용되는 속성입니다. 프로퍼티는 위젯의 상태를 변경하거나, 다른 위젯에 전달할 수 있는 값을 가지고 있습니다.

**## 사용법**
위젯은 두 가지 주요 방식으로 생성됩니다:
1. **직접 정의된 위젯**: `StatelessWidget` 또는 `StatefulWidget`을 상속받아 직접 만든 위젯입니다.
2. **Flutter에서 제공하는 기본 위젯**: Text, Image, Button 등 Flutter가 미리 제공하는 위젯을 활용합니다.

**코드 예제:**
```dart import 'package:flutter/material.dart';

class MyWidget extends StatelessWidget {
// 프로퍼티 정의 (선택 사항)
String title; // 기본값은 'My Widget' 입니다.

@override
Widget build(BuildContext context) {
return Column(
children: <Widget>[
Text('제목: $title'), // 프로퍼티 값을 사용합니다.
// 다른 위젯 추가 가능...
],
);
}
}

void main() {
runApp(MaterialApp(
home: Scaffold(
appBar: AppBar(title: Text('My Widget Example')),
body: MyWidget(title: 'Hello Flutter') // 프로퍼티를 전달합니다.
),
));
}
```

**설명:**
* `MyWidget`은 `StatelessWidget`을 상속받아 정의되었습니다. (상태가 변하지 않는 위젯)
* `title`이라는 프로퍼티를 정의하여 제목을 설정할 수 있습니다. 기본값은 'My Widget'입니다.
* `build()` 메서드에서 `Text` 위젯을 사용하여 제목을 표시하고, `$title`을 사용하여 프로퍼티 값을 사용합니다.
* `main()` 함수에서 `MaterialApp`을 사용하여 앱을 실행하고, `Scaffold` 내에 `MyWidget`을 배치하면서 프로퍼티를 전달합니다.

**## 주의사항**
* 프로퍼티의 타입은 반드시 위젯에서 사용할 수 있는 타입이어야 합니다. (String, int, bool 등)
* `StatelessWidget`과 `StatefulWidget`의 차이점을 이해하고 적절한 위젯을 선택해야 합니다. (상태 변화를 관리하는 방식에 따라 달라짐).
* 프로퍼티는 위젯의 동작을 제어하는 데 중요한 역할을 하므로, 프로퍼티의 이름과 타입을 명확하게 정의하는 것이 좋습니다.

**## 관련 문법과의 연관성**
* `StatelessWidget`, `StatefulWidget`: 위젯의 종류를 나타냅니다.
* `build()` 메서드: 위젯의 UI를 생성하는 메서드입니다.
* `override`: 상속받은 클래스에서 메서드의 기능을 재정의할 때 사용합니다.

```dart
import 'package:flutter/material.dart';

class MyWidget extends StatelessWidget {
 // 프로퍼티 정의 (선택 사항)
 String title; // 기본값은 'My Widget' 입니다.

 @override
 Widget build(BuildContext context) {
 return Column(
 children: <Widget>[
 Text('제목: $title'), // 프로퍼티 값을 사용합니다.
 // 다른 위젯 추가 가능...
 ],
 );
 }
}

void main() {
 runApp(MaterialApp(
 home: Scaffold(
 appBar: AppBar(title: Text('My Widget Example')),
 body: MyWidget(title: 'Hello Flutter') // 프로퍼티를 전달합니다.
 ),
 ));
}
```