kahnco

Flutter로 위젯을 구현하다보면 아무것도 없는 빈 위젯을 사용해야할 때가 종종 있습니다. 예를 들면, 네트워크 통신을 통해서 데이터를 가지고 올 때에 보통 다음과 같은 상태값을 가집니다. Idle (유휴값, 보통은 초기값) Loading (네트워크 통신할 때의 값) Success (네트워크 통신 성공) Failure (네트워크 통신 실패) 이럴 때에, Idle 값으로 사용하는 위젯은 보통 Container 아니면 SizedBox 입니다. 그런데, 문득 저 두 개의 값 중에서 빌드 속도가 가장 빠른 것은 무엇일까? 라는 궁금증이 들었습니다. 간단한 Flutter 프로젝트를 생성해서 위젯 테스트를 진행해보면서 확인해보겠습니다. 테스트에서 비교할 위젯은 총 3개입니다. Container SizedBox S..

Flutter로 프로젝트를 진행하다가, 문의하기 채널로써 채널톡을 활용하게 되었습니다. 단순히 채널톡 버튼을 띄우는 것은 어렵지 않았지만, 파일 업로드 부분에서 어려움을 겪었기 때문에 이 글을 보시는 분들은 저랑 같은 어려움을 겪지 않길 바라는 마음에서 이 글을 작성합니다. 채널톡은 Android, iOS, Javascript, React Native를 지원하기 때문에 공식적으로는 Flutter를 지원하지 않습니다. 따라서, Android, iOS를 각각 설정해준 다음 methodChannel을 통해서 Flutter와 Native 단의 통신을 설정해줘야합니다. 하지만 이 부분은 난이도가 높고, 시간이 많이 걸리는 작업이기 때문에 저는 React를 활용해서 웹페이지에 채널톡 버튼을 구현하고 이를 Flutt..

이번 게시글에서는 Flutter에서 Firebase 및 환경변수를 debug, release 모드 별로 빌드할 수 있는 방법에 대해서 서술해보겠습니다. Fastlane과 같은 베포 파이프라인을 활용하는 방식이 아닌, Shell 코드를 통해서 직접 파일을 변경해주는 방식으로 진행해보겠습니다. 위와 같은 방법을 사용하는 이유는 iOS 설정에서 build flavor에 따른 각각 다른 Firebase 세팅을 해주는 것이 상당히 난이도가 높기 때문입니다. 0. 사전 세팅 본론으로 돌아와서, 먼저 FlutterFire를 설치해보도록 하겠습니다. FlutterFire는 Flutter Plugin들로 이루어진 라이브러리로써, Flutter Application과 Firebase 프로젝트를 손쉽게 연동시켜줄 수 있습니..

Flutter에서 CheckBox를 구현하다보면, 선택되지 않은 상태에서의 내부 색상을 변경하고 싶을 때가 있습니다. 이런 경우에 다른 Widget들 처럼, MaterialState 상태를 분기시켜서 selected 되지 않은 상태일 때에 원하는 값을 넣으면 될 것처럼 보입니다. 코드로 구현해보면, Checkbox( fillColor: MaterialStateProperty.resolveWith(setCheckBoxColorState), value: isChecked, onChanged: (value) {}, ); ... Color? setCheckBoxColorState(Set states) { if (states.contains(MaterialState.selected)) { return Colors..

이 글은 Flutter Library 중에서, flutter_clean_architecture에 대해서 설명하는 글입니다. 소개 Uncle Bob의 책과 블로그를 기반으로 한 아키텍처입니다. Onion 아키텍처와 다른 아키텍처에서 가져온 개념의 조합입니다. 아키텍처의 주요 초점은 관심사의 분리와 확장성입니다. App, Domain, Data, Device 이렇게 네 가지 주요 모듈로 구성됩니다. 종속성 규칙 소스 코드 종속성은 그 방향이 내부로만 향합니다. 즉 내부 모듈은 외부 모듈을 인식하지도 종속되지도 않습니다. 그러나 외부 모듈은 내부 모듈을 인식하고 의존합니다. 외부 모듈은 비즈니스 규칙 및 정책(내부 모듈)이 작동하는 메커니즘을 나타냅니다. 더 많이 안으로 들어갈수록 더 많은 추상화가 나타납니다..