我正在做一个React Native应用程序。我想自定义应用程序图标(意味着你点击启动应用程序的图标)。我在谷歌上搜索过,但我一直在寻找不同类型的图标,它们指的是不同的东西。如何将这些类型的图标添加到应用程序中?


当前回答

Android应用图标: 访问这个网站https://appicon.co/

添加图像和生成图标,应该下载 解压文件夹 在他们的副本中,所有AppIcons/android/文件夹(即文件夹 名称:mipmap-xxxhdpi mipmap-xxhdpi mipmap-xhdpi, mipmap-hdpi mipmap-mdpi) 将上述复制的文件夹粘贴到{rootFolder}/android/app/src/main/res/ 并替换现有的 从AndroidManifest.xml中删除这一行 (android: roundIcon =“@mipmap / ic_launcher_round”)

图标添加成功

更改IOS应用程序图标: 访问这个网站https://appicon.co/

添加图像和生成图标,应该下载 解压文件夹 在他们的副本中,所有的文件夹在AppIcons/Assets中。xcassets /(即。 AppIcon。appiconset文件夹) 粘贴AppIcon。Appiconset文件夹 {rootFolder} / ios / {projectname} /图像。Xcassets /和替换现有的

图标添加成功

其他回答

Android Studio有一个非常方便的图标资产向导,叫做Image asset Studio(用户指南)。它是不言自明的,有一些方便的效果,它是内置的:

截图来自Windows 10上的Android Studio 4.1.3

Android应用图标: 访问这个网站https://appicon.co/

添加图像和生成图标,应该下载 解压文件夹 在他们的副本中,所有AppIcons/android/文件夹(即文件夹 名称:mipmap-xxxhdpi mipmap-xxhdpi mipmap-xhdpi, mipmap-hdpi mipmap-mdpi) 将上述复制的文件夹粘贴到{rootFolder}/android/app/src/main/res/ 并替换现有的 从AndroidManifest.xml中删除这一行 (android: roundIcon =“@mipmap / ic_launcher_round”)

图标添加成功

更改IOS应用程序图标: 访问这个网站https://appicon.co/

添加图像和生成图标,应该下载 解压文件夹 在他们的副本中,所有的文件夹在AppIcons/Assets中。xcassets /(即。 AppIcon。appiconset文件夹) 粘贴AppIcon。Appiconset文件夹 {rootFolder} / ios / {projectname} /图像。Xcassets /和替换现有的

图标添加成功

我将使用一个服务来正确缩放图标。http://makeappicon.com/似乎不错。使用较大尺寸的图像,因为放大较小的图像会导致较大的图标像素化。该网站将为你提供iOS和Android的尺寸。

从那里,它只是一个设置图标的问题,就像你会一个普通的本地应用程序。

https://help.apple.com/xcode/mac/8.0/#/dev10510b1f7

设置Android应用程序图标

更新2022

因为阿尔莫罗的答案已经不复存在了

Android和iOS图标

你现在可以在iOS和Android上用一个命令生成圆形图标:

npx icon-set-creator create ./path/to/icon.png

我强烈建议使用至少1024x1024像素的图标

自适应Android图标

npx icon-set-creator create -b <background> -f <foreground> -A

background—颜色(例如:“#ffffff”)或图像资产(例如:“资产/图片/ christmas-background.png”)

前景-图像资产(例如:“资产/图片/ christmas-foreground.png”)

在React-Native项目中为Android设备设置应用程序启动图标:

Take a high resolution image of your logo and place it inside your project directory. Preferably in [Project-DIR]/android/app/src/main/res/ Open Android Studio and run your React-native project. In Android Studio's Project window, select the Android view Right-click the res folder and select New > Image Asset A "Configure Image Asset" window will open; Locate your high resolution image and place set it as your "Foreground layer". Set your "Background Layer" if applicable Click "Next" and continue to finish. Run your application again to see the new app launch icon.

官方文档可以在这里找到:https://developer.android.com/studio/write/image-asset-studio