🐦 Flutter 23

[Flutter] Sliver TabBarView hide 이슈

위에 컨텐츠들이 있고 하단에 탭이 있다고 가정하자. 스크롤 시에는 탭이 상단에 고정되어 있어야 한다. 이 경우, 위젯을 어떻게 구성할 수 있을까? Flutter 공식문서에서는 위와 같은 뷰는 NestedScrollView 클래스 를 통해 구성하라고 한다. NestedScrollView 클래스 The most common use case for this widget is a scrollable view with a flexible SliverAppBar containing a TabBar in the header (built by headerSliverBuilder, and with a TabBarView in the body, such that the scrollable view's contents va..

🐦 Flutter 2024.03.31

Flutter NavigationController 에서 iOS 로 이동(push)해보기

Flutter 로 개발하면서 어려웠던 점은 Native SDK 연동을 해야했던 부분인데 보통 SDK 연동 문서를 보면 안드로이드, iOS 연동 방법만 적혀 있고 React native 나 Flutter 개발자를 위한 연동 방법은 적혀있지 않다. (따라서 일단 SDK 를 호출하는 부분까지는 업체의 문서를 보며 네이티브 코드를 작성해야 하고, Flutter 에서는 MethodChannel 메서드를 써서 이를 연결시켜줘야 한다.) 그래서 문서를 보고 연동하려면 네이티브 지식을 어느 정도 갖고 있으면 수월한 편인데 6개월 전에 나는 iOS 공부를 하지 않았던 상태였다. 어느 날, 회사 업무에서 다른 업체의 iOS SDK 를 연동하며 아래 메시지를 받았고 이게 무슨 뜻인지 이해하지 못했다. *****View.Ge..

🐦 Flutter 2024.01.13

Debounce, Throttle

오늘은 프론트 개발자라면 중요한 개념인 Debounce, Throttle 에 대해서 좀 더 파헤쳐 보려고 한다. 서버에 사용자의 요청을 적절히 전달하는 것은 프론트엔드 개발자의 중요한 역할 중 하나라고 생각한다. 실제 상황에서 많이 발생하는 일 중 하나가 있는데 사용자가 버튼을 누를 때 단 한 번의 요청을 의도했음에도 불구하고, 그 요청을 실행 중이었는데 사용자는 실행 중인지 몰라 버튼을 또 누르게 되는 경우가 있다. (이거 왜 반응을 안 하는거야..?! 이러면서..) 이때 모든 요청을 곧이 곧대로 서버에 보내게 되면 서버는 이 요청을 모두 처리해 사용자는 예상치 못한 문제를 겪게 된다. 개발하면서 생각보다 이런 일들이 많이 발생하는데 그 중 하나의 방어책이 바로 로딩 표시를 버튼 위에 덮어씌워 사용자가..

🐦 Flutter 2023.12.09

[Flutter] InheritedWidget 에 대한 고찰 1 - BuildContext.dependentOnInhheritedWidgetOfExactType

Flutter 의 InheritedWidget 에 대해 알아보기 전에 BuildContext.dependentOnInhheritedWidgetOfExactType 에 대해 이해하는 것이 중요하다. 플러터 공식 문서에도 InheritedWidget 의 설명을 보면 BuildContext.dependentOnInheritedWidgetOfExactType 에 대한 설명이 먼저 표기되어 있다. 참고로 우리 프로젝트에서는 주 고객층이 연령대 높으신 분들이 많은데 이 분들은 폰 설정에서 텍스트 크기를 크게 설정하시는 분들이 많았다. 그래서 UI 가 일부 안 보이거나 UI overflow 가 되는 현상이 많은데 사실 이러면 안되지만, 폰 설정에서 텍스트 크기를 크게 설정하여도 우리는 텍스트 크기를 고정시켜 커지지 ..

🐦 Flutter 2023.10.14

factory 생성자에 대한 고찰2 - 일반 생성자와 다른 차이점

지난 시간에는 json 파싱할 때 factory 생성자를 왜 쓸까? 에 대한 포스팅을 했었다. 2023.09.21 - [🐦 Flutter] - factory 생성자에 대한 고찰1 - Json 파싱 근데 지난 포스팅에도 봤다시피 factory 생성자는 일반 생성자와는 다른 모양이었다. 그러니까 일반 생성자 는 객체를 다음과 같이 초기화할 수 있다. Album({this.userId, this.id, this.title}); 반면 factory 생성자 는 다음과 같이 초기화한다. factory Album.fromJson(Map json) { return Album( userId: json['userId'], id: json['id'], title: json['title'], ); } factory 생성자는 ..

🐦 Flutter 2023.09.23

factory 생성자에 대한 고찰1 - Json 파싱

class Album { final int userId; final int id; final String title; Album({this.userId, this.id, this.title}); factory Album.fromJson(Map json) { return Album( userId: json['userId'], id: json['id'], title: json['title'], ); } } json 파싱할 때 보통 위 예제처럼 factory 생성자를 사용한다. factory 생성자는 인터넷에 조금만 찾아도 "이미 생성된 인스턴스를 재활용하는 생성자" 라고 알고 있을 것이다. 위 예제는 사실상 factory 생성자를 굳이 안 써도 된다고 한다. factory 생성자를 json 파싱할때만 본 나..

🐦 Flutter 2023.09.21

[Dart] mixin

mixin 은 여러 클래스 계층 구조에서 클래스 코드를 재사용하는 방법입니다. 무슨 말인지 이해 안되실 수 있습니다. (괜찮습니다! 저도 그랬으니까요) 천천히 mixin 이 왜 등장하였는지, 다른 클래스와는 어떻게 다른지 저와 같이 한 번 정리해보며 알아보겠습니다!! 1. mixin 등장 배경 class Player { void play() { print("경기하는 중..."); } } class BasketBallPlayer extends Player{ @override void play() { super.play(); print("농구경기 하는 중..."); } } 위와 같이 Player 부모 클래스를 상속받는 BasketBallPlayer 자식 클래스가 있습니다. 여기서 BasketBallPlaye..

🐦 Flutter 2023.04.09

AES-256 암호화

회사 프로젝트에서 AES-256 암호화 방식을 사용하여 다른 업체와 유저 정보를 주고 받아야 하는 업무가 있었다 좀 더 자세히 말하자면 다음과 같은 과정이 진행되어야 했다 Client : 유저 정보를 AES-256 암호화하여 @@업체의 url 의 parameter 에 포함시켜 웹뷰로 띄움 @@업체 : 유저의 액션을 받을 시, 유저의 정보를 우리 Backand 에 request parameter 에 담아서 전달 (유저의 정보는 Client -> @@업체 -> 백엔드 이렇게 넘어가게 된다는 뜻) Backand : @@업체에서 받은 유저 정보를 AES-256 복호화하여 유저의 정보를 파악 가능 업체의 요구사항은 다음과 같다 UserKey 값은 매체사 회원의 개인정보 및 중요한 회원정보 값이 그대로 넘어오는 것..

🐦 Flutter 2023.04.01

[Flutter] RenderFlex children have non-zero flex but incoming height constraints are unbounded

"RenderFlex children have non-zero flex but incoming height constraints are unbounded" 이 에러는 대체 언제 나는 것일까? 자주 마주친 에러였지만 늘 그때마다 뭔가 시도해봤고 잘 되었고 넘어가고.. 그랬었다. 이제는 이 에러의 원인을 확실히 알아둘 때라고 느꼈다 또 다시 마주칠 때는 헤매이는 시간 없이, 수정 시간을 줄이기 위해. 한 번 정리할 시간이 필요하다고 느꼈다 이 에러의 메세지를 직관적으로 해석해보면 높이 제약이 제한되어 있지 않다고 한다. 예시를 통해 알아보자 Screen → Column → Column → Expanded → ERROR 보통 위와 같은 위젯 트리일 때 이 에러가 발생한다 위의 위젯 트리를 좀 더 자세히 알아보..

🐦 Flutter 2023.02.03