我正在做一个React Native应用程序。我想自定义应用程序图标(意味着你点击启动应用程序的图标)。我在谷歌上搜索过,但我一直在寻找不同类型的图标,它们指的是不同的东西。如何将这些类型的图标添加到应用程序中?
当前回答
如果你想在React Native上导入图标而不需要图片,那么React - Native -vector-icons将是最好的选择。如果您不想下载图标并在项目中使用它,您可以使用它。
其他回答
iOS图标
在Images.xcassets中设置AppIcon。 添加9个不同大小的图标: 29 pt 29 pt * 2 29 pt * 3 40 pt * 2 40 pt * 3 57分 57 pt * 2 60 pt * 2 60 pt * 3。
图像。Xcassets看起来是这样的:
Android图标
将ic_launcher.png放入[ProjectDirectory]/android/app/src/main/res/mipmap-*/文件夹中。 mimmap -hdpi中的72*72 ic_launcher.png。 mimmap -mdpi中的48*48 ic_launcher.png。 mimmap -xhdpi中的96*96 ic_launcher.png。 144*144 ic_launcher.png mimmap -xxhdpi。 mimmap -xxxhdpi中的192*192 ic_launcher.png。
2019年更新
react native的最新版本也支持圆形图标。对于这种特殊情况,您有两个选择:
A.添加圆形图标: 在每个mipmap文件夹中,在ic_launcher.png文件中添加一个同样大小的圆形版本,称为ic_launcher_round.png。
B.移除圆形图标: 在你的projectfolder /android/app/src/main/AndroidManifest.xml中删除一行android:roundIcon="@mipmap/ic_launcher_round"并保存它。
否则构建将抛出错误。
使用这个库可以使您的工作更容易。 它将自动化您的图标生成过程
https://www.npmjs.com/package/@bam.tech/react-native-make
这有助于人们努力寻找更好的网站来生成图标和飞溅屏幕
制作应用图标(android和ios都有用) APE工具(android和ios都有用) 图标集创建器(仅适用于ios) android Asset Studio(仅适用于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-elements,并在你的react native应用程序中使用font-awesome图标
安装
npm install --save react-native-elements
然后把它导入到你想要使用图标的地方
import { Icon } from 'react-native-elements'
像这样使用它
render() {
return(
<Icon
reverse
name='ios-american-football'
type='ionicon'
color='#517fa4'
/>
);
}
推荐文章
- 如何设置电子/原子壳应用程序的应用程序图标
- 在react native中隐藏/显示组件
- React-Native:应用程序未注册错误
- 禁用react native按钮
- Android加载JS包失败
- 在React Native中使用Fetch授权头
- 如何在React中使用钩子强制组件重新渲染?
- 在应用程序启动时出现“无法获得BatchedBridge,请确保您的bundle被正确打包”的错误
- 在没有开发服务器的情况下在设备上构建和安装unsigned apk ?
- 网络请求失败
- 如何在。net中创建和使用资源
- 如何在React Native中浮动?
- 在React Native中获取一个视图的大小
- Axios获取url工作,但第二个参数作为对象,它不
- 什么是useState()在React?