React-Native应用程序图标需要哪些尺寸？

22 浏览
0 Comments

React-Native应用程序图标需要哪些尺寸？

我正在制作一个React Native应用程序。我想要自定义应用程序图标（这意味着您单击以启动应用程序的图标）。我已经进行了谷歌搜索，但我一直找到不同类型的图标，涉及不同的事情。我该如何将这些类型的图标添加到应用程序中？

admin 更改状态以发布 2023年5月22日
0

2 答案

0 Comments

我写了一个生成器，可以从单个图标文件中自动生成您的React Native应用程序所需的图标。 它会生成您的资源文件，并将它们正确地添加到iOS和Android项目中：

更新（04/09/2019）

我们重新设计了我们的生成器以符合生态系统的标准。 您现在可以使用@bam.tech/react-native-make。

您可以使用以下命令yarn add @bam.tech/react-native-make在React Native项目中安装它

要使用它，请输入以下命令react-native set-icon --path --background --platform

然后...就这样！ 希望能对他人有所帮助 🙂

建议：

以下是相对于以前工具的一些改进：

  • 不再需要Yeoman依赖，现在已成为React Native CLI插件
  • 不再需要ImageMagick依赖
  • 为Android创建自适应图标
  • 添加了iOS缺失的图标尺寸
0
0 Comments

iOS图标

  • 在Images.xcassets中设置AppIcon。
  • 添加9个不同大小的图标：
    • 29pt
    • 29pt*2
    • 29pt*3
    • 40pt*2
    • 40pt*3
    • 57pt
    • 57pt*2
    • 60pt*2
    • 60pt*3。

Images.xcassets看起来像这样：

Android图标

  • 将ic_launcher.png放入文件夹[ProjectDirectory]/android/app/src/main/res/mipmap-*/中。
    • mipmap-hdpi中72*72的ic_launcher.png。
    • mipmap-mdpi中48*48的ic_launcher.png。
    • mipmap-xhdpi中96*96的ic_launcher.png。
    • mipmap-xxhdpi中144*144的ic_launcher.png。
    • mipmap-xxxhdpi中192*192的ic_launcher.png。

Android 2019年更新

React Native的最新版本也支持圆形图标。对于这种特殊情况，您有两种选择：

A. 添加圆形图标：在每个mipmap文件夹中，除了ic_launcher.png文件外，还添加一个相同大小的圆形版本，名称为ic_launcher_round.png。

B. 删除圆形图标：在yourProjectFolder/android/app/src/main/AndroidManifest.xml中删除android:roundIcon="@mipmap/ic_launcher_round"一行，并保存。

否则，构建会报错。

0