[TIL] flutter - TODO APP 찐막

김영광·2025년 12월 22일

오늘 드디어 필수 과제를 마쳤다.
도전 기능도 일부분은 완료했고, 나머지는 내일 해볼 에정이다.
엄청 어려운 과제는 아니지만, 이 안에서도 배울 수 있던 부분이 많아서 좋았다.

📝 Provider를 공부하며..

ToDo 앱 개발 소식을 듣고 상태 관리 라이브러리를 사용해 앱을 개발해봐야겠다는 생각이 가장 먼저 들었다.
compose를 역할분리에 대해 공부하며 느꼈던 부분이 있었기에, 한발자국이라도 더 먼저 익숙해지고 싶은 마음이었다.

Provider는 객체 하나를 root 지정한 뒤, 이 객체를 통해 전역 상태를 관리한다.
이것이 viewModel과의 가장 큰 차이점이라고 볼 수 있다.
Provider 역시 여러개가 생길 수 있는데, 이는 MultiProvider를 통해 한번에 등록할 수 있다.
얼마나 간편한가?

또, Provider는 watch/read, Consumer, Select 등을 통해 상태의 변화를 rebuild하거나 하지 않거나 직접 선택할 수 있다.
Moblie 환경에서는 UI Thread가 가장 우선적으로 쓰이기에, 이는 메모리 효율성에서 큰 이점이 있는 것 같다.

이후, 계획한대로 riverpod, BLOC, GetX를 통해 다시 한번 같은 앱을 구현해봐야겠다.

📝 Navigator

navigator는 Page간의 이동을 Stack 구조로 관리한다.
간결한 이동은 push와 pop만으로 가능하지만, 데이터가 오고 갈 때는 추가적인 조건들이 붙는다.

먼저, Navigator가 동작하는 과정에 대해 알아봤다.
Stack에 페이지를 쌓기 위해(페이지 이동을 위해) Navigator.push(context)를 호출하면, 가장 먼저 전달된 context를 기준으로 위젯 트리를 올라가며 NavigatorState를 찾는다.
대부분의 경우 MaterialApp을 사용할텐데, 해당 위젯은 Navigator가 내장되어 있다.

이후, 이동할 페이지를 바로 스택에 쌓는것이 아니라 Route 객체로 감싸서 준비한다.
Route객체는 주로 MaterialRoute가 사용되며, 단순 화면을 보여주는 것을 넘어 페이지 전환 애니메이션, 뒤로가기 스와이프, 배경 오버레이 등의 설정도 담고 있다.

이제 스택에 Route를 push한다.
이전 페이지는 비활성화 상태가 되고, 새로운 페이지가 활성 상태가 된다.
Ticker에 의해 그림이 그려지기 시작한다.

Android는 화면전환 기본 애니메이션으로 페이드인 효과를 가지고 있으며, iOS는 왼쪽에서 오른쪽으로 슬라이드 된다.

반대로 pop은 Stack에서 dispose되며, 애니메이션이 반대로 실행된다.

profile
주니어 개발자

0개의 댓글