분류 전체보기

플러터 앱에 스플래시 화면을 구현해보자

목표 페이지를 통한 스플래쉬 화면이 아닌 네이티브 스플래쉬 화면을 설정한다. 과정 네이티브 스플래쉬 화면을 구성하려면 각 플랫폼의 디렉터리에서 스플래쉬 화면에 관한 설정을 해주어야 하는데, 꽤나 번거로운 일이기 때문에 이 글에서는 패키지를 통해 네이티브 스플래쉬 화면을 두 플랫폼 한 번에 설정하는 방법에 대해 알아본다. 아래 패키지를 사용할 것이다. flutter_native_splash | Dart Package Automatically generates native code for adding splash screens in Android and iOS. Customize with specific platform, background color and splash image. pub.dev 플러터 프..

플러터 출시한 앱 버전 관리하기

글의 목표 이번 글에서는 플러터 출시한 앱의 버전을 관리하는 방법에 대해 알아본다. IOS와 Android는 버전 스트링을 다루는 방식이 서로 상이한 부분이 있다. 그러나 버전 관리는 같은 플러터 프로젝트에서 해주기 때문에 두 플랫폼에 동일하게 사용될 수 있는 버전을 관리 방법을 찾아야 한다. 플레이 콘솔 앱 출시 버전 정책 플러터에서는 앱 버전을 설정하기 위해서 pubspec.yaml 파일을 사용한다. 파일의 상단에 version이라고 적혀있는 부분이 있는데 그곳에 앱이 어떤 버전으로 빌드될 것인지 적어주기만 하면 된다. 플러터에서 버전 스트링은 총 4가지로 나뉘며 본인은 각각 아래와 같이 부르고 있다. 1(major) . 6(minor) . 0(maintain) + 27(version code) 앞의..

flutter :: 앱 버전 및 업데이트 관리 | app version control

목표 내 앱이 현재 최신 버전인지 확인하고, 최신 버전이 아니라면 업데이트를 하도록 유도하는 다이얼로그를 화면에 띄운다. 최신 버전이 아니여도 호환이 되는 상태기 때문에 업데이트를 강제하지는 않는다. 만약 앱이 최신버전이 아니고, 최신 버전과 호환되지 않는 상태라면 ( 최소 앱 버전보다 낮다면) 업데이트를 강제하고 앱 사용을 중단시킨다. 해결 방법 사용중인 유저의 앱의 버전은 반드시 최소로 요구되는 버전보다 크거나 같아야 하고 최신 버전 이하여야 한다. minimumAppVersion

플러터 SVG 파일 캐싱하는 방법 | how to cache svg file in flutter

이 문서에서는 플러터 프로젝트에서 svg 파일을 캐싱하는 방법을 알아보도록 하겠습니다. 서론 플러터에서는 svg파일을 사용하기 위해 flutter_svg 패키지를 사용합니다. 만약 svg 파일의 크기가 크다면 불러오는데 시간이 소모되기 때문에 해당 svg파일을 화면에 그릴 때에는 잠깐동안 빈화면이 출력됩니다. 이러한 문제를 해결하기 위해 미리 svg 파일을 메모리로 올려놓는 svg 파일 캐싱 작업이 필요합니다. 캐싱 작업을 위해 필요한 함수들도 모두 flutter_svg 패키지에서 제공됩니다. SVG 파일 캐싱 svg파일 캐싱이 수행되는 순간은 앱 시작 전이나 스플래쉬 화면이 가장 적당할 것 같습니다. 저는 main함수 내부에서 svg파일 캐싱을 수행하였으며 코드는 다음과 같습니다. final List ..

[Flutter Apple Sign In] 플러터 애플 로그인 | 3. 코드 작성

안녕하세요 개발자 베베입니다. 저번 포스팅에 이어서 플러터 ios 애플 로그인 구현 마지막 단계에 대해 알아보도록 하겠습니다. 이전 포스팅 [Flutter Apple Sign In] 플러터 애플 로그인 | 2. 파이어베이스 설정하기 안녕하세요 개발자 베베입니다. 저번 포스팅에 이어서, 이번에는 애플 로그인을 사용하기 위해 파이어베이스 프로젝트에서 설정해야 할 내용들에 대해 알아보도록 하겠습니다. 이전 포스트 [Flu bebesoft.tistory.com 1. Xcode에서 Apple Sign In 활성화 빌드될 앱 파일에 애플 로그인의 기능이 사용된다는 정보를 넣어주기 위해 Xcode에서 애플 로그인 기능을 활성화해줘야 합니다. /ios 디렉토리를 오른쪽 클릭으로 눌러서 Xcode를 열고 아래 과정을 거..

[Flutter Apple Sign In] 플러터 애플 로그인 | 2. 파이어베이스 설정하기

안녕하세요 개발자 베베입니다. 저번 포스팅에 이어서, 이번에는 애플 로그인을 사용하기 위해 파이어베이스 프로젝트에서 설정해야 할 내용들에 대해 알아보도록 하겠습니다. 이전 포스트 [Flutter Apple Sign In] 플러터 애플 로그인 | 1. Apple Sign In 기능 활성화하기 안녕하세요 개발자 베베입니다. 이번 포스팅에서는 앱에 애플 로그인 기능을 추가하기 위해 나의 앱에 Apple Sign In 기능을 활성화하는 방법에 대해서 알아보도록 하겠습니다. 애플 로그인에 관 bebesoft.tistory.com 1. 애플 로그인 활성화하기 앱에서 사용하는 파이어베이스 프로젝트로 접속한 후, 왼쪽 메뉴의 [빌드] -> [Authentication]을 들어갑니다. Authentication 페이지의..

플러터 파이어스토어 예외처리 | flutter firestore exception handling

Firestore를 이용하여 특정 문서를 읽어오는 코드는 다음과 같습니다. FirebaseFirestore.instance 객체의 get() 함수가 성공적으로 실행이 된다면 DocumentSnapshot 객체를 반환하고 그 안에 값들이 담겨 있겠죠. 근데 이 get() 함수를 수행하면서 여러가지 예외가 발생하기 때문에 예외처리를 해주어야 합니다. 1. 통신 에러 & 권한 에러 처리해주기서버 측에서 통신을 할 수 없거나, 클라이언트(스마트폰) 측에서 인터넷이 연결되지 않아서 통신할 수 없는 경우 get 함수는 통신 에러 예외를 발생시킵니다. 만약 서버와의 통신은 원활하지만 클라이언트 측에서 사용하는 파이어베이스 계정이 해당 문서를 접근할 수 있는 권한이 없다면 권한 에러 예외를 발생시키게 됩니다. 위 두 ..

플러터 ios 프로젝트 pod 의존성 최신화하기 | Flutter ios refresh pod

간혹 플러터 앱 개발중에 버전에 대한 변동을 주고 싶을 때, pubspec.yaml에서는 변경했지만 pod 파일에선 변동이 없는 경우가 있습니다. 이럴 때에는 pod 파일에 관련된 몇몇 파일을 제거하고 다시 pod 파일을 인스톨해주면 해결됩니다. pod 파일 최신화 pod 파일의 의존성 정보를 최신화해줘야 빌드를 눌렀을 때 원하는 패키지 버전이 빌드됩니다. pod 파일을 최신화하는 방법은 다음과 같습니다. 플러터 프로젝트 폴더 내부의 ios 폴더로 이동해줍니다. $ cd ios/ 먼저 ios/Podfile.lock을 제거해줍니다. $ rm -rf Podfile.lock pod 파일 의존성 패키지를 업데이트 해줍니다. $ pod install --repo-update 명령어가 수행되면 의존성 패키지들이 다..

IOS 앱에 애플 로그인이 사용된다면 반드시 지켜야 할 사항

만약 여러분이 개발한 IOS 앱에 구글 로그인같은 OAuth 로그인이 사용된다면 이젠 반드시 애플 로그인을 같이 구현해야 되는 세상이 왔습니다. 뭐 애플 마음이니까 강제로 구현하라고 하는거는 어쩔 수 없는데.. 애플은 앱 디자인까지 강제를 합니다... 애플 로그인 버튼 디자인 규칙 버튼 내부 문장 규칙 애플 로그인 버튼에 글이 있다면 반드시 "Sign in with Apple", "Sign up with Apple", "Continue with Apple" 이어야만 합니다.(영어 기준) 한국어로 적으려면 반드시 "Apple로 로그인", "Apple로 계속(하기)" 이렇게 적어놔야 합니다. 만약 "애플로 로그인" 이렇게 적어놓으면 앱 출시를 거부해버립니다. ㅋ 버튼 색상은 반드시 대조되게 애플 로그인 버튼..

플러터의 위젯에 대해 알아보자

위젯이란 플러터에서 위젯이란 화면에 그려지는 객체를 의미합니다. 화면에 그려지는 모든 것은 모두 위젯이라고 생각하면 됩니다. 위젯은 상태가 있느냐 없느냐에 따라 Stateless Widget, Stateful Widget으로 나뉘게 됩니다. 여기서 상태란 위젯을 구현하기 위해 사용되는 정보입니다. 상태(state) 예를 들어 현재 시간을 알려주는 시계 역할을 하는 위젯이 있다고 생각해봅시다. 매 초마다 현재 시간은 변할태니 시계 위젯은 매 초마다 모양이 변해야겠죠? 이런 기능을 위젯에서 구현하려면 일단 현재 시간이라는 값을 위젯 내부에서 보관해야하고, 시간이 흐를 때마다 시계 침 위치를 변동시켜주어야 합니다. 여기서 현재 시간에 대한 값과 시계 침 위치에 대한 값이 상태라고 불리는 것들입니다. 그렇다면 ..