런처 아이콘 | 앱 아이콘 간단하게 만들기 182 개의 정답

당신은 주제를 찾고 있습니까 “런처 아이콘 – 앱 아이콘 간단하게 만들기“? 다음 카테고리의 웹사이트 you.maxfit.vn 에서 귀하의 모든 질문에 답변해 드립니다: you.maxfit.vn/blog. 바로 아래에서 답을 찾을 수 있습니다. 작성자 개발하는 정대리 이(가) 작성한 기사에는 조회수 7,905회 및 좋아요 144개 개의 좋아요가 있습니다.

런처 아이콘 주제에 대한 동영상 보기

여기에서 이 주제에 대한 비디오를 시청하십시오. 주의 깊게 살펴보고 읽고 있는 내용에 대한 피드백을 제공하세요!

d여기에서 앱 아이콘 간단하게 만들기 – 런처 아이콘 주제에 대한 세부정보를 참조하세요

🔥👨‍💻 정대리가 사용하는 맥북 구매하러가기
https://link.coupang.com/a/nerNK
\”파트너스 활동을 통해 일정액의 수수료를 제공받을 수 있음\”
📌 내용
– Figma
– 초 간단 앱 아이콘 만들기
– 완성 디자인
https://www.figma.com/file/W5JVDKoqwthMOsWk8ZpyiG/Untitled?node-id=0%3A1
부족한 제 채널을 구독해 주시고 꾸준히 영상을 시청해 주셔서
너무너무 감사합니다!
앞으로 더 노력하는 정대리가 되겠습니다! 🥰
❤️ 개발하는 정대리 채널 맴버쉽 가입하기 ❤️
https://www.youtube.com/channel/UCutO2H_AVmWHbzvE92rpxjA/join
개발하는 정대리 카카오톡 채널 링크 👇
http://pf.kakao.com/_Bbxhqxb
정대리 커피사주기 ☕️
https://toon.at/donate/dev_jeongdaeri
보다 빠른 레벨업을 원한다면? 🔥
http://www.ppak-coders.com/
영상이 도움이 되셨다면 구독과 좋아요는 저에게 큰 힘이 됩니다!🥰👍

런처 아이콘 주제에 대한 자세한 내용은 여기를 참조하세요.

Flutter 런처아이콘(LauncherIcon) 안드로이드, 아이폰 동시에 …

휴가 갔다가 개발도 바쁘게 했다가, 오랜만에 글 쓰네요. 안드로이드 런처아이콘 예시 (가정용 오랄케어, 구글플레이).

+ 더 읽기

Source: dalgonakit.tistory.com

Date Published: 2/27/2022

View: 6462

런처 아이콘(앱 아이콘)에 대한 최소한의 가이드 – iOS와 …

런처 아이콘(앱 아이콘)에 대한 최소한의 가이드 – iOS와 안드로이드. piglet lee 2021. 7. 24. 19:02. 모바일 서비스를 런칭하기 위해서는 애플 앱스토어와 …

+ 자세한 내용은 여기를 클릭하십시오

Source: null-piglet.tistory.com

Date Published: 5/7/2021

View: 4162

[android] 안드로이드 적응형 런처 아이콘 가이드

런처 아이콘 적용 가이드가 변화되었다는 것을 알게 되었다. Andro 7.1(API 수준 25) 이하 버전에서 런처 아이콘의 크기는 48x48dp로 설정되었었다.

+ 여기에 표시

Source: everybody-yeah.tistory.com

Date Published: 8/13/2022

View: 1141

안드로이드 앱 런쳐아이콘 만들기 – 하루에 하나 (One a day)

안드로이드 앱 런쳐 아이콘은 그냥 런쳐 아이콘과 적응형 아이콘이 있습니다. Andro 8.0 (API 수준 26) 이상부터 적응형 아이콘이라는 개념이 추가 …

+ 자세한 내용은 여기를 클릭하십시오

Source: popcorn16.tistory.com

Date Published: 5/7/2021

View: 2306

적응형 아이콘 | Android 개발자

백그라운드와 포그라운드로 구성된 2개의 레이어를 정의하여 적응형 런처 아이콘의 형태를 제어할 수 있습니다. 아이콘 윤곽선에 마스크나 백그라운드 그림자를 사용하지 …

+ 여기를 클릭

Source: developer.android.com

Date Published: 4/5/2022

View: 8560

주제와 관련된 이미지 런처 아이콘

주제와 관련된 더 많은 사진을 참조하십시오 앱 아이콘 간단하게 만들기. 댓글에서 더 많은 관련 이미지를 보거나 필요한 경우 더 많은 관련 기사를 볼 수 있습니다.

앱 아이콘 간단하게 만들기
앱 아이콘 간단하게 만들기

주제에 대한 기사 평가 런처 아이콘

  • Author: 개발하는 정대리
  • Views: 조회수 7,905회
  • Likes: 좋아요 144개
  • Date Published: 2021. 3. 18.
  • Video Url link: https://www.youtube.com/watch?v=fHS9XOk4QkA

Flutter 런처아이콘(LauncherIcon) 안드로이드, 아이폰 동시에 간편하게 설정하기

반응형

휴가 갔다가 개발도 바쁘게 했다가, 오랜만에 글 쓰네요

안드로이드 런처아이콘 예시 (가정용 오랄케어, 구글플레이)

앱을 실행할 수 있는 안드로이드의 홈 스크린 또는 앱 서랍, 아이폰의 홈 스크린에 있는 이미지를 런처아이콘(LauncherIcon)이라 합니다

안드로이드 런처 아이콘 세팅

안드로이드에서는 화면 사이즈별로 ldpi, mdpi, hdpi, xhdpi, xxhdpi, xxxhdpi를 설정해주고, 벡터형으로 모든 아이콘 크기를 대응하는 anydpi가 있습니다. 최근에는 adaptive-icon(반응형 아이콘)이라 해서 foreground와 background를 별도로 처리해서 1개의 아이콘으로 만들어주는 방법도 사용하고 있습니다.

Android Studio에서 각 사이즈별로 설정된 아이콘 모습

iOS 런처 아이콘 세팅

아이폰은… 정말 할께 많습니다… 물론 사이즈가 겹치는 부분도 있습니다만 이제는 앱스토어용 1024px까지 추가해야되더군요

(노티피케이션(알람)용 아이콘 2개, 세팅쪽 2개, 스팟라이트용2개, 앱용2개) * 패드용…

XCode에서 Assets.xcassets 파일의 아이콘 모습

아우 다시 생각만 해도 힘들다…

Flutter 런처 아이콘 세팅

android와 ios를 모두 가지고 있는 flutter에서도 위에서 보인것처럼 직접 세팅해도 됩니다

하지만 package를 이용하면 정말 쉽게 세팅이 가능합니다!

사진의 품질은 장담못합니다;;ㅎㅎ 저는 매우 만족스럽지만 디자이너 입장에서 만족스럽지 않을 수도 있으니 꼭 컨펌 받으세요~

1. 런처 아이콘 이미지 파일 준비

사이즈는 1024*1024px 사이즈로 준비합니다 (아이폰의 앱스토어용 아이콘 때문)

2. 패키지 설치

pubspec.yaml 파일에 package를 추가합니다

flutter_launcher_icons라는 package를 사용합니다

https://pub.dev/packages/flutter_launcher_icons

dependencies: flutter_launcher_icons: ^0.7.2+1

3. 아이콘 세팅

pubspec.yaml 파일안에 dependencies와 같은 탭으로 flutte_icons를 세팅합니다

1) 샘플을 기본으로 여러가지 사이즈로 파편화 될때, 안드로이드에는 파일명이 중요하기 때문에 파일명을 적어줍니다 (“launcher_icon”, 자동으로 파일명을 지정할려면 true를 사용합니다)

2) 아이폰은 파일명이 중요치 않기 때문에 사용여부만 적어줍니다 (true)

3) 파편화될 이미지의 경로를 적습니다. (저는 이 경로에 추가하였습니다 “assets/launcher/launcher_icon.png”)

flutter_icons: android: “launcher_icon” ios: true image_path: “assets/launcher/launcher_icon.png”

안드로이드에만 적용되는 적응형 아이콘도 설정이 가능합니다

adaptive_icon_background: “칼라 or 경로” adaptive_icon_foreground: “경로”

아이폰용 이미지, 안드로이드용 이미지도 별도로 설정 가능합니다

image_path_ios: “assets/launcher/ios_icon.png” image_path_android: “assets/launcher/android_icon.png”

4. 패키지 불러오기 및 이미지 파편화 시키기

아래 코드를 프로젝트의 터미널에서 실행시키면 기본 이미지 기준으로 여러 사이즈(파편화)의 이미지가 생성되어 세팅됩니다

flutter pub get flutter pub pub run flutter_launcher_icons:main

5. 확인해보기

총 20개의 이미지 파일이 생성됩니다.

각 플랫폼 별로 확인해봅시다

1) android/app/src/main/res/drawable

flutter의 android launcherIcon

2) ios/Runnder/Assets.xcassets/AppIcon.appiconset

flutter의 ios launcherIcon

마치며

아이콘별로 확인하면 모서리 부분이 깨져보일 수도 있으나 만족스러운 수준으로 다양한 사이즈로 만들어져있었습니다

벡터(SVG)를 이용한 파편화는 아직 지원하지 않습니다

그래도 맥북에서 유료로 제공하던 툴을 이용해서 파편화 하거나 아니면 Online Site를 이용해서 하거나 아니면 직접 여러 사이즈로 변경해주고 그걸 사이즈별로 대응해주는게 너무 번거로웠는데 이 패키지로 인해서 정말 편하게 세팅하였습니다

전 아마 계속 쓸꺼 같습니다 ㅎㅎ

런처 아이콘(앱 아이콘)에 대한 최소한의 가이드

모바일 서비스를 런칭하기 위해서는 애플 앱스토어와 안드로이드 마켓에 업로드하는 작업을 해야합니다. iOS와 안드로이드는 각각 요구하는 규격이 다릅니다. 안드로이드는 [dpi] 사이즈를 iOS는 [1@,2@,3@]사이즈 를 요구하는데요. 스토어에 업로드하기 위해서는 디자이너가 어떠한 사이즈로 작업해서 넘겨줘야하는지 살펴보려 합니다.

iOS 앱스토어

먼저 모바일 배경화면에 깔리는 아이콘입니다. 저는 개발자와 원활한 소통을 위해 런처아이콘이라고 지칭을 하였습니다. 상황에 따라 다양하게 부르는것 같습니다. 앱 아이콘, 모바일 아이콘, 런처아이콘 등등..

먼저 안드로이드 픽셀에 대한 설명과 iOS 앱 아이콘 지침입니다. iOS같은 경우엔 스포트라이트, 설정 메뉴에서 작은 아이콘이 등장하는데 작은 아이콘들의 사이즈도 고려해야 합니다.

https://developer.android.com/training/multiscreen/screendensities?hl=ko#java

https://developer.apple.com/design/human-interface-guidelines/ios/icons-and-images/app-icon/

그래서.. 어떤 사이즈로 작업해야 되는데..?

아이콘을 쉽게 만들어주는 편리한 툴이 있습니다. 기술 만세!

툴의 존재를 몰랐을 때는 개발자가 필요한 아이콘 사이즈를 엑셀표로 정리하여 저에게 보내준적이 있었는데요, 저는 그 엑셀표에 하나씩 체크해가면서 사이즈별로 만들어 파일 이름을 통일하고 한번 더 확인해보고.. 했던 경험이 있었는데 이젠 그럴 필요가 없습니다! 아이콘을 만들어주는 편리한 툴이 있습니다!

1024×1024를 기억합니다.

1024×1024으로 PNG으로 이미지를 만들어 업로드한 후 iOS와 안드로이드에 체크하여 파일을 다운받습니다.

안드로이드, iOS 런처아이콘 사이즈

그러면 이렇게 손쉽게 런처아이콘을 만들어 줍니다. 그리고 압축된 폴더를 개발자에게 넘겨줍니다. (디자이너 칼퇴 가능)

잠깐! 근데 안드로이드의 어댑티브 아이콘은 뭐지?

2019년에 안드로이드 아이콘 규격이 바뀌었습니다. 기존 자유형식의 아이콘의 크기를 75%를 줄여 정해진 규격안에 가둬버리는 업데이트를 진행하였습니다.

https://developer.android.com/google-play/resources/icon-design-specifications?hl=ko

플레이 스토어 아이콘만 다르네?

안드로이드의 런처아이콘들을 살펴보면 기존형식은 Play 스토어 아이콘처럼 자유로운 아이콘의 형식이었는데요. 앞으로 더욱 일관되고 깔끔한 디자인을 위해 구글에서는 아이콘 규격을 변경합니다. 마치 iOS의 라운디드 된 네모네모 아이콘처럼 전부 통일하도록 변경하겠다는 건데요.

https://developer.android.com/guide/practices/ui_guidelines/icon_design_adaptive?hl=ko

어댑티브 아이콘은 애니메이션 시각효과를 동반합니다. 하지만 낮은 버전에서는 움직이는 시각효과를 볼 수 없다고 합니다. 디자인 작업을 할 때는 최신 버전보다는 최저 버전에 맞춰서 작업을 하기 때문에 어댑티브 아이콘을 고려해야하느냐?에 대해서는 충분히 팀내에서 상의를 해봐야하는 상황입니다. (어댑티브 아이콘에 대해서 물어봤더니 개발자가 귀찮아합니다) 저는 항상 최저 버전에 맞춰서 작업을 해왔기 때문에 어댑티브 아이콘은 추후에 진행해보도록 하겠습니다.

반응형

[android] 안드로이드 적응형 런처 아이콘 가이드

이번에 사이드 프로젝트인 A.fume을 디자인하게 되면서

런처 아이콘 적용 가이드가 변화되었다는 것을 알게 되었다.

Android 7.1(API 수준 25) 이하 버전에서 런처 아이콘의 크기는 48x48dp로 설정되었었다.

그래서 항상 나도 런처 아이콘을 만들 때, mdpi 기준으로 48x48dp을 만든 다음에

제플린으로 넘기거나 이미지 추출로 mdpi, hdpi, xhdpi, xxhdpi, xxxhdpi을 뽑았었는데

Android 8.0(API 수준 26)에서는 이제 백그라운드와 포그라운드로 구성된 2개의 레이어를 정의하여

이미지를 만들어주어야 한다.

(근데 왜 나는 몇 달 전까지 걍 48*48dp로 만들었었지..? 왜그랬지!)

적응형 아이콘 이미지 (출처 : 구글 디벨롭)

적응형 아이콘 이미지 예시 (출처 : 구글 디벨롭)

일단 Android 8.0에서 적용되는 사이즈는 이러하다.

– mdpi : 108px*108px (XD나 스케치 등에서 디자인할 때 기준잡고 할 사이즈)

– hdpi : 162px * 162px

– xhdpi : 216px * 216px

– xxhdpi : 324px * 324px

– xxxhdpi : 432px * 432px

그리고 구글에서 준 가이드는 이러하다

출처 : 구글 디벨롭

적응형 런처 아이콘으로 만들지 않았을 시 레거시 아이콘

내가 원하는 런처 아이콘 이미지

A.fume 런처 아이콘 이미지

A.fume 런처 아이콘 라운드 형

내가 앱 아이콘으로 보여지고자 하는 런처 디자인은 이러하다.

기기에 따라 자유롭게 변화되는 모습..!

그럼 이렇게 적용되기 위해 Background이미지와 Foreground이미지로 분리해보겠다…!

Background 리소스 준비

– 정말 간단하게 108px*108px 크기로 백그라운드 파일을 만들어주면 된다.

a.fume 백그라운드 이미지

Foreground 리소스 준비

a.fume 포그라운드 이미지

– 안쪽 그래픽이 안전하게 잘 보이기 위해 세이브존인 66*66을 잘 맞춰줘야한다!

여기서 66*66은 원형사이즈 기준이다!

처음에 사각형사이즈인줄 알고 세이브존을 만들었다가 아이콘이 안보여서 애먹었었다.. ㅎㅎ

나는 A.가 흰색이라서 세이브존을 잘 표현해주려고 회색을 깔아놨는데

이미지 에셋 추출할때는 저 회색 세이브존을 지우고 추출했으니 참고 부탁드린다 🙂

+ 레거시 아이콘 리소스 준비

개발자 친구가 위에 소스만을 넣어서 런을 돌려봤는데

몇몇 아이콘이 딱 맞지 않았다 하여

레거시용 아이콘도 준비했다 🙂

512*512 사이즈로 포그라운드와 백그라운드 에셋을 준비해서

집어넣어서 레거시용도 대비해주어야 했다.

그럼, 그동안 준비한 리소스를 정리해보면

– mdpi : 108px*108px (XD나 스케치 등에서 디자인할 때 기준잡고 할 사이즈)

– hdpi : 162px * 162px

– xhdpi : 216px * 216px

– xxhdpi : 324px * 324px

– xxxhdpi : 432px * 432px

+ 레거시용 512*512

이렇게이다!

다 준비했으면 적응형 아이콘을 만들기 위한 준비물은 끝 -!

XML으로 적응형 아이콘 적용하기

XML로 앱에 적응형 아이콘을 추가하려면 먼저 드로어블 리소스를 지정하기 위해 앱 매니페스트에서 android:icon 속성을 업데이트해야한다.

또한 원형 마스크의 애셋이 필요한 경우 android:roundIcon 속성을 적용해야한다.

다음으로 res/mipmap-anydpi-v26/ic_launcher.xml의 Android 8.0(API 수준 26)에서 사용할 대체 드로어블 리소스를 앱에 만들어야 한다. 밑의 xml코드를 참고하시면 좋을 듯 하다.

참고 문서

developer.android.com/guide/practices/ui_guidelines/icon_design_adaptive?hl=ko

medium.com/google-design/designing-adaptive-icons-515af294c783

안드로이드 앱 런쳐아이콘 만들기

안드로이드 앱 런쳐 아이콘은 그냥 런쳐 아이콘과 적응형 아이콘이 있습니다. Android 8.0 (API 수준 26) 이상부터 적응형 아이콘이라는 개념이 추가되었습니다. 자세한 건 구글 개발자 문서에서 알려주고 있으니 확인하시기 바랍니다.

안드로이드 스튜디오로 새 프로젝트를 만들고 res 폴더에 들어가면 아래와 같이 폴더가 생성되어 있습니다. 아래 사진에서 빨간색 원 안에 있는 게 아이콘이 있는 폴더입니다.

res 폴더

폴더가 anydpi-v26과 mdpi, hdpi, xhdpi, xxhdpi, xxxhdpi와 같이 사이즈로 나뉜 폴더명이 있습니다. 위에서 간단히 설명드린 것처럼 적응형 아이콘과 사이즈에 따라 나뉘는 런쳐 아이콘을 나타냅니다.

이번 포스팅은 포토샵을 기반으로 정리했습니다. 적응형 아이콘은 벡터 파일로 만들어줘야 했는데, 파워포인트와 같이 원래 사용하던 툴은 svg 내보내기가 없어서 사용이 불가능했습니다😭포토샵을 단 한 번도 사용해보지 않은 초보 개발자 분들을 기준으로 상세히 작성했습니다.

1. 런쳐 아이콘 만들기

런쳐 아이콘을 만들 때는 사이즈가 중요합니다. 아래 표는 dpi에 따른 픽셀 크기입니다.

Google Playstore 512 x 512 px mdpi 48 x 48 px hdpi 72 x 72 px xhdpi 96 x 96 px xxhdpi 144 x 144 px xxxhdpi 192 x 192 px

구글 플레이 스토어에 등록하는 아이콘 사이즈가 512 x 512 px로 제일 큽니다. 저는 구글 플레이 스토어 사이즈 기준으로 새로운 파일을 생성했습니다.

포토샵 새로 만들기

새로 만들었다면, 원하는 아이콘을 만들어줍니다. 저는 파란색 바탕에 글자만 적어줬습니다.

아이콘

만들었다면 이제 각 사이즈 별로 내보내기를 할 차례입니다. 상단 바에서 파일> 내보내기> 내보내기 형식을 클릭해주세요.

파일 > 내보내기 > 내보내기 형식

사이즈에 따라서 폭과 높이를 변경해주시고 내보내기를 해주시면 됩니다. 형식은 png로 내보내시면 됩니다.

내보내기 형식

이런 식으로 mdpi ~ 구글 플레이 스토어 사이즈까지 만들어주시면 됩니다. 이까지 하면 사각형 런쳐 아이콘을 전부 만드신 거예요. 아직 round 아이콘이 남았습니다.

런쳐 아이콘 종류

위와 똑같이 Round 아이콘도 생성해주시면 됩니다.

포토샵 라운드 아이콘 만들기

라운드 아이콘을 만들고 배경 레이어를 삭제해주시면 됩니다. 이것도 마찬가지로 사이즈별로 내보내기를 합니다.

런쳐 아이콘 파일들

12개의 파일이 생성되었을 겁니다. 이제 mdpi ~ xxxhdpi까지는 res폴더의 각 파일에 ic_launcher와 ic_launcher_round라는 이름으로 넣어주시면 됩니다. 기존에 있던 ic_launcher와 ic_launcher_round 파일은 삭제하시면 됩니다.

2. 적응형 아이콘 만들기

위 런쳐 아이콘 만드는 건 사실 파워포인트로 해도 상관없습니다. 이미지 리사이즈만 하면 되니까요. 하지만 위에서 말씀드린 것처럼 적응형 아이콘은 벡터 파일 내보내기를 지원하는 프로그램을 사용해야 합니다.

적응형 아이콘은 background와 foreground로 나누어서 제작해야 합니다. mipmap-anydpi-v26 폴더의 ic_launcher.xml 파일 코드를 확인하시면,

drawable 폴더에 ic_launcher_background와 ic_launcher_foreground 파일이 있고, 그걸 적응형 아이콘의 background와 foreground로 사용한다는 것을 알 수 있습니다.

ic_launcher_background ic_launcher_foreground

기본으로 제공되는 파일을 보면 백그라운드와 포어그라운드를 어떻게 만들어야 할 지 감이 오실 겁니다. 저는 런쳐 아이콘에서 배경색은 background로, 0xFF라는 텍스트는 foreground로 만들어줬습니다.

ic_launcher_background.xml은 그냥 단색이니, 원래 있던 파일에서 코드만 아래와 같이 변경했습니다.

foreground를 만들기 위해서는 108 x 108 px 크기의 파일을 새로 생성해준 뒤에 원하는 아이콘을 만들어줍니다. 저는 텍스트만 작성했습니다. 주의할 사항은 깔끔한 디자인을 위해서는 지름 66dp의 원 안에 그려주셔야 하는 점입니다. safe zone에 대한 설명은 Designing Adaptive Icons라는 포스팅에 자세히 나와있습니다.

포토샵에서 텍스트를 그냥 SVG 파일로 내보내기를 하면 text라는 태그로 저장이 되는데, 이는 안드로이드 스튜디오에서 인식이 안됩니다. 그래서 텍스트는 “모양으로 변환”을 해준 다음 내보내기를 해야합니다.

텍스트 레이어에서 오른쪽 마우스 클릭 후 “모양으로 변환”

그리고 레이어에서 내보내기 형식을 클릭한 후 SVG 형식으로 내보내기를 합니다.

제 SVG 파일 코드입니다.

만들어진 SVG 파일을 안드로이드 스튜디오에서 불러옵니다. drawable 폴더에서 마우스 오른쪽 클릭> NEW> Vector Asset을 선택한 후 foreground로 만든 svg 파일을 불러옵니다.

마우스 오른쪽 클릭> NEW> Vector Asset

ic_launcher_foreground라는 이름으로 저장해줍니다.

Asset Studio

아래는 가상 머신에서 테스트한 적응형 아이콘입니다. 원하는 대로 잘 만들어졌습니다. 사실 이렇게 간단한 아이콘은 적응형인지 아닌지 상관없을 것 같은데, 공부한다는 마음으로 삽질해봤습니다 🙂

아이콘

잘못된 내용이 있다면 언제든지 댓글이나 메일로 알려주시면 감사하겠습니다.

이 포스팅이 도움이 되었다면 공감 부탁드립니다.

궁금한 점은 언제든지 댓글 남겨주시면 답변해드리겠습니다 😀

[안드로이드, IOS] 앱 런처아이콘 사이즈를 자동으로 만들어 주는 웹사이트

728×90

안드로이드 앱은 해상도에 따라 앱 런처 아이콘를 구성해주어야한다. 아래 캡쳐 이미지를 참고!!

구글플레이에 업로드할 아이콘 사이즈가 512×512 사이즈의 아이콘인데, 이 아이콘 하나만 만든 후 아래사이트를 사용하면 자동으로 뽑아준다.

사이트 명 : https://makeappicon.com/

Choose file…를 클릭하여 512×512사이즈의 이미지를 업로드 한다.

이것은 마치 토스터기에 빵을 넣고 난 후 올라오는 것에 착안하여 생각해낸 페이지처럼 보인다. 낯설지 않은 느낌을 받으며 한편으로는 신선하다.

3단계 거치고 나면 ios와 android 모두에 필요한 아이콘을 한번에 만들어준다. 어떻게 이런 생각을 했을까…

Your icon is generated!

Thanks for using makeappicon.com! Download your icons now.

Please input your email address to receive the app icon package. If you’d like to stay tuned with our update, opt in to subscribe our newsletter from Oursky.

이메일을 입력 후 전달 받을 수 있다. 해상도별로 아이콘 사이즈 만드는 일이 귀찮다면 이용하자.

728×90

[ Android ] 안드로이드 어플 런처 아이콘 변경하기

반응형

먼저 여기로 접속한다.

그리고 본인이 원하는 아이콘 선택하고 PNG 클릭.

필자는 체크모양 아이콘을 선택했다.

Free Download 클릭

안드로이드 스튜디오에서 File => New => Image Asset 클릭

Name 항목에 런처 아이콘 이름을 입력. 필자는 뒤에 check를 붙였음.

Layer Name 항목에 레이어 이름을 입력. 필자는 뒤에 check를 붙였음.

Path 항목에 다운로드 받은 이미지의 경로를 입력.

Resize 항목에 있는 바를 조정 해 체크 전체 모양이 보이도록 조정

Background Layer 탭을 선택 => Layer Name 수정. 필자는 뒤에 check를 붙였음.

Asset Type 을 Color 로 변경하고 원하는 Color 지정하고 Next 클릭.

Finish 클릭

AndroidManifest.xml 을 열고 application 의 icon 과 roundIcon 부분을 추가한 아이콘으로 수정.

결과

Android Developers

Android 8.0(API 수준 26)에는 다양한 기기 모델에서 여러 가지 형태로 표시되는 적응형 런처 아이콘이 도입되었습니다. 예를 들어 적응형 런처 아이콘은 한 OEM 기기에서는 원형으로 표시되고 다른 기기에서는 모서리가 둥근 사각형으로 표시될 수 있습니다. 각 기기 OEM에서는 마스크가 제공되는데, 시스템에서는 이를 사용하여 모든 적응형 아이콘을 같은 형태로 렌더링합니다. 적응형 런처 아이콘은 바로가기, 설정 앱, 공유 대화상자 및 개요 화면에서도 사용됩니다.

그림 1. 적응형 아이콘은 기기마다 다른 다양한 마스크를 지원합니다.

백그라운드와 포그라운드로 구성된 2개의 레이어를 정의하여 적응형 런처 아이콘의 형태를 제어할 수 있습니다. 아이콘 윤곽선에 마스크나 백그라운드 그림자를 사용하지 않고 아이콘 레이어를 드로어블로 제공해야 합니다.

그림 2. 적응형 아이콘은 2개의 레이어와 1개의 마스크를 사용하여 정의합니다.

Android 7.1(API 수준 25) 이하 버전에서 런처 아이콘의 크기는 48x48dp로 설정되었습니다. 이제 다음 가이드라인에 따라 아이콘 레이어 크기를 조정해야 합니다.

두 레이어 모두 108x108dp 크기로 설정해야 합니다.

안쪽의 72x72dp 아이콘은 마스크된 표시 영역 내에 나타납니다.

아이콘 사방의 바깥쪽 18dp는 시스템에서 시차 또는 펄싱과 같은 흥미로운 시각적 효과를 나타내는 데 사용하도록 예약되어 있습니다.

참고: 애니메이션 시각 효과는 효과를 지원하는 런처에서 생성됩니다. 시각 효과는 런처마다 다를 수 있습니다.

주의: 기기 OEM에서 도형의 특정 지점을 따라 33dp의 짧은 반경을 포함하는 마스크를 지정할 수 있습니다.

그림 3. 적응형 아이콘은 다양한 시각 효과를 지원합니다.

주의: 필수 레이어로 런처 아이콘을 업데이트하지 않으면 아이콘이 시스템 UI에서 표시하는 다른 아이콘과 어우러지지 않으며 시각 효과를 지원하지 않습니다.

Android 스튜디오를 사용하여 적응형 아이콘을 만드는 방법을 알아보려면 Image Asset Studio로 앱 아이콘 만들기를 확인하세요.

XML로 적응형 아이콘 만들기

XML로 앱에 적응형 아이콘을 추가하려면 먼저 드로어블 리소스를 지정하기 위해 앱 매니페스트에서 android:icon 속성을 업데이트하세요. android:roundIcon 속성을 사용하여 아이콘 드로어블 리소스도 정의할 수 있습니다. 로고 브랜딩에 원형이 필요한 경우와 같이 원형 마스크에 다양한 아이콘 애셋이 필요한 경우 android:roundIcon 속성만 사용해야 합니다. 다음 코드 스니펫은 이러한 속성을 모두 보여줍니다.

다음으로 res/mipmap-anydpi-v26/ic_launcher.xml 의 Android 8.0(API 수준 26)에서 사용할 대체 드로어블 리소스를 앱에 만들어야 합니다. 그런 다음 요소를 사용하여 아이콘의 포그라운드와 백그라운드 레이어 드로어블을 정의할 수 있습니다. 내부 요소는 모두 android:drawable 속성을 지원합니다.

백그라운드 및 포그라운드 드로어블을 요소에 포함시켜 요소로 정의할 수도 있습니다.

바로가기에 일반 적응형 런처 아이콘과 동일한 마스크와 시각 효과를 적용하려면 다음 중 하나를 사용합니다.

정적 바로가기에는 요소를 사용합니다.

요소를 사용합니다. 동적 바로가기를 만들 때는 createWithAdaptiveBitmap() 메서드를 호출합니다.

바로가기에 관한 자세한 내용은 앱 바로가기에서 확인하세요.

추가 리소스

적응형 아이콘 디자인 및 구현에 관한 자세한 정보는 Google 디자이너 겸 개발자 Nick Butcher의 기사를 참조하세요.

키워드에 대한 정보 런처 아이콘

다음은 Bing에서 런처 아이콘 주제에 대한 검색 결과입니다. 필요한 경우 더 읽을 수 있습니다.

이 기사는 인터넷의 다양한 출처에서 편집되었습니다. 이 기사가 유용했기를 바랍니다. 이 기사가 유용하다고 생각되면 공유하십시오. 매우 감사합니다!

사람들이 주제에 대해 자주 검색하는 키워드 앱 아이콘 간단하게 만들기

  • 동영상
  • 공유
  • 카메라폰
  • 동영상폰
  • 무료
  • 올리기

앱 #아이콘 #간단하게 #만들기


YouTube에서 런처 아이콘 주제의 다른 동영상 보기

주제에 대한 기사를 시청해 주셔서 감사합니다 앱 아이콘 간단하게 만들기 | 런처 아이콘, 이 기사가 유용하다고 생각되면 공유하십시오, 매우 감사합니다.

Leave a Comment