전체 글37 [Flutter] Flutter 기초 #06 - StatefulWidget #06 Flutter 기초 - StatefulWidget목차 ▲Ⅰ StatefulWidget & StatelessWidget01. StatefulWidget02. StatelessWidget03. StatefulWidget이 필요한 이유Ⅱ StatefulWidget 예제Ⅰ StatefulWidget & StatelessWidget01. StatefulWidgetStatefulWidget (동적인 위젯)상태가 변경될 수 있는 위젯을 만들 때 사용상태가 변경될 때마다 setState()를 호출하여 UI를 다시 빌드주로 버튼 클릭, 텍스트 입력, API 호출 등과 같이 상호작용에 따라 UI가 변경되는 경우 사용class MyStatefulWidget extends StatefulWidget { @overri.. 2025. 1. 14. [Flutter] Flutter 기초 #05 - 로그인 페이지 구현 #05 Flutter 기초 - 로그인 페이지 구현목차 ▲Ⅰ 로그인 페이지 구성 요소01. MaterialApp의 속성02. Navigator03. Form & TextFormField04. GlobalKey & FormStateⅡ 로그인 화면 예제01. 페이지 생성 및 main 함수 세팅02. 로그인 페이지 사용자 입력 필드 구현03. 로그인 버튼 구현 및 페이지 이동 Ⅱ 로그인 페이지 구성 요소01. MaterialApp의 속성initialRoute앱 실행 시 초기 화면을 설정하는 속성초기 페이지를 문자열 경로로 지정routes앱 내의 화면 경로와 해당 위젯을 매핑key-value 쌍으로 구성된 Map 형태각 경로는 문자열 키로 설정, 해당 경로에 표시될 페이지를 위젯 생성 함수로 설정Material.. 2025. 1. 14. [Flutter] Flutter 기초 #04 - 탭 네비게이션 #04 Flutter 기초 - 탭 네비게이션목차 ▲Ⅰ 탭 네비게이션01. 탭 네비게이션이란?02. TabBar03. Tab04. TabBarView05. TabControllerⅡ TabBar와 TabView의 작동 원리 정리 Ⅰ 탭 네비게이션01. 탭 네비게이션이란?탭 네비게이션이란?한 페이지에서 여러개의 화면을 제어하기 위해 사용하는 위젯버튼을 누르거나 스와이프를 통해 화면을 제어할 수 있음Flutter에서 탭 네비게이션을 구현하기 위해서는 아래의 위젯을 연결하여 사용TabBar : 탭 버튼 목록을 생성Tab : 개별 탭 버튼을 정의TabBarView : 탭과 연결된 컨텐츠 화면을 표시TabController : TabBar와 TabBarView를 연결하고 제어02. TabBarTabBar탭 버튼 목.. 2025. 1. 13. [Flutter] Flutter 기초 #03 - Flutter 스크롤 위젯 #03 Flutter 기초 - Flutter 스크롤 위젯목차 ▲Ⅰ Flutter 스크롤 위젯01. ListView02. ListTile03. GridView04. PageViewⅠ Flutter 스크롤 위젯01. ListViewListViewFlutter에서 스크롤 가능한 리스트 뷰를 생성하는 위젯무한 스크롤 리스트나 동적 리스트를 구성할 때 유용주요 생성자ListView() : 리스트 아이템을 직접 추가하는 일반적인 방식ListView.builder() : 동적 리스트 생성에 사용, 아이템을 효율적으로 랜더링ListView.separated() : 아이템 사이에 구분선을 추가할 때 사용ListView( children: [ ListTile( leading: Icon(Icons.perso.. 2025. 1. 11. [Flutter] Flutter 기초 #02 - Flutter 기본 위젯 #02 Flutter 기초 - Flutter 기본 위젯목차 ▲Ⅰ 앱 기본 구조 및 레이아웃 위젯01. MaterialApp()02. SafeArea()03. Scaffold()Ⅱ 레이아웃 배치 위젯01. Row()02. Column()Ⅲ 콘텐츠 위젯01. Text()02. Image()Ⅳ 공간 및 크기 조절 위젯01. Spacer()02. SizedBox()Ⅰ 앱 기본 구조 및 레이아웃 위젯01. MaterialApp()MaterialApp()Flutter 앱의 시작점이 되는 위젯으로, 앱의 전반적인 구조와 테마를 관리앱에서 사용되는 라우트 설정, 테마, 로케일, 네비게이션 등을 정의주요 속성home : 앱 실행 시 가장 먼저 표시할 화면을 지정theme : 앱의 전체적인 테마(색상, 스타일)를 설정ro.. 2025. 1. 9. [Flutter] Flutter 기초 #01 - UI 디자인 원리 & 선언적 UI 구성 #01 Flutter 기초 - UI 디자인 원리 & 선언적 UI 구성목차 ▲Ⅰ Flutter의 UI 디자인 원리01. Flutter의 디자인 원리 핵심 개념02. Flutter UI의 주요 특징03. 위젯 트리 구조의 이해04. Flutter 디자인 원리의 장점Ⅱ Flutter의 선언적 UI 구성01. 선언형 UI란?02. 선언형 UI & 명령형 UI03. Flutter가 선언형 UI를 채택한 이유Ⅰ Flutter의 UI 디자인 원리01. Flutter 디자인 원리의 핵심Flutter는 위젯 기반의 UI 프레임워크로, 모든 UI 요소를 위젯으로 표현Flutter에서는 ' 모든 것이 위젯이다' 라는 철학을 바탕으로 디자인이 이루어짐버튼, 텍스트 이미지뿐만 아니라 레이아웃, 화면 구성 요소까지 모두 위젯 형.. 2025. 1. 8. 이전 1 2 3 4 5 6 7 다음 728x90
