[플러터] StatelessWidget 완벽 가이드

소요 시간: 2분 조회수: 128

Flutter 애플리케이션 개발을 시작할 때 가장 기본적인 개념 중 하나는 StatelessWidget입니다. 이 글에서는 StatelessWidget의 정의와 역할, 그리고 기본적인 사용 방법에 대해 알아보겠습니다.


StatelessWidget이란?

StatelessWidget은 상태(state)가 변하지 않는 위젯을 의미합니다. 한 번 생성되면 그 UI는 변경되지 않으며, Flutter 애플리케이션의 런타임 중에 상태를 변경할 수 없습니다. 보다 엄밀히 말하자면, StatelessWidget은 특정 상태에 의존하지 않고, 그 상태가 변경되더라도 해당 위젯 자체는 변하지 않습니다.

상태란 무엇인가?

상태는 위젯이 빌드될 때 동기적으로 읽을 수 있는 정보입니다. 이 상태는 위젯의 수명 주기 동안 변경되거나 동일하게 유지되는 경향이 있습니다. 예를 들어, 사용자가 버튼을 클릭하거나 입력 필드에 텍스트를 입력하면 상태가 변경될 수 있습니다. 하지만 StatelessWidget은 이러한 상태 변화를 반영하지 않습니다.


StatelessWidget의 기본 구조

StatelessWidget을 사용하기 위해서는 Flutter 프레임워크의 StatelessWidget 클래스를 상속받아야 합니다. 가장 기본적인 구조는 다음과 같습니다:

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container();
  }
}

이 구조는 매우 단순하며, build 메서드를 통해 위젯의 UI를 정의합니다. 이 예제에서는 빈 Container 위젯을 반환하고 있습니다.


실제 예제 코드

다음은 Flutter에서 StatelessWidget을 사용하는 간단한 예제입니다. 이 예제에서는 "Hello, World!"라는 텍스트를 화면 중앙에 표시합니다:

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      home: Scaffold(
          body: Center(
        child: Text('Hello, World!'),
      )),
    );
  }
}

코드 설명

  1. main 함수는 Flutter 애플리케이션의 시작점입니다. 여기서 runApp 함수는 MyApp 위젯을 실행합니다.
  2. MyApp 클래스는 StatelessWidget을 상속받아 정의됩니다. const 키워드를 사용하여 불변 객체임을 명시합니다.
  3. build 메서드는 위젯 트리를 구성합니다. 이 예제에서는 MaterialApp을 루트 위젯으로 사용하고, Scaffold를 통해 기본적인 화면 구조를 잡습니다.
  4. Scaffold의 body 속성에는 Center 위젯을 사용하여 Text 위젯을 화면 중앙에 배치합니다.

이 예제를 통해, StatelessWidget이 어떻게 동작하는지, 그리고 어떻게 사용되는지 이해할 수 있습니다.


결론

StatelessWidget은 Flutter에서 상태를 가지지 않는 위젯을 정의할 때 사용됩니다. 상태 변화에 영향을 받지 않기 때문에, 주로 고정된 UI 요소를 표시할 때 유용합니다. 이 글을 통해 StatelessWidget의 기본 개념과 사용 방법을 이해하고, Flutter 애플리케이션 개발에 도움이 되길 바랍니다.

인기글

플러터 리스트