본문 바로가기

전체 글47

Flutter Widget: Positioned vs Align 비교 분석 Flutter에서 위젯을 정확하게 배치하는 것은 중요한 작업입니다. Positioned와 Align 위젯은 컨테이너 내에서 위젯 위치를 조절하는 데 사용되는 두 가지 주요 위젯입니다. 이 글에서는 두 위젯의 기능과 차이점을 심층적으로 분석하고 실제 코드 예시를 통해 이해를 돕겠습니다. 1. Positioned 위젯 Positioned 위젯은 컨테이너 내에서 위젯을 상대적인 위치에 배치하는 데 사용됩니다. 왼쪽, 오른쪽, 위쪽, 아래쪽 여백을 사용하여 위젯 위치를 조절할 수 있습니다. 주요 특징: 컨테이너 내 위젯을 상대적인 위치에 배치 왼쪽, 오른쪽, 위쪽, 아래쪽 여백 설정 가능 left, top, right, bottom 속성을 사용하여 위치 조절 Stack 위젯과 함께 사용하여 위젯 중첩 가능 St.. 2024. 3. 6.
Flutter Widget: Expanded vs Flexible 비교 분석 Flutter에서 위젯을 동적으로 배치하는 것은 중요한 작업입니다. Expanded와 Flexible 위젯은 컨테이너 내에서 위젯 크기를 조절하는 데 사용되는 두 가지 주요 위젯입니다. 이 글에서는 두 위젯의 기능과 차이점을 심층적으로 분석하고 실제 코드 예시를 통해 이해를 돕겠습니다. 1. Expanded 위젯 Expanded 위젯은 컨테이너의 남은 공간을 가능한 한 채우도록 위젯을 확장합니다. 즉, 컨테이너 내 다른 위젯의 크기에 따라 확장되거나 축소될 수 있습니다. 주요 특징: 컨테이너의 남은 공간을 채우도록 위젯을 확장 다른 위젯과 함께 사용하여 컨테이너 내 공간을 효율적으로 활용 flex 속성을 사용하여 상대적인 크기 설정 가능 Row( children: [ Expanded( child: Tex.. 2024. 3. 6.
Flutter 앱 디자인 테마 고급 설정: ThemeData() 파라미터 심층 분석 이번 글에서는 앱 디자인 테마를 보다 세밀하게 설정할 수 있는 ThemeData 객체의 핵심 파라미터 3가지, 즉 colorScheme, bottomNavigationBarTheme, useMaterial3에 대해 심층적으로 분석하고 실제 코드 예시를 통해 이해를 돕겠습니다. 1. colorScheme: 앱의 색상 체계 설정 colorScheme 파라미터는 앱에서 사용되는 다양한 색상을 정의하는 데 사용됩니다. 기본 색상 뿐만 아니라 다양한 상태에 따라 사용되는 색상을 설정할 수 있습니다. 주요 속성: primary: 앱의 주요 색상 onPrimary: 주요 색상 위에 표시되는 텍스트 색상 secondary: 앱의 보조 색상 onSecondary: 보조 색상 위에 표시되는 텍스트 색상 error: 오류 .. 2024. 3. 6.
Flutter에서 MaterialApp() 위젯 이해하기 Flutter 앱 개발에서 UI를 구성하는 중요한 위젯 중 하나는 MaterialApp 위젯입니다. 이 위젯은 Flutter에서 제공하는 기본적인 디자인 체계를 기반으로 앱의 UI를 구현하는 데 사용됩니다. 이 글에서는 MaterialApp 위젯의 역할과 주요 파라미터에 대해 자세히 살펴보고, 실제 코드 예시를 통해 이해를 돕겠습니다. 1. MaterialApp() 위젯의 역할 MaterialApp 위젯은 다음과 같은 역할을 수행합니다. 앱의 기본 디자인 체계 설정: 기본적인 색상, 폰트, 위젯 스타일 등을 설정합니다. 앱의 라우팅 관리: 앱 내 여러 화면 간의 이동을 관리합니다. 앱의 위젯 트리 루트 설정: 앱의 UI를 구성하는 위젯 트리의 루트 위젯 역할을 합니다. 2. MaterialApp() 위젯.. 2024. 3. 6.