티스토리

Totally 개발자

검색하기

블로그 홈

Totally 개발자

totally-developer.tistory.com/m

Totally 개발자 님의 블로그입니다.

구독자: 34

방명록 방문하기

주요 글 목록

[017] 플러터 (Flutter) Tip - flutter_native_splash 사용시 안드로이드 12이상에서 중앙 이미지가 잘려 보이는 경우 해결 방법 안녕하세요 totally 개발자입니다. flutter_native_splash를 사용하면 간단하게 스플래시 화면을 구축할 수 있는데, 단점은 직접 커스텀해서 만들 수는 없어서 정해진 틀 안에서 사용하시면 좋은 패키지입니다. 이 패키지를 사용하면 화면의 중앙부, 하단부, 배경 이 3 부분을 활용해서 제작을 해야 합니다.pubspec.yaml 맨 하단에flutter_native_splash: color: "#ffffff" # 배경 색 image: "assets/splash_image.png" # 중앙 이미지 branding: "assets/branding_image.png" # 하단 이미지 android_12: color: "#ffffff" image: "assets/splash_andro.. 공감수 2 댓글수 1 2024. 12. 26.
[016] 플러터 (Flutter) Tip - FCM 세팅시 안드로이드 missing default_notification_channel_id 문제 해결법 (백그라운드에서 푸시 헤드업 알림을 받지 못하는 경우) 안녕하세요 totally 개발자입니다~ Firebase Cloud Messaing (FCM) 푸시 알림 세팅할 때 안드로이드에서 세팅을 다 완료해준 것 같은데 아래와 같은 오류가 뜨는 경우가 있습니다. "W/FirebaseMessaging(24847): Missing Default Notification Channel metadata in AndroidManifest. Default value will be used." 이는 AndroidManifest에 default_notification_channel_id 부분이 제대로 인식되지 않기 때문에 나오는 오류인데, 아래처럼 위치를 조정해주면 빠르게 해결할 수 있습니다. 위치를 activity 태그 안에 두는 것이 아니라, application 태그 안에.. 공감수 0 댓글수 0 2024. 12. 24.
[015] 플러터 (Flutter) Tip - Mac에서 JAVA_HOME is set to an invalid directory 해결 안녕하세요~ totally 개발자입니다. 초기 세팅시 Mac(애플 실리콘 기준)에서 플러터로 안드로이드 에뮬레이터 등을 구동하려고 할 때, 아래와 같은 오류가 날 때, 해결 방법입니다. 저는 openjdk17를 brew를 이용해 설치하였습니다. 먼저 flutter doctor -v 명령어로 터미널에 입력하시면 대체적으로 아래와 같은 오류가 나올 것입니다.Cannot execute /Applications/Android Studio.app/Contents/jre/Contents/Home/bin/java to determine the version버전을 확인할 수 없다는 내용인데 이 경우 해결을 해보려고 ~/.zshrc 환경설정 JAVA_HOME, PATH 설정 등 계속 source ~/.zshrc 명령어로.. 공감수 0 댓글수 0 2024. 12. 6.
[014] 플러터 (Flutter) Tip - Your app is using an unsupported Gradle project 안드로이드 빌드 문제 해결 안녕하세요 totally 개발자입니다~ 오늘은 플러터 앱을 안드로이드 휴대폰으로 실행해볼 때 나타날 수 있는 문제 및 해결책을 알아보도록 하겠습니다. 1) 지원되지 않는 Gradle project 문제 Your app is using an unsupported Gradle project. To fix this problem, create a new project by running flutter create -t app and then move the dart code, assets and pubspec.yaml to the new project. 위와 같은 문제가 발생하는 경우는 AndroidManifest.xml 파일과 build.gradle 파일을 같이 보셔야 합니다. Step 1: 먼저 andro.. 공감수 0 댓글수 0 2024. 2. 9.
[013] 플러터 (Flutter) Tip - cocoapods-downloader requires Ruby version >= 2.7.4 (ruby 버전 문제) 해결 방법 안녕하세요~ totally 개발자입니다. 패키지 등을 업데이트하여 빌드하려고 할 때 아래와 같은 에러를 마주하는 경우가 있습니다. sudo gem install cocoapods를 진행할 때 나올 수 있는 오류인데요. 여러 가지 방법을 시도해본 결과 다음의 방법으로 해결하였으니 참고하시면 좋을 것 같습니다. There are no versions of cocoapods-downloader (>= 2.0) compatible with your Ruby & RubyGems. Maybe try installing an older version of the gem you're looking for? cocoapods-downloader requires Ruby version >= 2.7.4. The curren.. 공감수 0 댓글수 2 2023. 11. 1.
[012] 플러터 (Flutter) Tip - Incorrect use of ParentDataWidget 해결 방법 안녕하세요~ totally 개발자입니다. 플러터 개발시 하위 위젯을 굉장히 많이 배치를 하게 되는데 이 때 Incorrect use of ParentDataWidget이라는 오류가 발생하는 경우가 있습니다. 대표적인 경우가 Flexible, Expanded, Positioned 등과 같은 위젯인데요. 이 위젯들의 상위 parent에 적절한 위젯이 들어가지 않으면 오류 메시지가 출력되게 됩니다. 물론 앱 실행상에서는 지장이 없는 경우도 있지만 해결하는 것이 권장됩니다. Flexible, Expanded의 경우에는 Row, Column, Flex 위젯으로 감싸주셔야 합니다. Flexible, Expanded 자체가 여백을 확장하여 채워주는 위젯이기 때문에 2개 이상의 위젯이 들어갈 수 있는 children .. 공감수 1 댓글수 1 2023. 9. 21.
[011] 플러터 (Flutter) Tip - ListView 등 위젯 사용시 위아래 padding 제거하기 안녕하세요~ totally 개발자입니다. ListView, ListView.builder 등을 쓸 때 위아래로 여백(padding)이 생기는 경우가 종종 있습니다. 그 때 신속하게 해결 가능한 방법은 아래와 같습니다. 보통 2가지 방법이 존재합니다. 1. ListView에 있는 padding 속성으로 해결 2. parent 위젯으로 MediaQuery 위젯을 사용하여 해결 이미 padding이 쓰이는 경우라면 2번 방법으로도 해결할 수 있습니다. 공감수 1 댓글수 0 2023. 9. 20.
[010] 플러터 (Flutter) Tip - Null Safety 적용하기(Migrating to Null Safety) 안녕하세요~ totally 개발자입니다. Migrating to Null Safety 이 포스팅에서는 Null Safety에 대해서 살펴봅니다. Null Safety는 플러터 2.0, 다트 2.12부터 지원되기 시작했으며 Null Safety를 사용하여 모든 변수는 null로 처리되지 않으며 non-nullable의 변수를 위해서 체크 할 필요가 없습니다. 또한 클래스를 선언할 때 선언할 때 초기화를 하거나 ? 표시나 late 키워드를 통해 사용해주셔야 합니다. 그래서 String message = ""; 또는 String? message; late String message;로 사용합니다. Null Safety를 통해 코드 컴파일 실행 전에 오류로 인식하여 미리 수정할 수 있습니다. 플러터 2.0, 다.. 공감수 0 댓글수 0 2023. 9. 3.
[009] 플러터 (Flutter) Tip - 웹뷰(WebView)에서 유튜브 영상 전체화면 활성화하기 안녕하세요~ totally 개발자입니다. WebView를 사용하시다보면 웹사이트 페이지에 있는 iframe 태그로 구현된 유튜브 영상의 경우 전체화면을 눌러도 안드로이드의 경우 전체화면이 되지 않는 경우가 있습니다. 현재 webview_flutter로는 이것을 해결할 방법이 아직 발견되지 않았고 flutter_inappwebview 패키지를 사용하여 해결할 수 있습니다. Step 1: pubspec.yaml에 flutter_inappwebview 패키지를 추가합니다. Step 2: 사용하실 페이지에서 import합니다. Step 3: 먼저 controller 변수 선언하신 뒤, 아래처럼 InAppWebView 위젯으로 url를 넣어주면 됩니다. 개발에 도움이 되셨기를 바랍니다. Reference: htt.. 공감수 0 댓글수 0 2023. 8. 5.
[008] 플러터 (Flutter) Tip - CocoaPods not installed or not in valid state 이슈 해결 안녕하세요~ totally 개발자입니다. 플러터 개발을 하시다보면 아래 에러가 종종 발생하는 것을 보신 적이 있을 겁니다. 저는 현재 M1 맥북과 VSCode를 사용하고 있습니다. 해결책은 아래와 같습니다. Step 1: flutter clean 명령어 입력 Step 2: flutter pub get 명령어 입력 Step 3: ios 이슈이니 ios 경로로 가셔서 pod install 명령어 입력 Step 4: 그리고 sudo gem install cocoapods 입력하시고 root 비밀번호(맥 비밀번호)를 입력하시면 됩니다. Step 5: run 실행해줍니다. 다만 여기에서 fn + F5로 디버그 모드로 실행했을 때 에러가 계속 나오는 경우가 있습니다. 이 때에는 터미널에서 flutter run --.. 공감수 0 댓글수 0 2023. 8. 5.
[007] 플러터 (Flutter) Tip - Firebase Cloud Messaging (FCM) & flutter_local_notification 안드로이드 백그라운드에서 팝업 알림이 나오지 않을 때 해결 방안 안녕하세요~ totally 개발자입니다. 예전 포스팅(아래)에서 Firebase Cloud Messaging을 활용하여 푸시 알림을 하는 방법에 대해 알아보았습니다. https://totally-developer.tistory.com/149 [004] 플러터 (Flutter) Tip - Firebase Cloud Messaging (FCM) & flutter_local_notification 연동 및 알림, 알림 탭 했을 안녕하세요~ totally 개발자입니다. 이 포스팅은 제가 실제 플러터 앱 개발을 진행하며 파이어베이스 클라우드 메시징 (Firebase Cloud Messaging - 이하 FCM) 그리고 flutter_local_notification 패키지와의 연동 totally-developer.. 공감수 0 댓글수 4 2023. 7. 2.
[006] 플러터 (Flutter) Tip - 포토뷰(photo_view) 사진 저장 기능 구현하기 (갤러리 앨범에 저장하기) 안녕하세요~ totally 개발자입니다. 보통 포토뷰를 볼 때 사진을 저장해야 하는 기능을 제공하는 경우가 많습니다. 이번 포스팅에서는 갤러리 앨범에 바로 다운로드가 될 수 있도록 실습해보도록 하겠습니다. 오늘 이 포스팅은 tip이기 때문에 별도 설명은 없으며 아래 포스팅을 기반으로 하기 때문에 아래 포스팅을 먼저 진행하셔야 합니다. https://totally-developer.tistory.com/147 [063] 플러터 (Flutter) 배우기 - 포토뷰(photo_view)로 사진 확대, 축소 기능 위젯 만들기 & PageView.builder 안녕하세요~ totally 개발자입니다. photo_view 어플을 개발하다보면 사진을 올리고 그 사진을 볼 수 있도록 탭해서 사진을 확대, 축소할 수 있.. 공감수 0 댓글수 0 2023. 6. 10.
[005] 플러터 (Flutter) Tip - 앱에 있는 텍스트 복사 기능 구현 방법(범위 복사, 클립보드 복사) 안녕하세요~ totally 개발자입니다. 텍스트 복사 텍스트 복사할 때에는 보통 쭉 탭하여 범위를 지정하여 복사하는 방법과 아이콘 등을 클릭하여 클립보드로 해당 내용 전체를 복사하는 경우가 많습니다. 빠르게 살펴보도록 하겠습니다. 1) 범위 지정 복사 위에 있는 SelectableText 위젯 사용하시면 바로 사용 가능하며 기본 material.dart에 있는 것을 활용하기 때문에 패키지를 설치할 필요가 없습니다. 아래와 같이 일반 텍스트(Text) 위젯처럼 여러 가지 parameter를 부여할 수 있습니다. 2) 클립보드 복사 클립보드 복사도 별도 패키지 설치가 필요 없고 import 'flutter/services.dart'; 이것을 먼저 해주시면 됩니다. 여기 위에서 중요한 부분은 보통 내용 등은 .. 공감수 0 댓글수 0 2023. 6. 7.
[004] 플러터 (Flutter) Tip - Firebase Cloud Messaging (FCM) & flutter_local_notification 연동 및 알림, 알림 탭 했을 때 페이지 이동 시키기 (Android & iOS) 안녕하세요~ totally 개발자입니다. 이 포스팅은 제가 실제 플러터 앱 개발을 진행하며 파이어베이스 클라우드 메시징 (Firebase Cloud Messaging - 이하 FCM) 그리고 flutter_local_notification 패키지와의 연동 및 해당 기기에서의 알림 수신, 수신자가 알림을 탭 했을 때 특정 페이지로 이동하는 방법에 대해 Android, iOS 모두 그 방법에 대해 핵심적으로 요약하여 정리했습니다. 참고로 iOS의 APN 부분 등 기본 푸시 메시지 세팅 등은 여기에서 다루지 않고 FCM과 flutter_local_notification 부분만 다룹니다. 안드로이드를 위한 기본적인 내용은 여기에 정리해놓았으니 참고하시기 바랍니다. https://totally-developer... 공감수 6 댓글수 2 2023. 6. 4.
[003] 플러터 (Flutter) Tip - Scaffold, Appbar, Drawer, BottomNavigationBar, Routing (3페이지 구현 실습) 안녕하세요~ totally 개발자입니다. 아래처럼 Home, Search, Settings 페이지를 구성하고 Home이 아닌 Search와 Settings에서는 좌측 상단의 drawer 메뉴를 보이지 않게 하고 하단 메뉴의 아이콘을 클릭하면 각 페이지로 이동할 수 있는 간단한 실습을 해보도록 하겠습니다. Step 1: 시작하기에 앞서 구현 방법은 여러 가지로 꼭 해당 방법으로 구현하실 필요는 없으시고 라우팅 방법도 필자처럼 하실 수도 있고 Navigator.push, pop 등을 활용해서 하실 수도 있는 등 구현 상황에 따라 다르게 적용하셔야 함을 미리 말씀을 드립니다. 먼저 아래처럼 5개의 파일들을 구성합니다. Step 2: routeObserver를 구성을 해줍니다. 다만 이 실습에서는 이 overr.. 공감수 1 댓글수 0 2023. 5. 21.
[002] 플러터 (Flutter) Tip - 키보드 입력시 BottomNavigationBar을 자판 위에 위치시키는 방법, 밖의 화면 탭 했을 때 키보드 사라지게 하는 방법 안녕하세요~ totally 개발자입니다. 오늘은 제목 그대로 키보드 입력시에 bottomNavigationBar을 키보드 자판 위에 위치시킬 수 있게 하고 또 밖의 화면 탭하면 키보드 자판을 다시 사라지게 하는 방법에 대해서 공유합니다. Step 1: 아래처럼 controller, focusNode 변수를 선언합니다. Step 2: 아래처럼 GestureDetector와 Scaffold를 2번 추가해줍니다. Step 3: 다음처럼 구성해줍니다. Step 4: 테스트한 화면입니다. 공감수 1 댓글수 0 2023. 5. 3.
[001] 플러터 (Flutter) 문제 해결 - The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation. 안녕하세요~ totally 개발자입니다. 플러터 개발을 하다보면 Failed to build iOS app Error (Xcode): The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation. Could not build the application for the simulator. Error launching application on iPhone 14 Pro Max. 위와 같은 에러가 뜨는 경우가 종종 있는데 이럴 때에는 위에 해결책이 나와 있습니다. Run 'pod install' or update your CocoaPods installation.이라고 나오는데 보통.. 공감수 0 댓글수 0 2023. 4. 24.

문의안내

티스토리
로그인
고객센터

티스토리는 카카오에서 사랑을 담아 만듭니다.