Flutter에서 응용 프로그램 시작 관리자 아이콘을 변경하는 방법은 무엇입니까?


198

flutter create명령 으로 앱을 만들면 flutter 로고가 두 플랫폼 모두의 응용 프로그램 아이콘으로 사용됩니다.

앱 아이콘을 변경하려면 두 플랫폼 디렉토리로 이동하여 이미지를 바꿉니 까? myapp/ios/Runner/Assets.xcassets/AppIcon.appiconsetiOS 및 myapp/android/app/src/main/resAndroid의 플랫폼 디렉토리를 의미 합니다 .

또는 이미지를 Flutter Asset 으로 정의 할 수 있으며 아이콘이 어떻게 생성됩니까?


당신은 내가 두 방법으로 체크를 언급이 두 방법을 appicon 업데이트 할 수 있습니다 여기에
Mayur Dabhi

답변:


238

Flutter Launcher Icons는 Android 및 iOS 모두에 대한 런처 아이콘을 빠르게 생성 할 수 있도록 설계되었습니다. https://pub.dartlang.org/packages/flutter_launcher_icons

  • pubspec.yaml 파일 (Flutter 프로젝트 내)에 패키지를 추가하여 사용하십시오.
  • pubspec.yaml 파일에서 앱에 사용하려는 아이콘의 경로를 지정한 다음 iOS 앱, Android 앱 또는 둘 다에 아이콘을 사용할지 여부를 선택하십시오.
  • 패키지를 실행
  • 짜잔! 기본 실행기 아이콘이 이제 사용자 정의 아이콘으로 바뀌 었습니다.

비디오를 보여주기 위해 GitHub README에 비디오를 추가하고 싶습니다

도구 실행 방법을 보여주는 비디오는 여기 에서 찾을 수 있습니다 .

누구든지 개선 /보고 버그를 제안하고 싶다면 GitHub 프로젝트에 문제로 추가하십시오 .

업데이트 : 2018 년 1 월 24 일 수요일부터 Flutter 프로젝트의 기존 런처 아이콘을 재정의하지 않고 새 아이콘을 만들 수 있습니다.

업데이트 2 : v0.4.0 (2018 년 6 월 8 일)부터 Android 아이콘으로 하나의 이미지를 지정하고 iOS 아이콘으로 별도의 이미지를 지정할 수 있습니다.

업데이트 3 : v0.5.2 (2018 년 6 월 20 일)부터 이제 Flutter 프로젝트의 Android 앱에 적합한 실행기 아이콘을 추가 할 수 있습니다.


1
이미지에 대한 요구 사항이 있습니까?
camino

1
한 가지 크기에 대한 참조 만 찾았습니다 710x599. 그것을 선택한 이유는 무엇입니까? 어쨌든 나는 예상 512x512했거나 1000x1000뭔가 정사각형이었습니다.
Suragch

1
@Suragch는 Google에서 아이콘을 빠르게 검색하여 빠르게 테스트 할 수있었습니다. 사람들이 패키지 (1024x1024 및 128x128)를 시험해 볼 수 있도록 두 가지 다른 아이콘 크기를 포함 시켰습니다. github.com/fluttercommunity/flutter_launcher_icons/tree/master/…
Mark O'Sullivan

2
read.me 패키지가 이미지 크기에 대한 권장 사항을 제공해야한다고 제안 할 수 있습니까?
Brett Sutton

1
이것은 내가 찾은 최고의 것 중 하나입니다. 고마워요!
besil

135

기본 개발자처럼 실행기 아이콘 설정

flutter_launcher_icons 패키지를 사용하고 이해하는 데 문제가 있었습니다 . 이 답변은 Android 또는 iOS 용 앱을 기본적으로 만든 경우 수행 방법입니다. 몇 번 수행하면 매우 빠르고 쉽습니다.

기계적 인조 인간

Android 런처 아이콘에는 전경 레이어와 배경 레이어가 모두 있습니다.

여기에 이미지 설명을 입력하십시오

( Android 문서 에서 수정 된 이미지 )

Android 용 실행기 아이콘을 만드는 가장 쉬운 방법은 Android Studio에서 바로 사용할 수있는 Asset Studio를 사용하는 것입니다. Flutter 프로젝트를 떠나지 않아도됩니다. (VS Code 사용자는이 단계에 대해서만 Android Studio를 사용하는 것을 고려할 수 있습니다. 정말 편리하고 다른 IDE에 익숙해 져도 아프지 않습니다.)

android프로젝트 개요에서 폴더를 마우스 오른쪽 버튼으로 클릭하십시오 . 새로 작성> 이미지 자산으로 이동하십시오 . ( 이미지 자산 이 옵션으로 android/app표시되지 않으면 폴더를 마우스 오른쪽 버튼으로 클릭 하십시오 .) 이제 이미지를 선택하여 실행기 아이콘을 만들 수 있습니다.

참고 : 나는 보통 1024x1024픽셀 이미지를 사용하지만 그보다 작은 것을 사용해서는 안됩니다 512x512. Gimp 또는 Inkscape를 사용하는 경우 전경과 배경에 각각 하나씩 두 개의 레이어가 있어야합니다. 전경 이미지에는 배경 레이어가 보이도록 투명한 영역이 있어야합니다.

여기에 이미지 설명을 입력하십시오

( 여기 에서 사자 클립 아트 )

현재 실행기 아이콘이 바뀝니다. mipmap폴더 에서 생성 된 아이콘을 찾을 수 있습니다 .

실행기 아이콘을 수동으로 생성하려면 이 답변 을 참조하십시오 .

마지막으로, AndroidManifest의 런처 아이콘 이름이 위에서 ic_launcher기본적으로 호출 한 것과 동일한 지 확인하십시오 .

application android:icon="@mipmap/ic_launcher"

에뮬레이터에서 앱을 실행하여 실행기 아이콘이 성공적으로 생성되었는지 확인합니다.

iOS

나는 항상 수동으로 iOS 아이콘의 크기를 개별적으로 조정했지만 Mac을 사용하는 경우 Mac App Store에는 Icon Set Creator 라는 무료 앱이 있습니다. 이미지 (최소 1024x1024픽셀)를 제공하면 필요한 모든 크기 (및 Contents.json파일)를 뱉어냅니다 . 제안에 대한 이 답변 덕분에 .

iOS 아이콘에는 투명성이 없어야합니다. 자세한 지침은 여기를 참조 하십시오 .

아이콘 세트를 만든 후 Xcode를 시작하고 (Mac이 있다고 가정) iosFlutter 프로젝트에서 폴더 를 여는 데 사용합니다 . 그런 다음 러너> Assets.xcassets 로 이동 하여 AppIcon 항목을 삭제하십시오.

여기에 이미지 설명을 입력하십시오

그런 다음 마우스 오른쪽 버튼을 클릭하고 가져 오기 ...를 선택하십시오 . 방금 만든 아이콘 세트를 선택하십시오.

그게 다야. 시뮬레이터에서 앱을 실행하여 아이콘이 생성되었는지 확인하십시오.

Mac이 없다면 ...

손으로 모든 이미지를 만들 수 있습니다. Flutter 프로젝트에서로 이동하십시오 ios/Runner/Assets.xcassets/AppIcon.appiconset.

필요한 이미지 크기는 파일 이름에 곱한 크기입니다. 예를 들어, Icon-App-29x29@3x.png29시간 3이다, 87사각형 픽셀. 동일한 아이콘 이름을 유지하거나 JSON 파일을 편집해야합니다.


1
당신이 그것을 이해하기 위해 고군분투했다면, 나는 당신이 가진 모든 질문에 답변 드리겠습니다. 문제를 열고 나는 그것에 대해 다시 얻을 것이다 : github.com/fluttercommunity/flutter_launcher_icons을
마크 설리번에게

2
@ MarkO'Sullivan, 감사합니다. 내 생각 엔 패키지가 괜찮습니다. 문서를 따르기가 어려웠습니다. 예를 들어, 초기 이미지에 사용할 크기, Android 용 배경 레이어 등이 있습니다. 초보자에게 프로세스를 안내하는 자세한 자습서가 있으면 정말 도움이됩니다.
Suragch

공식적이지 않은 패키지에 대한 좋은 대안은 더 이상 작동하지 않는 것으로 보이며 6 개월 동안 업데이트되지 않았습니다 ...
Yann39

1
도움이되었습니다. Android Studio에는 Image Asset 을 추가 할 수있는 옵션이 없습니다 . github / flutter 문제에서 배운 해결 방법은 Android 스튜디오 내에서 표준 단독 "Android"프로젝트로 / android 폴더 (플러터 프로젝트 내)를 여는 것입니다. / res 폴더를 마우스 오른쪽 버튼으로 클릭하면 옵션이 나타납니다.
MwamiTovi

2
@MwamiTovi가 맞지만 마우스 오른쪽 버튼을 클릭하거나 수동으로 동기화하기 전에 gradle 동기화를 기다려야합니다. 그렇지 않으면 "새-> 이미지 자산"이 표시되지 않습니다.
다니엘

111

간단한 단계를 수행하십시오.

  1. flutter_launcher_icons플러그인 추가pubspec.yaml

예 :

dev_dependencies: 
  flutter_test:
    sdk: flutter

  flutter_launcher_icons: ^0.7.5

flutter_icons:
  image_path: "icon/icon.png" 
  android: true
  ios: true
  1. 지정된 경로에 대한 앱 아이콘을 준비하십시오. e.g. icon/icon.png

  2. 터미널에서 명령을 실행하여 앱 아이콘을 만듭니다.

$ flutter pub get

$ flutter pub pub run flutter_launcher_icons:main

사용 가능한 모든 옵션을 확인하고 Android 및 iOS에 다른 아이콘을 설정하려면 다음을 참조 하십시오.

이것이 다른 사람들을 도울 수 있기를 바랍니다.


4
이것은 나를 위해 일했다. 마지막 줄을 한 번만 실행하십시오 flutter pub pub run flutter_launcher_icons:main. 팁 고마워!
olisteadman

3
android.dart : 164 : 25 : 오류 : 위치 인수가 너무 많습니다. 1 개는 허용되었지만 4 개는 발견되었습니다.
ir2pid

다크 모드가 활성화 된 경우 아이콘을 전환 할 수 있습니까?
막시 밀리 아노 소사

1
@ ir2pid 오류를 해결하려면 flutter_launcher_icons로 버전을 업데이트해야합니다. 0.7.5
Gökçer Gökdal


19

이 웹 사이트를 이용하시기 바랍니다

앱 아이콘 크리에이터

1 단계 : 이미지 업로드

2 단계 : 필요한 사항을 변경하고 다운로드를 클릭하십시오 (파일 이름을 변경하지 마십시오)

3 단계 : 각 폴더에서 다운로드 한 Zip 파일 추출

android/app/src/main/res

3
이 제안은 IOS에 도움이되지 않습니다.
8:26의

2
이 솔루션은 저에게
효과적

1
아주 좋은 해결책입니다.
Mayank M.

17

다음 단계에서 변경했습니다.

1) pubspec.yaml 페이지에이 종속성을 추가하십시오

 dev_dependencies:
  flutter_test:
    sdk: flutter
  flutter_launcher_icons: ^0.7.4

2) 실행기 아이콘으로 표시하려는 이미지 / 아이콘을 프로젝트에 업로드해야합니다. (내 프로젝트에 폴더 이름 : 이미지를 만든 다음 이미지 폴더에 logo.png를 업로드하십시오). 이제 아래 코드를 추가하고 image_path : pubspec.yaml 페이지에 이미지 경로를 붙여 넣어야합니다.

flutter_icons:
  image_path: "images/logo.png"
  android: true
  ios: true

3) 터미널로 이동하여 다음 명령을 실행하십시오.

flutter pub get

4) 명령을 실행 한 후 아래 명령을 입력하십시오.

flutter pub run flutter_launcher_icons:main

5) 완료

NB : (물론 업데이트 된 종속성 추가

https://pub.dev/packages/flutter_launcher_icons#-installing-tab-

)


4

최고권장Flutter에서 앱 아이콘을 설정하는 방법 방법입니다.

“flutter_launcher_icons”라는 flutter에서 앱 아이콘을 설정하는 플러그인이 하나 있습니다. 이 플러그인을 사용하여 앱 아이콘을 flutter로 설정합니다.

  1. 이 플러그인을 프로젝트 루트 디렉토리의 pubspec.yaml 파일에 추가하십시오. 아래 코드를 확인하십시오.

    종속성 :
    flutter :
    sdk : flutter
    cupertino_icons : ^ 0.1.2
    flutter_launcher_icons : ^ 0.7.2 + 1

파일을 저장하고 터미널에서 flutter pub get을 실행하십시오.

  1. 폴더 자산의 프로젝트 루트에 폴더 자산 생성 또한 폴더 아이콘을 생성하고 앱 폴더를이 폴더 안에 넣습니다. 1024x1024 앱 아이콘 크기를 권장합니다. 아이콘 폴더 안에 앱 아이콘을 배치했으며 이제 자산 / 아이콘 / 아이콘 .png로 앱 아이콘 경로가 있습니다.

  2. 이제 pubspec.yaml에서 아래 코드를 추가하십시오.

    flutter_icons :
    android : "launcher_icon"
    ios : true
    image_path : "자산 / 아이콘 / 아이콘 .png"

  3. 파일을 저장하고 터미널에서 flutter pub get을 실행하십시오. 명령을 실행 한 후 다음과 같이 두 번째 명령을 실행하십시오.

    flutter pub run flutter_launcher_icons : main -f pubspec.yaml

그런 다음 앱 실행


동일한 정답에 대답했지만 최소한 그 주요 요점을 강조했습니다.
Felipe Augusto

0

가장 좋은 방법은 iOS와 Android 모두에서 실행기 아이콘을 개별적으로 변경하는 것입니다.

iOS 및 Android 모듈의 아이콘을 개별적으로 변경하십시오. 플러그인은 왜곡 된 동일한 아이콘에서 다른 크기의 아이콘을 생성합니다.

이 링크를 따르십시오 : https://flutter.dev/docs/deployment/android


-5

pubspec.yaml에서 flutter_launcher_icons를 사용하여이를 달성 할 수 있습니다.

또 다른 방법은 하나는 안드로이드 용이고 다른 하나는 iOS 용입니다

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.