React Native 앱을 만들고 있습니다. 앱 아이콘을 사용자 정의하고 싶습니다 (앱을 시작하기 위해 클릭하는 아이콘을 의미 함). 나는 이것을 구글 검색했지만 다른 것을 나타내는 다른 유형의 아이콘을 계속 찾습니다. 이러한 유형의 아이콘을 앱에 어떻게 추가합니까?
답변
iOS 아이콘
- 설정
AppIcon에서Images.xcassets. - 9 가지 크기의 아이콘 추가 :
29pt29pt*229pt*340pt*240pt*357pt57pt*260pt*260pt*3.
Images.xcassets 다음과 같이 보일 것입니다 :
안드로이드 아이콘
ic_launcher.png폴더를 넣 습니다[ProjectDirectory]/android/app/src/main/res/mipmap-*/.- 72 * 72
ic_launcher.png에서mipmap-hdpi. - 48 * 48
ic_launcher.png에서mipmap-mdpi. - 96 * 96
ic_launcher.png에서mipmap-xhdpi. - 144 * 144
ic_launcher.png에서mipmap-xxhdpi. - 192 * 192
ic_launcher.png에서mipmap-xxxhdpi.
- 72 * 72
2019 안드로이드 업데이트
반응 네이티브의 최신 버전은 원형 아이콘도 지원합니다. 이 특정한 경우 두 가지 선택이 있습니다.
A. 라운드 아이콘 추가 :
각 밉맵 폴더 에서 동일한 크기 ic_launcher.png의 라운드 버전도 파일에 추가하십시오 ic_launcher_round.png.
B. 둥근 아이콘 제거 :
내부 yourProjectFolder/android/app/src/main/AndroidManifest.xml에서 선을 제거 android:roundIcon="@mipmap/ic_launcher_round"하고 저장합니다.
그렇지 않으면 빌드에서 오류가 발생합니다.
답변
단일 아이콘 파일에서 반응 네이티브 앱의 아이콘 을 자동으로 생성 하는 생성기를 작성했습니다 . 자산을 생성하고 iOS 및 Android 프로젝트에 올바르게 추가합니다.
업데이트 (04/09/2019)
우리는 발전기를 생태계 표준에 맞게 업데이트했습니다. 이제 @ bam.tech / react-native-make를 사용할 수 있습니다 .
반응 네이티브 프로젝트에서 다음을 사용하여 설치할 수 있습니다 .yarn add @bam.tech/react-native-make
그것을 사용 하려면 react-native set-icon --path <path_to_png> --background <icon_background_color> --platform <android|ios>
그리고 그게 다야! 그것이 다른 사람들에게 유용 할 수 있기를 바랍니다 🙂
추천 :
- 1024×1024 기본 이미지
- iOS에 투명한 배경이 없습니다.
- Android 용 적응 형 아이콘 지침 을 따르는 아이콘
이전 도구보다 개선 된 사항 은 다음과 같습니다 . ?
- Yeoman 의존성이 없으며 이제 react-native-cli 플러그인입니다.
- 이미지 Magick 의존성이 없음
- Android 용 적응 형 아이콘 생성
- iOS에 누락 된 아이콘 크기 추가
답변
서비스를 사용하여 아이콘의 크기를 올바르게 조정합니다. http://makeappicon.com/ 은 좋아 보인다. 작은 이미지를 확대하면 더 큰 아이콘이 픽셀 화 될 수 있으므로 더 큰 크기의 이미지를 사용하십시오. 이 사이트는 iOS와 Android 모두 크기를 제공합니다.
거기에서 일반 네이티브 앱처럼 아이콘을 설정하면됩니다.
https://help.apple.com/xcode/mac/8.0/#/dev10510b1f7
답변
이 사람의 조언을 따르고 Android Asset Studio를 사용하여 반응 형 네이티브 안드로이드 프로젝트에 앱 아이콘을 추가 할 수있었습니다.
링크가 끊어 질 경우를 대비하여 다음과 같이 기록됩니다.
React-Native Android에서 애플리케이션 아이콘을 업로드하는 방법
1) 이미지를 Android Asset Studio에 업로드하십시오 . 적용 할 효과를 선택하십시오. 이 도구는 zip 파일을 생성합니다. 다운로드 .Zip을 클릭하십시오.
2) 컴퓨터에서 파일을 압축 해제하십시오. 그런 다음 원하는 이미지를 /android/app/src/main/res/폴더로 드래그하십시오 . 각 이미지를 오른쪽 하위 폴더에 넣어야합니다mipmap-{hdpi, mdpi, xhdpi, xxhdpi, xxxhdpi}.
3) 원래 폴더를 순전히 res 폴더 위로 드래그 앤 드롭하지 마십시오. /res/values/{strings,styles}.xml파일을 완전히 제거 할 수도 있습니다 .
답변
누군가이 작업을 위해 매우 사용하기 쉬운 도구를 만들었습니다 : https://www.npmjs.com/package/app-icon
이 간단한 도구를 사용하면 반응 네이티브 프로젝트에서 단일 아이콘을 만든 다음 필요한 모든 크기의 아이콘을 만들 수 있습니다. 현재 iOS 및 Android에서 작동합니다.
나는 그것을 사용했다. 512×512 png를 만든 다음 해당 도구와 붐을 실행했습니다. 매우 쉽습니다.
답변
여기에 조금 늦었지만 Android Studio에는 매우 편리한 아이콘 자산 마법사가 있습니다. 자체 설명이 필요하지만 몇 가지 편리한 효과가 있으며 내장되어 있습니다.
답변
Rockvic이 말했듯이 iOS와 Android에 대해 서로 다른 크기의 아이콘이 필요합니다. 또한 관심이 있다면 다른 크기의 아이콘을 생성하는 데이 사이트를 권장합니다. 아무것도 다운로드하지 않아도 완벽하게 작동합니다.
도움이 되길 바랍니다.
