IT(14)
-
[Flutter] Vertical scroll tabbar 을 만들어보자
오늘 만들어볼 ui는 스크롤이 인덱스 아이템을 넘어갈때마다 tabbar 아이템이 자동으로 변경되는 ui이다. 필요한 것은 다음과 같다. 1. 각 인덱스 별 아이템의 높이를 동적으로 구한다. 2. 스크롤 된 offset 이 인덱스 별 아이템의 높이를 벗어날때마다 tabbar 의 아이템을 변경해준다. 3. tabbar 의 아이템을 tap 하면 해당 인덱스의 아이템으로 스크롤시켜준다. 해당 ui를 구현하는데 있어서 가장 까다로웠던것이 두가지가 있었는데 그중 첫번째가 아이템의 높이를 동적으로 구해주는 것이었다. 다행히도 Globalkey 를 이용하여 Widget의 Renderbox 에 접근해 크기를 구할 수 있었다. final ancestor = context.findRenderObject(); // 부모 위젯..
2023.06.05 -
[Flutter] Expandable bottom sheet dialog 를 직접 만들어보자
오늘 만들어 볼 ui 는 Expandable bottom sheet dialog 이다. 위 그림처럼 드래그를 했을때 드래그 한 만큼 길이가 늘어나거나 줄어드는 인터렉션을 가진 ui 이다. 해당 ui를 만들기 위해서 필요한 것은 다음과 같다. 1. 드래그 이벤트가 발생할때마다 dy 차이(delta dy) 를 BottomSheetContainer 의 height 에 더해준다 2. 사이즈를 최소 미만 또는 최대 초과 할 수 없도록 한다. 3. 드래그 이벤트가 끝났을 때, 설정된 기준점에 도달했다면 사이즈를 최대로 늘리고 그렇지 않다면 최소로 줄인다. 첫번째로, delta dy 를 BottomSheetContainer 의 기존 height 값에 더해주면, 드래그 하는만큼 컨테이너의 height 도 늘어남으로 ..
2023.06.01 -
[Flutter] ios 빌드 시 Module "** *" not found 에러를 만날때
내 경우에는 "sqflite" 모듈을 찾을 수 없다는 에러였다. Pods 폴더에서 dependency를 확인해보니 sqflite 파일들이 Target Support files 폴더에 들어가있는것을 확인할 수 있었다. 원인은 build-type 별(flavor 사용중...)로 의존성을 include 해줬어야 했는데 그러지 않아서 발생했던 에러였다. 구체적으로 flavor [dev, staging, production] 을 설정하여 사용중이었는데, 이에 해당하는 xcconfig 파일들을 Debug.xcconfig, Release.xcconfig 파일에 include 시켜주니 정상적으로 Target Support files 폴더에 있는 의존성을 불러오는것을 확인할 수 있었다. Pod install 할때 War..
2023.05.15 -
[Design pattern] Proxy 패턴
Proxy pattern 이란? Proxy의 뜻은 '대리인' 이라는 뜻 어떤 작업의 실행을 대리인을 통해 실행하도록 하는 패턴 예제 전달받은 문자열을 1초의 딜레이로 화면에 표시해주는 ScreenDisplay 객체가 있다. Proxy를 이용하여 ScreenDisplay의 성능을 개선해보자 val display = ScreenDisplay() display.print("안녕") display.print("헬로") display.print("곤니치와") display.print("니하오") 결과 1초 딜레이... 안녕 1초 딜레이... 헬로 1초 딜레이... 곤니치와 1초 딜레이... 니하오 를 아래와 같이 개선한다 결과 1초 딜레이... 안녕 헬로 곤니치와 니하오 전체 예제 코드 fun main(args:..
2023.01.24 -
[Design pattern] Adapter 패턴
Adapter 패턴이란? GoF 책 에서는 이렇게 설명하고 있다 Convert the interface of a class into another interface clients expect. Adapter lets classes work together that couldn’t otherwise because of incompatible interfaces. 한 클래스의 인터페이스를 클라이언트가 기대하는 다른 인터페이스로 변경한다. Adapter 패턴은 호환되지 않는 인터페이스로인해 다른 방법으로는 불가능 했던 클래스가 함께 동작하도록 할 수 있다. Adapter 패턴에는 크게 두가지가 있다. 1. 객체 어댑터 Target 인터페이스를 구현하기위해 Adaptee 클래스의 인스턴스에서 구체적인 메서드를 ..
2023.01.22 -
[Flutter] RxDart 공식문서 보기 - 1
RxDart는 Dart의 Stream 과 StreamController의 기능을 확장한다. Dart는 기본적으로 꽤 쓸만한 Stream API 를 제공하는데, RxDart는 이 Stream API에 대한 대안이 아니라 확장 사양의 기능을 제공한다. RxDart는 Dart Stream을 대신하여 Observable 클래스를 제공하지 않는다. 대신에 몇가지 추가 Stream 클래스, 연산자 및 Subject를 제공한다. API 개요 Stream Classes - 여러 스트림을 결합 또는 병합하는 등의 기능을 사용하여 스트림을 만든다. Extension Methods - 원본 스트림을 throttling, buffering events 등의 다양한 기능을 가진 새 스트림으로 변환한다. Subjects - 추가..
2023.01.03