Foggy day

이번 포스팅에서는 Flutter web에서 마우스 드래그를 허용하는 방법과 MaterialScrollBehavior, ScrollBehavior에 대해 알아보겠습니다.   1. CustomScrollBehavior2. MaterialScrollBehavior 3. ScrollPhysics    1. CustomScrollBehavior Flutter웹에서 마우스 드래그가 안 되는 이유는 기본 세팅값에 mouse 드래그 허용 타입이 빠져있기 때문입니다. 때문에 MaterialScrollBehavior(extends ScrollBehavior)를 커스텀해서 PointerDeviceKind 타입에 mouse를 추가해주면 드래그가 가능합니다.  PointerDeviceKind에 대해 좀 더 자세하게 들여보겠습니..

이번 포스팅에서는 Flutter에서 image를 사전 cache 하는 법과 cache 된 이미지들이 어디에 저장되는지 알아보겠습니다. Asset 이미지들의 경우 실제로 사용할 때 초반에 잠시 깜빡이는 동작이 발생합니다. 이것은 아직 메모리에 로드되지 않았기 때문입니다. 사전캐싱 처리를 한다면 깜빡이는 동작 없이 바로 이미지를 보여줄 수 있습니다.   1. Image Widget2. PaintingBinding, WidgetsFlutterBinding3. precacheImage   1. Image Widget일반적으로 flutter에서 이미지 위젯을 구현할 때 image 관련 패키지를 사용하거나 flutter 자체에서 제공하는 Image 위젯을 사용합니다. Image 위젯에서는 한 번 이미지를 생성하면 ..

이번 포스팅에서는 Dart의 Isolate에 대해 알아보겠습니다. Isoate는 별도의 Thread에서 작업을 할 수 있도록 도와주는 클래스입니다. 시간이 오래 걸리는 작업을 하면서 화면은 계속해서 업데이트 하고 싶은 경우 사용하면 좋습니다.    1. 메인 스레드에서 작업2. Isolate.run3. Isolate.spawn  1.  메인 스레드에서 작업무거운 작업을 메인스레드에서 하게 되면 화면이 멈추는 현상이 발생합니다. 왜냐하면 Flutter는 기본적으로 단일 스레드를 사용하기 때문입니다. UI를 그리는 메인 스레드에서 무거운 연산 작업을 하게 될 경우 화면을 계속해서 업데이트할 수 없기 때문에 멈추는 것입니다. 이러한 것을 정크(jank)라고 합니다. 아래 메인 스레드에서 while문을 돌리는..

이번 포스팅에서는 AnimatedCrossFade 위젯에 대해 알아보겠습니다. AnimatedCrossFade는 두 위젯을 애니메이션 사용해서 바꿀 수 있도록 도와줍니다. 컬러나 텍스트 뿐만 아니라 사이즈 변경까지도 자동으로 애니메이션을 적용시킬 수 있기 때문에 매우 유용한 위젯입니다.    최종 동영상     first와 second 위젯을 지정해준 후에 crossFadeState 값에 어떤 위젯을 보여줄지 결정해주면 됩니다. 아래 예제에서는 first라는 변수로 구분해주고 있습니다. 간단하게 사용할 수 있으니 부가적인 설명은 생략했습니다. class Home extends StatefulWidget { const Home({super.key}); @override State createState..

최근 Kotlin으로 만든 Android Native앱을 업데이트 한 후 기존에는 없던 오류가 발생하는 일이 생겼습니다. 원인은 SharedPreference에 저장한 데이터의 형식이 변경됐기 때문입니다. 기존에 apple이라는 key로 int의 값을 저장했습니다. 업데이트 후에는 apple이라는 key의 타입을 Long으로 변경해서 사용했습니다. 개발을 할 땐 앱을 삭제 후 새로 설치하기 때문에 문제가 되는 것은 없었습니다. 하지만 일반 사용자들이 앱을 삭제하거나 데이터를 삭제하지 않고, 바로 업데이트해서 사용하는 경우 SharedPreference에 저장한 apple이라는 값의 type이 달라져서 오류가 발생했습니다. 운영하면서 경험해볼 수 있는 오류였습니다.

이번 포스팅에서는 Android의 접근성 서비스(AccessibilityService)에 대해 알아보겠습니다. 접근성 서비스는 기본적으로 장애가 있는 사용자를 위한 서비스입니다. 하지만 디바이스의 화면을 컨트롤 하기 위해 많이 사용되곤 합니다. Accessibility services should only be used to assist users with disabilities in using Android devices and apps https://developer.android.com/reference/android/accessibilityservice/AccessibilityService AccessibilityService | Android Developers developer.android...

HEX 투명도 HEX 투명도 HEX 투명도 HEX 투명도 00 0% 4F 31% 92 62% ED 93% 03 1% 52 32% A1 63% F0 94% 05 2% 54 33% A3 64% F2 95% 08 3% 57 34% A6 65% F5 96% 0A 4% 59 35% A8 66% F7 97% 0D 5% 5C 36% AB 67% FA 98% 0F 6% 5E 37% AD 68% FC 99% 12 7% 61 38% B0 69% FF 100% 14 8% 63 39% B3 70% 17 9% 66 40% B5 71% 1A 10% 69 41% B8 72% 1C 11% 6B 42% BA 73% 1F 12% 6E 43% BD 74% 21 13% 70 44% BF 75% 24 14% 73 45% C2 76% 26 1..

Android에서 Overlay 기능이 필요할 때가 있습니다. 예를 들어 네비게이션 앱처럼 앱을 백그라운드 상태로 두더라도 화면에 특정 View를 보여주는 것입니다. 이럴 때 사룔하는 것이 Overlay 기능입니다. 다른 앱 위에 우리가 설정한 View를 보여주고, 특정 로직을 수행할 수 있습니다. 이를 위해서는 권한 요청과 Service 클래스를 구현해야 합니다. Overlay를 사용할 때 주의할 것은 앱을 종료시키더라도 Overlay가 같이 종료되는 것은 아니라는 점입니다. 때문에 비즈니스 로직에 따라서 어떠한 경우에 overlay를 종료시킬지, 계속 살려둘지를 잘 설정해야 합니다. 또한 Service만 종료시키는 것이 아니라 View들도 직접 제거해줘야 합니다. 예제에서 구현한 기능 1. Overl..

MediaRecorder 클래스를 사용해서 음성 녹음 기능을 구현해보겠습니다. 1. 권한 추가 2. 녹음 코드 구현 1. 권한 추가 음성 녹음을 위해 Audio 권한과 녹음한 파일을 저장하기 위한 storage 권한을 추가하겠습니다. 그리고 application tag에 android:requestLegacyExternalStorage="true"를 추가 하는 것 또한 잊지 마세요. AndroidManifest ... runtime으로 권한을 요청하겠습니다. ActivityCompat.requestPermissions( this, arrayOf( Manifest.permission.RECORD_AUDIO, Manifest.permission.WRITE_EXTERNAL_STORAGE, Manifest.pe..

안드로이드 fcm을 수신하는 방법을 간략히 정리했습니다. 1. 파이어베이스 2. Android 코드 구현 1. 파이어베이스 Fcm을 수신하기 위해서는 파이어베이스에 등록 작업을 해야 합니다. 사진은 생략하고 처리 해야 할 항목만 나열하겠습니다. - 프로젝트 생성 - google-services.json 파일 다운로드 및 프로젝트에 추가 - 안드로이드 앱 추가 - 앱을 추가한 후에 프로젝트 설정 -> 일반 -> Sha 인증서 추가 sha1 키 발급 방법 https://jinhan38.com/14 Android(안드로이드) - How to get debug/release SHA-1 Sha key is needed when we use api like google and kakao and so on. So, ..