개발 20

[Flutter] 두 개의 비디오를 동기화 재생하는 방법 (버퍼링/동기화 문제 해결)

Flutter 프로젝트를 진행하면서 두 개의 네트워크 비디오를 동시에 재생하려고 하였다. better_player_plus, chewie 등 다양한 패키지를 시도해 보았지만, 상황은 크게 나아지지 않았다.특히 iOS에서는 정상적으로 잘 재생되던 영상들이 Android에서는 버퍼링이 심하게 발생하는 문제가 있었다.네트워크 상태와 상관없이 AOS 기기에서는 끊김 현상이 빈번하게 발생해 안정적인 재생이 어려웠다.그러나 예상보다 심각한 버퍼링과 동기화 문제를 경험하게 되었다.해결 방법을 찾던 중, Stack Overflow에서 비슷한 문제를 겪은 개발자들이 CachedVideoPlayerPlus를 추천하는 것을 발견하였다.바로 pub.dev에서 관련 문서를 찾아 읽어보았고, 이를 통해 문제 해결의 실마리를 얻을..

개발/Android 2025.04.28

[Kotlin] Firebase Realtime Database에서 리스트 형태로 데이터 저장 및 조회하는 방법

Flutter와 Android를 연동해 Firebase Realtime Database를 사용할 때, 종종 데이터 구조와 관련된 오류가 발생한다. 특히 리스트(List) 데이터를 저장하거나 불러올 때 DatabaseException이 발생하는 경우가 많다. 문제 상황Flutter 앱에서 Firebase로 데이터를 저장하고, Android 네이티브 코드(MainActivity.kt)에서 MethodChannel을 통해 데이터를 처리할 때 다음과 같은 오류가 발생했다.com.google.firebase.database.DatabaseException: Expected a Map while deserializing, but got a class java.util.ArrayList이 오류는 Firebase에서..

개발/Android 2025.04.23

[Flutter] 푸시알림 foreground와 background에서 ref.invalidate() 사용 시 새로고침 오류 해결하기

Flutter에서 ref.invalidate()를 바로 호출하면 생기는 문제와 Future.microtask로 해결한 방법Flutter로 앱을 개발하면서 Riverpod의 ref.invalidate()를 사용할 일이 생겼다. 푸시 알림을 통해 결과 화면으로 진입했을 때, 바로 서버에서 받아온 데이터를 화면에 띄우고 싶었다. 그래서 페이지에 진입하자마자 리스트를 갱신해주려고 ref.invalidate()를 호출했다.문제 상황처음에는 다음과 같은 구조로 간단하게 코드를 작성했다.@override Widget build(BuildContext context) { final listAsync = ref.watch( listAsync(dataIdentifier: identifier), ); /..

개발/Android 2025.04.21

[Flutter] 영상 플레이어 — VideoPlayer에서 BetterPlayer로, 그리고 비율 문제 해결

최근 프로젝트에서 Flutter 영상 플레이어 관련해서 꽤 골치 아픈 문제를 겪었다.초반에는 Flutter 기본 video_player 패키지를 썼는데, ios에서는 잘 재생되었던 영상이 aos로 실행해 보니 예상보다 버벅거림이 심했고, 특히 Android 에뮬레이터나 저사양 기기에서 프레임 드롭이 눈에 띄게 많았다.그래서 결국 커스텀 컨트롤, 로딩 속도, 안정성 등에서 나은 성능을 보인👉 better_player_plus 패키지로 전환하게 됐다.❗ VideoPlayer의 한계영상 로딩 속도가 느림자주 초기화가 꼬이거나, 컨트롤이 불안정함커스텀 UI와의 연결이 불편고해상도 영상에서 프레임 드랍 발생✅ BetterPlayer로 전환한 이유자체 버퍼링 및 컨트롤러 관리가 훨씬 안정적다양한 설정 옵션 (fi..

개발/Android 2025.04.17

[Flutter 오류 해결] Gradle & Java 버전 호환 이슈 해결 방법 (feat. Java 21 → 17 다운그레이드)

🛠️ Flutter 프로젝트를 Git 저장소에서 가져온 뒤 초기 빌드 시, 다음과 같은 오류가 발생할 수 있다:Java 21을 사용 중일 때, Flutter 프로젝트가 Java 17만 지원하는 경우 해결 방법.문제 상황 현재 내 시스템의 Java 버전: Java 21깃랩에 올려진 프로젝트에서 사용 가능한 Gradle 버전: Java 17까지만 호환그래서 Flutter 빌드 시 Kotlin 컴파일 오류 발생 (Unresolved reference: Registrar 등) ✅ 해결 방법1. Java 17 다운로드Flutter 프로젝트와 호환되는 Java 17을 설치해야 한다.👉 Temurin 17 다운로드 (Adoptium)운영체제: macOS아키텍처: 본인의 맥이 Apple Silicon(M1/M2/M..

개발/Android 2025.04.17

[Flutter] Riverpod 상태관리 - ConsumerStatefulWidget 가이드

✅ ConsumerStatefulWidget을 사용해야 하는 경우ConsumerStatefulWidget은 setState()와 Riverpod 상태 관리를 동시에 사용해야 할 때 필요하다.예를 들어, 사용자가 버튼을 클릭할 때마다 UI가 변경되지만, 추가적인 상태(예: 애니메이션 컨트롤러, 텍스트 필드 입력 등)도 관리해야 할 경우 ConsumerStatefulWidget을 사용하면 적절하다.🛠 ConsumerStatefulWidget 예제 코드 (텍스트 필드 + 상태 관리)import 'package:flutter/material.dart';import 'package:flutter_riverpod/flutter_riverpod.dart';/// 상태 관리 (카운터)class CounterNotif..

개발/Android 2025.04.02

[Flutter] Riverpod 상태관리 - watch vs read 차이

Riverpod에서 watch vs read 차이점 정리 및 UI 리빌드 분석Flutter에서 상태 관리를 하다 보면 Riverpod을 선택하는 경우가 많다. 기능적으로 강력하지만, 처음 접했을 땐 watch와 read의 차이로 인해 의도치 않게 UI가 안 바뀌거나 과도하게 빌드되는 상황이 발생하기도 한다.이 글에서는 실제 사용 중 겪었던 경험을 바탕으로 watch와 read의 차이를 구체적인 예제와 함께 정리해봤다.ref.watch와 ref.read의 핵심 차이사용 방식 UI 리빌드 여부 설명ref.watch(provider)✅ 리빌드됨상태 변경 시 UI 자동 리빌드ref.read(provider)❌ 리빌드 안됨현재 값만 읽고 이후 변경 무시ref.watch(provider.notifier)❌ 리빌드 ..

개발/Android 2025.04.02

[Flutter] Riverpod 상태관리 - ConsumerWidget 가이드

🔍 ConsumerWidget이란?ConsumerWidget은 flutter_riverpod에서 제공하는 위젯으로, Consumer와 동일한 역할을 하지만 더 간결한 코드 작성을 가능하게 한다.Consumer vs ConsumerWidget ConsumerConsumerWidget사용 방식Consumer(builder: (context, ref, child) {...})build 메서드에서 ref.watch 사용 가능코드 구조StatelessWidget + Consumer 조합 필요StatelessWidget을 대체하여 더 간결함위젯 성능특정 부분만 리빌드 가능특정 부분만 리빌드 가능추천 사용처위젯의 특정 부분만 ref.watch가 필요할 때전체 위젯에서 ref.watch를 사용할 때 1. Consum..

개발/Android 2025.04.02

[Flutter] 간단한 ToDo앱에서 MethodChannel 응용

Flutter 앱과 안드로이드 네이티브 코드(Kotlin) 간의 통신을 위한 플러그인(Platform Channel) 구현 코드📌 주요 역할Flutter에서 보낸 메소드 호출(Method Call) 을 안드로이드 네이티브에서 처리할 일 목록(To-Do List)을 저장하고 불러오는 기능 제공SharedPreferences를 이용해 데이터를 저장 및 관리📂 코드 상세 설명1. 기본 클래스 및 변수 선언class MainActivity : FlutterActivity() { private val CHANNEL_NAME = "com.example.to_do_list/task_channel" private val TAG = "MainActivity"MainActivity는 FlutterActivi..

개발/Android 2025.03.10

[Flutter] MethodChannel이란 ?

Flutter에서 MethodChannel은 Flutter와 네이티브 플랫폼(Android, iOS) 간에 데이터와 메서드를 주고받는 데 사용됩니다. 이를 통해 Flutter 앱 내에서 네이티브 코드(예: Java, Kotlin, Objective-C, Swift)와 상호작용할 수 있습니다. MethodChannel을 사용하면 Flutter와 네이티브 간에 기능을 확장하거나 네이티브 API를 활용할 수 있습니다.1. MethodChannel이란?MethodChannel은 Flutter와 네이티브 플랫폼 간에 메서드 호출과 결과를 전달하는 채널입니다.Flutter에서는 MethodChannel을 사용하여 네이티브 코드에 메서드를 호출하거나 네이티브 코드에서 결과를 Flutter로 반환할 수 있습니다.2. ..

개발/Android 2025.03.10