성장 중인 개발자 이야기/Flutter
Flutter 기본 구조
cmile
2023. 6. 2. 15:34
Flutter는 단일 코드베이스에서 iOS와 Android 애플리케이션을 개발할 수 있는 크로스 플랫폼 프레임워크로 알려져 있습니다. Dart라는 프로그래밍 언어를 사용하여 개발되며, 사용자 인터페이스를 위한 위젯 기반의 개발 방식을 채택하고 있습니다.
- Flutter의 기본 구조는 다음과 같습니다:
- 위젯(Widgets): Flutter 애플리케이션은 위젯으로 구성됩니다. 위젯은 UI 요소의 조각이며, 버튼, 텍스트, 이미지 등을 포함할 수 있습니다. 위젯은 화면에 렌더링되거나 다른 위젯 내부에 포함될 수 있습니다.
- 앱(App): Flutter 애플리케이션은 최상위에 앱 위젯을 가지며, 앱 위젯은 다른 위젯들을 조합하여 전체 애플리케이션의 레이아웃과 동작을 정의합니다.
- 화면(Screen) 또는 라우트(Route): 화면은 애플리케이션에서 표시되는 개별 화면을 나타냅니다. Flutter에서는 각각의 화면을 위젯으로 구현하고, 화면 간의 전환을 위해 라우트(Route)를 사용합니다.
- 상태 관리(State Management): 상태 관리는 애플리케이션의 상태를 유지하고 변경하는 방법을 의미합니다. Flutter에서는 상태 관리를 위해 다양한 방식을 제공하며, Provider, BLoC, MobX 등의 패턴과 라이브러리를 활용할 수 있습니다.
- 레이아웃(Layout): Flutter에서는 위젯을 사용하여 화면의 레이아웃을 구성합니다. 다양한 위젯을 조합하여 컨테이너, 로우, 컬럼, 그리드 등의 레이아웃을 만들 수 있습니다.
- 이벤트 처리(Event Handling): 사용자의 입력에 대한 이벤트 처리를 위해 Flutter는 콜백 함수나 이벤트 핸들러를 사용합니다. 버튼을 누르거나 제스처를 인식하는 등의 이벤트에 대한 응답으로 애플리케이션의 동작이 변경될 수 있습니다.
Flutter를 사용하여 애플리케이션을 개발하기 위해서는 Flutter SDK를 설치하고, Dart 언어를 이해하고 작성할 수 있어야 합니다. Flutter는 다양한 플랫폼에서 동작할 수 있으며, Hot Reload 기능을 통해 실시간으로 코드 변경을 반영하여 빠르게 개발 및 테스트할 수 있습니다.
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'My First Flutter App',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(),
);
}
}
class MyHomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Home'),
),
body: Center(
child: Text(
'Hello, Flutter!',
style: TextStyle(fontSize: 24),
),
),
);
}
}
이 코드는 "Hello, Flutter!"라는 텍스트를 화면에 표시하는 간단한 앱을 생성합니다. 이 예시 코드에서는 main() 함수에서 runApp()을 호출하여 앱을 실행하고, MyApp 클래스에서 MaterialApp 위젯을 사용하여 앱의 기본 설정과 테마를 정의합니다. 그리고 MyHomePage 클래스에서 Scaffold 위젯을 사용하여 화면의 레이아웃을 구성하고, Center 위젯과 Text 위젯을 사용하여 텍스트를 화면 가운데에 정렬하여 표시합니다.
이 예시 코드는 단순한 Flutter 앱의 기본 구조를 보여주는 것이며, 필요에 따라 위젯과 속성을 추가, 수정하여 더 복잡한 앱을 개발할 수 있습니다. Flutter에서는 위젯을 조합하고, 레이아웃을 구성하며, 상태 관리 등 다양한 기능을 사용하여 원하는 애플리케이션을 만들 수 있습니다.