Programming/Flutter15 [Flutter] 개념 확장 #02 - 이벤트 처리 방식 비교 (JS vs Flutter) #02 개념 확장 - 이벤트 처리 방식 비교목차 ▲Ⅰ 이벤트 전파 방식01. 이벤트 전파 방식이란?Ⅱ 자바스크립트의 이벤트 처리 방식01. 이벤트 버블링 & 이벤트 캡처링02. 콜백 함수 전달Ⅲ Flutter의 이벤트 처리 방식01. 위젯 트리 구조Ⅳ 이벤트 처리 방식의 차이점 요약 Ⅰ 이벤트 전파 방식01. 이벤트 전파 방식이란?이벤트 전파 방식이란?이벤트 전파 방식은 특정 요소에서 발생한 이벤트가 다른 요소로 전파되는 과정이벤트 전파 방식은 두 가지 방식으로 이루어집니다. 전파 방식 설명 예시 이벤트 버블링이벤트가 자식 요소 → 부모 요소 방향으로 전파버튼 클릭 시 부모 요소까지 이벤트 전파이벤트 캡처링이벤트가 부모 요소 → 자식 요소 방향으로 전파문서 전체에서 이벤트를 감지하고 하위 요소로 전파Ⅱ .. 2025. 1. 16. [Flutter] 개념 확장 #01 - 비동기 처리 방식 비교 (JS vs Flutter) #01 개념 확장 - 비동기 처리 방식 비교목차 ▲Ⅰ 자바스크립트의 비동기 처리 방식01. 콜백 함수02. Promise03. async / awaitⅡ Dart의 비동기 처리 방식01. 콜백 함수02. Future03. async / awaitⅡ Dart의 비동기 처리 방식Ⅰ 자바스크립트의 비동기 처리 방식01. 콜백 함수콜백 함수함수의 인자로 다른 함수를 전달하고, 특정 작업이 끝난 후에 호출되는 구조장점 : 간단하게 비동기 작업을 처리할 수 있음단점 : 콜백 지옥 문제 발생 가능 / 여러 개의 비동기 작업을 중첩해 호출할 때, 가독성 및 유지 보수 문제콜백 함수 예시function fetchData(callback) { console.log("A. 데이터를 가져오는 중..."); setTimeo.. 2025. 1. 15. [Flutter] Flutter 기초 #07 - Flutter 비동기 & HTTP 통신 #07 Flutter 기초 - Flutter 비동기 & HTTP 통신목차 ▲Ⅰ 콜백 함수로 비동기 처리01. 콜백 함수Ⅱ Flutter에서 비동기 처리01. 비동기02. async & await03. FutureⅢ HTTP 통신 & DIO 패키지01. DIO02. DIO 주요 메서드03. 응답 데이터 처리Ⅰ 콜백 함수로 비동기 처리01. 콜백 함수콜백 함수란?콜백 함수(Callback Function) 란 다른 함수의 인자로 전달어떤 특정 작업이 완료된 후 특정 시점에 호출되는 함수주로 비동기 작업에서 자주 사용main 함수void main() { runApp(MyApp());}class MyApp extends StatelessWidget { const MyApp({super.key}); @ove.. 2025. 1. 14. [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. 이전 1 2 3 다음 728x90
