플러터는 구글에서 개발한 모바일 애플리케이션 프레임워크로, 크로스 플랫폼 개발을 위해 사용됩니다. 플러터의 가장 중요한 요소는 위젯입니다. 위젯은 모든 플러터 애플리케이션의 구성 요소로, 사용자 인터페이스의 부분을 나타냅니다.

위젯이란?

위젯은 플러터 애플리케이션의 UI를 구성하는 모든 요소입니다. 간단하게 말해, 버튼, 텍스트, 이미지 등 애플리케이션의 화면에 표시되는 모든 것이 위젯이라고 할 수 있습니다. 플러터는 위젯 기반의 UI 구축을 통해 애플리케이션을 간단하고 효율적으로 만들어 줍니다.

위젯 종류

플러터는 위젯을 크게 두 가지로 나눕니다: StatefulWidget과 StatelessWidget. StatelessWidget은 상태가 없는 위젯으로, 한번 그려진 후에는 변경될 수 없습니다. StatefulWidget은 상태를 가진 위젯으로, 상태가 변경되면 다시 그려집니다.

플러터 레이아웃

플러터에서는 위젯을 사용하여 레이아웃을 만듭니다. 다양한 종류의 레이아웃 위젯이 제공되며, 사용자 인터페이스를 유연하게 구성할 수 있습니다. 예를 들어, Column과 Row 위젯은 세로 또는 가로로 위젯을 정렬해 줍니다. Stack 위젯은 위젯을 겹치게 할 수 있습니다.

예제 코드

아래는 플러터에서 레이아웃을 구성하는 예제 코드입니다.

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Layout Example',
      home: Scaffold(
        appBar: AppBar(
          title: Text('Layout Example'),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Text(
                'Hello, Flutter!',
                style: TextStyle(fontSize: 24),
              ),
              SizedBox(height: 16),
              RaisedButton(
                child: Text('Click Me'),
                onPressed: () {
                  // 버튼 클릭 이벤트 처리
                },
              ),
            ],
          ),
        ),
      ),
    );
  }
}

위 코드는 플러터 애플리케이션의 기본 구조와 간단한 레이아웃을 구성하는 예제입니다. Column 위젯을 사용하여 ‘Hello, Flutter!’ 텍스트와 ‘Click Me’ 버튼이 세로로 정렬되도록 만들어졌습니다.

요약

위젯은 플러터 애플리케이션의 구성 요소로, UI를 구성합니다. StatefulWidget과 StatelessWidget을 사용하여 상태가 있는 또는 없는 위젯을 생성할 수 있습니다. 플러터는 위젯 기반의 레이아웃을 사용하여 사용자 인터페이스를 유연하게 구성할 수 있습니다.