Thread2 [Flutter 트랙] 앱개발 종합반 2-16 - 스레드 위젯 구성해보기 이번 시간에는 스레드 앱의 위젯을 구성하는 방법을 학습합니다. 지난 시간에 구상한 대로 화면을 구성하고, 레이아웃을 조정하면서 원하는 UI를 완성합니다.1. 프로젝트 생성 및 초기화터미널을 사용하여 프로젝트 생성.lib 폴더 내에 home.dart 파일을 추가하고, 홈 화면을 구성할 준비.필요한 이미지 파일을 assets 폴더에 추가하고 pubspec.yaml에 등록.flutter create thread_appcd thread_appcode .2. 테마 및 에뮬레이터 설정전체적인 스타일을 설정하기 위해 ThemeData를 적용.다크 모드를 기본값으로 설정.MaterialApp( theme: ThemeData( scaffoldBackgroundColor: Colors.black, textTh.. 2025. 3. 5. [Flutter 트랙] 앱개발 종합반 2-13 - 대표적인 위젯 분석 이번 시간에는 대표적인 앱 화면을 플러터 위젯으로 해석하는 방법에 대해 살펴보겠습니다.대중적인 앱들은 사용자 경험(UX)과 UI 설계에 많은 고민이 반영된 결과물입니다. 이러한 앱의 화면을 플러터로 구현할 수 있도록 분석하는 연습을 진행하겠습니다.1. 틱톡(TikTok) UI 분석틱톡의 메인 화면은 다음과 같은 요소로 구성됩니다:페이지 뷰(PageView): 위아래로 스와이프하여 동영상을 전환.AppBar: 상단의 고정된 팔로잉/추천 탭과 검색 아이콘.Row: 상단의 팔로잉과 추천 메뉴는 가로 정렬.GestureDetector: 탭 메뉴를 클릭할 수 있도록 설정.Stack & Positioned: 화면 위에 겹쳐진 요소(좋아요, 댓글, 공유 버튼 등).Column: 동영상 설명과 사용자 정보 정렬.Pag.. 2025. 3. 5. 이전 1 다음