본문 바로가기

나는 이렇게 학습한다/App12

Flutter에서 안드로이드 뒤로가기 버튼 핸들링 하기 Flutter로 안드로이드 앱을 개발할 때에는 '뒤로 가기 버튼'의 동작을 핸들링하는 것이 중요합니다.   안드로이드에서는 위 이미지와 같은 '뒤로 가기 버튼'을 통해 현재 화면을 종료하고 이전 화면으로 돌아가는 기능을 제공합니다. 문제는 앱을 실행 중일 때에 뒤로 가기 버튼을 누르면 앱이 그대로 종료될 수 있다는 것입니다.  만약 앱 내에서 무언가 열심히 진행하다가 손이 미끄러져서(?) 뒤로 가기 버튼을 누르게 된다면??? 그 순간 앱이 곧바로 꺼지면서 휘발성 상태 값들이 사라지게 됩니다. 그렇기 때문에 안드로이드 앱을 개발할 때에는 사용자가 실수로 앱을 종료하지 않도록 뒤로 가기 버튼을 제어할 필요가 있습니다. Flutter에서는 WillPopScope 위젯을 사용하여 이러한 동작을 제어할 수 있습니.. 2025. 2. 4.
안드로이드 13+ 버전에서 이미지 권한 처리하기 이번 글에서는 Flutter 프로젝트에서 안드로이드 13(API 33) 이상의 이미지 권한을 어떻게 처리하는지 정리해 보겠습니다. 문제의 시작저는 현재 Facepop 이라는 사진 편집 앱을 개발하고 있습니다. Facepop - Google Play 앱재치있는 단체사진 Facepop으로 만들고 안전하게 공유하세요!play.google.com 앱을 완성하고 나서 제 안드로이드 폰으로 앱이 정상 동작하는 것을 확인하고 기쁜 마음으로 플레이스토어 출시를 했습니다. 그런데 앱을 다운받은 다른 사용자들에게서 '갤러리' 탭이 동작하지 않는다는 제보를 받았습니다. Facepop은 사진 편집 앱이기에 갤러리 탭에서 사진을 선택하는 과정이 필수적이었고 사진을 불러올 수 없는 것은 매우 치명적인 상황이었습니다. 하지만 확인.. 2025. 2. 2.
Flutter 앱에서 iOS 포그라운드(실행 중) 알림 동작 설정하기 이번 글에서는 Flutter 앱에서 iOS 알림 동작을 세밀하게 설정하는 방법을 다뤄보겠습니다. 특히, 앱 실행 중 알림 표시, 알림음 재생, 앱 아이콘 배지 표시와 같은 기능을 설정하고 iOS 버전에 따라 알림 스타일이 다르게 동작하도록 처리하는 방법을 알아보겠습니다. 먼저 변경 전 코드와 변경 후 코드를 보여드리겠습니다. 변경할 파일은 AppDelegate.swift 입니다.  변경 전, 기존 코드import UIKitimport Flutter@UIApplicationMain@objc class AppDelegate: FlutterAppDelegate { override func application( _ application: UIApplication, didFinishLaunching.. 2024. 11. 27.
Flutter TextField에서 한글 입력 시 자음과 모음이 분리되는 문제 해결하기 Flutter 앱에서 TextField를 사용해 한글을 입력할 때, 간혹 자음과 모음이 분리되는 현상이 발생합니다. 예를 들어 "안녕하세요"를 입력하려고 하면 "ㅇㅏㄴㄴㅕㅇㅎㅏㅅㅔㅇㅛ"처럼 입력되는 경우입니다. 이 문제는 입력기(IM)가 한글을 조합하는 과정에서 Flutter가 TextField의 값을 바로 수정하도록 구현했을 때 발생합니다. 이번 글에서는 이 문제를 어떻게 해결할 수 있는지 알아보겠습니다.  자음과 모음이 분리되는 이유한글은 자음, 모음, 자음을 조합하여 한 글자를 만듭니다. 예를 들어 "안"은 "ㅇ + ㅏ + ㄴ"이 결합된 글자입니다. Flutter에서 onChanged 이벤트를 사용하다 보면 텍스트를 수정하는 과정에서 입력기(IME)가 이 조합 과정을 끝내기도 전에 TextField.. 2024. 11. 20.
Flutter FloatingActionButton 터치 시 버튼 모양 불일치 해결하기 문제 상황Flutter에서 FloatingActionButton을 사용할 때, 버튼을 터치하면 사각형 모양의 ripple effect(물결 효과)가 보이는 경우가 있습니다. 버튼은 원형인데 터치 효과가 사각형으로 보이면 UI가 어색해 보이죠. 문제의 화면 원인이 현상이 발생하는 이유는 Material Design의 터치 피드백 처리 방식 때문입니다. FloatingActionButton이 Container 안에 직접 들어있을 때는 기본적으로 사각형 영역에 대해 ripple effect가 적용됩니다. 아래 코드는 FloatingActionButton이 Container 안에 직접 들어있을 코드 예제입니다.Container( decoration: BoxDecoration( gradient: Linea.. 2024. 11. 19.
Flutter 앱 아이콘과 이름, 스플래시 화면 설정하기 Flutter 앱을 개발했지만 앱의 아이콘이 기본 Flutter 아이콘이거나, 앱을 실행했을 때 기본 Flutter 스플래시 화면이 뜨는 경우가 있습니다. 이것은 아직 앱 아이콘과 스플래시 화면을 설정하기 않았기 때문입니다. 이번 글에서는 앱의 아이콘과 실행 시 나타나는 스플래시 화면을 어떻게 변경하고 커스터마이징할 수 있는지 알아보겠습니다.  1. 준비 단계1.1. 필요한 이미지 준비하기앱 아이콘 이미지: 정사각형 이미지 (권장 크기: 1024x1024 px, PNG 형식)스플래시 이미지: 앱 실행 중 나타나는 이미지를 준비 (배경이 투명한 PNG 추천)1.2. 이미지 경로 지정이미지를 프로젝트 내 assets 디렉터리에 저장합니다. 예제 구조는 다음과 같습니다.root/├── assets/│ └─.. 2024. 11. 18.