본문 바로가기
플러터로 앱만들기

플러터로 SNS어플 만들기 4. 실제 단말기연결,앱 아이콘 만들기

by 타이싸란 2021. 5. 11.

이번시간에는

 

휴대폰에서 빌드하기 와

앱 아이콘을 만들어볼거에요.

 

플러터로 만든 기본앱을 에뮬레이터나 실제 단말기에 깔면 

빨강색으로 동그라미 친거처럼 아이콘이 저렇게 나와요.

근데 이걸 아이콘을 바꿔주면 파란색으로 동그라미 친거처럼 저렇게 바뀌죠.

사진이 정사각형이 원안에 그냥 저렇게 들어가잇는데.

안드로이드 에뮬레이터의 구글 픽셀폰이라서 저렇고

일반적인 안드로이드 폰은 사각형 그림파일있으면 아래처럼 이쁘게 둥그스름하게 만들어줘요

 

오늘 작업할 내용입니다.

 

1. 단말기 설정하기

 

2. 단말기에 깔기

 

3. 런쳐아이콘 사진정하기

 

4. flutter_launcher_icons 라이브러리 적용하기

 

5. 라벨 변경하기

 

1. 단말기 설정하기

 

우선 자기 단말기를 꺼내 톱니바퀴 모양의 설정을 눌러들어간다음

개발자 옵션에서 USB디버깅을 온 해주세요.

아이폰도 이런게 있으니 개발자 옵션을 건드려주세요.

 

 

2. 단말기에 깔기

그다음 휴대폰과 컴퓨터를 연결해주세요.

그럼 이부분에 자기 단말기 이름이 뜰거에요.

이거 선택해주시고 런 해주시면 휴대폰에 깔려요.

 

 

3. 런쳐아이콘 사진정하기

 

단말기 바탕화면에 깔려있는 아이콘들을 우리는 런쳐아이콘이라고 합니다.

 

런쳐아이콘에 쓰고 싶은 사진을 하나 정합니다.

1:1 비율의 사이즈로요

 

저는 그냥 요렇게 했습니다.

 

4. flutter_launcher_icons 라이브러리 적용하기

 

그다음  구글에 flutter launcher icon 이라고 치시고 최신버전을 적용할겁니다.

 

 

 

 

pubspec.yaml 파일에가서

 

dev_dependencies 에 

flutter_launcher_icons: ^0.9.0(최신버전)

을 적어주시고

 

flutter_icons:

android: "<아이콘 파일이름>"

ios: true

image_path: "<경로>"

 

를 적어줍니다. 아이콘 파일 이름에는 그냥 my_icon이라고 해주세요. 별거아닌걸로 에러납니다.

소문자조합으로 그냥 해주시면됩니다.

그리고 터미널에 가서 이렇게 적어주세요.

flutter pub run flutter_launcher_icons:main

그러면 막 이렇게 뜰껍니다.

 

 

왼쪽에 이렇게 그림들이 들어갔네요.

 

그리고 아이콘도 바뀌어 있네요

여기 빨강색 눌러서 끈다음 다시 런 해주시면

아이콘이 바뀌는걸 보실수 있습니다.

 

(좌)에뮬레이터 , (우) 내 단말기

 

 

5. 라벨 변경하기

그다음 저기 mynephew 라고 되어있는데 저거도 한번 바꿔보겠습니다.

저게 label 이라는건데

왼쪽에 저거대로 경로 찾아가서 AndroidManifest.xml을 켭니다.

이파일은 앞으로 여러번 보실테니 찾아가는 경로는 익혀두세요.

 

저기서 라벨이름을 그냥 바꿔주시면됩니다.

이거는 한글도 됩니다. 하고싶은걸로 해주세요.

 

 

요렇게 잘나왔습니다.

 

오늘은 내 단말기에 설치하는방법과 아이콘 바꾸기 알아봤습니다.

다음 시간도 기대해주세요 ㅂㅂ

 

 

 

 

-----------------공지-------------------

23년 버전 앱강의를 오픈했습니다. 관심있으신분은 클릭 ㅋㅋ

2023.07.29 - [코딩생초보를 위한 플러터 빠르게 한바퀴] - 1. create project

 

1. create project

1회차 세부 과정 목차 더보기 1.Flutter new project 옵션 선택 2.파일 구조와 역할 설명 3.주석 4.안드로이드 시뮬레이터 테스트 앱띄우기 5.핫리로드 6.IOS 시뮬레이터 테스트 앱띄우기 7.머티리얼앱 과

100sucoding.tistory.com

개인과외 문의 saran.flutter@gmail.com