플러터의 주요 특징

1. 단일 코드베이스: 하나의 코드베이스로 여러 플랫폼(iOS, Android, 웹, 데스크탑)에서 애플리케이션을 실행할 수 있습니다.
2. 위젯 중심 아키텍처: 모든 것이 위젯입니다. 위젯은 플러터의 기본 구성 요소이며, 복잡한 UI를 쉽게 만들 수 있게 합니다.
3. 핫 리로드(Hot Reload): 코드 수정 후 즉시 결과를 확인할 수 있어 빠른 개발 사이클을 지원합니다.
4. 빠른 성능: 네이티브 컴파일과 하드웨어 가속을 통해 높은 성능을 제공합니다.

간단한 예제 코드

import 'package:flutter/material.dart';

// 앱의 진입점 함수로, MyApp 위젯을 실행합니다.
void main() {
  runApp(MyApp());
}

// MyApp 클래스는 StatelessWidget을 상속받아 불변 상태의 위젯을 정의합니다.
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // MaterialApp 위젯은 앱의 기본 구조와 테마를 설정합니다.
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

// MyHomePage 클래스는 StatefulWidget을 상속받아 상태를 가질 수 있는 위젯을 정의합니다.
class MyHomePage extends StatefulWidget {
  MyHomePage({Key? key, required this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

// _MyHomePageState 클래스는 MyHomePage의 상태를 관리합니다.
class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  // _incrementCounter 메서드는 _counter 변수를 증가시키고 상태를 갱신합니다.
  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    // Scaffold 위젯은 기본적인 화면 레이아웃을 구성합니다.
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.headline4,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ),
    );
  }
}

코드 설명

• main 함수는 앱의 진입점으로, MyApp 위젯을 실행합니다.
• MyApp 클래스는 StatelessWidget을 상속받아 불변 상태의 위젯을 정의합니다. MaterialApp 위젯을 반환하여 앱의 기본 구조와 테마를 설정합니다.
• MyHomePage 클래스는 StatefulWidget을 상속받아 상태를 가질 수 있는 위젯을 정의합니다. _MyHomePageState 클래스는 MyHomePage의 상태를 관리합니다.
• _incrementCounter 메서드는 _counter 변수를 증가시키고, setState를 호출하여 상태를 갱신합니다.
• Scaffold 위젯은 기본적인 화면 레이아웃을 구성하며, AppBar, Center, Column 위젯을 사용하여 UI를 배치합니다.
• FloatingActionButton 위젯은 플로팅 액션 버튼을 생성하며, 버튼이 눌릴 때 _incrementCounter 메서드를 호출합니다.

기본 위젯 4가지

• 글자 위젯
• 이미지 위젯