Flutter 18

[Flutter] Flutter 3.7.x에서 발생하는 flutter_staggered_grid_view LateInitializationError 수정하기

최초작성일: 2023년 4월 5일 이번에 플러터 버전을 업데이트하면서 새로운 에러들을 확인하고 있다. 그 중 LateInitializationError는 에러가 발생하는 위젯/하위 위젯 모두 late나 nullable로 선언된 변수가 없어서 왜 발생하는지 알 수가 없었다. LateInitializationError: Field '_children@25042623' has not been initialized. 플러터와 패키지 버전을 올린 이후에 발생한 문제라서 패키지에서 발생한 문제인지 의심했고, 에러 로그에서 문제가 되는 패키지의 경로를 확인할 수 있었다!! 그래서 구글링 결과, 해당 패키지 깃헙에서 이슈를 확인할 수 있었다. 해결 방법은 다음과 같다! (출처) @override Widg..

앱/Flutter 2023.08.28

[Flutter] Sliver에서 Expanded처럼 나머지 공간 차지하게 하기 : SliverFillRemaining

최초작성일: 2023년 1월 16일 0. Slivers 안에서 Expanded가 사용하고 싶었다. 앱에서 현재 사용하고 있는 공통 Layout widget을 사용해야 했고, 또CustomScrollView를 사용하고 있기 때문에 반드시 Sliver를 사용해서 ui를 그려야 했다. 내가 그리고 싶었던 것은 데이터가 없는 경우에 화면 중앙에 다른 위젯을 그려주는 것이었다. 정리를 해보면, 데이터가 있는 경우 : 스크롤 위젯 => SliverList 데이터가 없는 경우 : 스크롤X 위젯 => ?? 이런 상황이었다. 1. SliverToBoxAdapter를 사용하기 플러터에서 ui를 그릴 때 남은 공간을 모두 차지하게 하기위해 Expanded를 자주 사용하게 된다. (구체적인 예제는 공식문서 : Expanded..

앱/Flutter 2023.08.08

[2023년 2분기] 건강은 챙기면서 하기 feat.사이드 프로젝트

최초작성일: 2023년 6월 19일 아직 2분기는 끝나지 않았지만 사이드 프로젝트도 배포했고, 당분간은 정말로 쉬는게 필요하다고 생각해서 회고 글을 쓰기 시작한다. 2분기는 사이드 프로젝트가 가장 큰 이슈였다. 1. 사이드 프로젝트 3월부터 본격적으로 사이드 프로젝트를 진행하고 있다. 기존 팀에 합류하게 되었는데, 가장 큰 목표는 Flutter로 앱을 개편해서 배포하는 일이었다. 어차피 새로 만드는거 ui/ux도 개선하고, 에러도 수정하고, 몇 가지 기능도 추가하게 되었다.(이렇게 쓰고 보니 생각보다 더 많은 걸 했구나...) > - 기존의 RN앱을 Flutter로 바꾸기 - 기능 추가 : 회원 탈퇴, 앱 다국어 적용 - ui/ux 개편 - 에러 수정 배포 기한은 처음 작업을 시작할 때 2~3달 정도 잡..

회고 2023.07.20

[Flutter] iOS의 scroll to top 기능은 어떻게 구현되어 있는가 (feat. 안될 때 확인해볼 것!)

최초작성일 : 2022년 11월 12일 1. ios의 scroll to top 기능이 flutter에서 어떻게 구현되어 있는가 1. Scaffold 안드로이드와 달리 ios에서는 화면 상단에 있는 status bar를 누르면 가장 위로 화면이 스크롤되는 기능이 있다. flutter에서는 특별하게 이 기능을 구현하지 않아도 ios에서는 적용이 되는데, 그 이유는 `Scaffold`에 해당 기능이 구현되어 있기 때문이다. class Scaffold extends StatefulWidget { ... void _handleStatusBarTap() { final ScrollController? primaryScrollController = PrimaryScrollController.of(context); if..

앱/Flutter 2023.07.18

[2023년 1분기] 그래서 뭐할건데? feat. riverpod vs bloc

최초 작성일 : 2023.04.13 나름 파란만장한 1분기를 보냈다. 정신없는 와중에 그래도 한번 정리하는 시간이 필요할 것 같아서 오랜만에 회고 글을 쓴다. 1. 난 뭘했는가 1분기동안 큰 이슈는 다음과 같다. - 회사 일 - 사이드 프로젝트 - ios 공부 1) 회사 일은 회사일이다. 벌써 회사에서 일한지 반년이 지났다. 그 사이에 신규 서비스를 (가)오픈하고, 기획이 엄청나게 바뀌면서 날리고 새로 만든 것도 많고 수정도 많이 했다. 그리고 얼마전에 드디어 정식 오픈!!!!(광고가 나가기 시작했다) 물론 지금도 수정 예정인 부분들이 많은데, 좋은 방향으로 개선되고 있는 것 같아서 기대가 된다. 한참 일이 몰아치다가 약간 쉬어가는 템포가 반복되고 있다. 정작 일이 많을 때는 '와 일이 너무 많아......

회고 2023.07.16

[2022년 8-11월] Spring에서 플러터 개발자로

최초작성일: 2022년 12월 3일 0. 시작하며 8월에 이직을 하고 플러터 개발을 시작하면서 여러가지 재미있는 경험을 많이 하게 되었고, 최근에는 앞으로의 방향성에 대해 고민도 많았다. 최근에 회고를 거의 못하기도 했고, 새로운 블로그로 이사하면서 한 번 정리를 하고 가면 좋을 것 같아서 회고글을 작성하게 되었다. 1. 이직 올해 1월, 개발을 해보고 싶어서 부트캠프를 시작하게 되었고, Spring으로 서버 개발을 공부하고 5월에 취업을 하게 되었다. 이미 어느정도 자리를 잡은 안정적인 회사였고, 인터뷰도 굉장히 인상적이었다. 그렇지만 3개월만에 이직을 하게 되었다. 인터뷰에 들어온 개발자들은 클린코드를 추구하고 있었고, 에자일 등 개발 프로세스나 개발 환경에도 관심이 많았다. 그렇지만 입사를 하고 나..

회고 2023.07.16

[Flutter] 특정 스크린을 보고 있는지 확인하기(with WidgetsBindingObserver visibility_detector)

0. 문제 상황 유저가 특정 스크린을 다시 볼 때 마다 데이터를 업데이트를 하는 기능을 추가하게 되었다. 구체적으로 데이터가 업데이트되는 상황은 다음과 같다. 1. 유저가 다른 스크린에 갔다가 다시 해당 스크린으로 돌아올 때 2. 유저가 해당 스크린에서 앱 바깥으로 나갔다가(background) 다시 앱으로 돌아왔을 때(foreground)` 이 기능을 구현하기 위해서는 먼저, 유저가 현재 해당 스크린을 보고 있다는 걸 확인해야 한다. WidgetsBindingObserver와 visibility_detector를 사용해서 구현하였다. 1. WidgetsBindingObserver 공식문서 WidgetsBindingObserver은 mixin으로 사용하며, initState와 dispose에서 obser..

앱/Flutter 2023.07.16

20220920-21 TIL #비즈니스 로직은 분리 #레이어를 나누자 #Repository pattern

이번주 초까지 급하게 끝내야 하는 일정이 있어서 코드리뷰를 못하다가, 약간 시간이 생긴 오늘 코드리뷰를 했다. 평소에도 궁금한건 물어보면서 진행했지만, 오늘 리뷰하면서 전체적으로 우리 앱의 아키텍처에 대해서도 다시 설명을 해주셨다. 마침 오늘 아침에 서버 연동 부분을 보면서 어떤 레이어 구조로 나눠져 있는지, 각각 어떤 역할을 하는지 다시 살펴보았고, 계속 업무를 하면서 처음보다는 이해가 된 부분도 있고 궁금해진 점도 있어서, 2시간 가까이 얘기하면서 많은 부분이 정리되었다. 최근에 가장 큰 고민은 비즈니스 로직을 어디에 구현해야하는지, 였다. 우리 패키지 구조에서 이미 ui와 feature는 구분을 하고 있고, 위젯을 만들면서도 계속 위젯에는 로직이 들어가지 않게 분리하려고 했다. ui와 비즈니스 로..

회고 2022.09.21

20220915-16 TIL #Tabbar #scroll #차트만들기 #provider

새로운 페이지 작업을 하게 되었는데, tabbar, scroll, 차트 기능이 포함되어 있다. Tabbar + scroll Tab을 이용해서, Tab마다 다른 화면을 그릴 수 있다. https://docs.flutter.dev/cookbook/design/tabs Work with tabs How to implement tabs in a layout. docs.flutter.dev Tabbar는 Appbar의 bottom으로 구현할 수도 있고, Appbar가 아니라 Scaffold의 body 안에도 구현할 수 있다. 처음에는 Appbar에 bottom에 DefaultTabController를 이용해서 구현하고, Scaffold body에 TabBarView를 구현하였다. 그런데 TabBar와 TabBa..

회고 2022.09.19

20220907-08 TIL #ui작업하기 #위젯 #비즈니스로직분리하기

처음 업무를 받은 날, 재택을 하다보니 여러가지 궁금한 점이 많았다. 슬렉으로 계속 질문하면서 업무를 했지만, 아직 업무 코드 파악이 덜 된 부분도 많았고 플러터는 처음 하다보니 어떤 방식으로 업무를 해야하는지도 아직 감이 오지 않았다. 우선 비교적 간단한 페이지 UI를 작업하기로 했는데, 위젯(컴포넌트)만 하더라도 새로 만드는게 좋은지, 기존에 만들어진 위젯을 사용하는게 좋은지 판단이 잘 되지 않았다. 출근해서 업무를 하면서 사수와 이런 고민들을 같이 얘기하면서 알고보니 컴포넌트화 되있는 위젯 버튼이 있는 경우도 있었고, 기존에 만들어져있는 컴포넌트에서 required parameter 하나를 그냥 empty string을 넣고 사용하는게 낫겠다고 판단이 되는 경우도 있었다. 또, 기존 컴포넌트를 사용..

회고 2022.09.13