我正在做一个React Native应用程序。我想自定义应用程序图标(意味着你点击启动应用程序的图标)。我在谷歌上搜索过,但我一直在寻找不同类型的图标,它们指的是不同的东西。如何将这些类型的图标添加到应用程序中?
当前回答
在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
其他回答
更新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”)
我遵循了他的建议并使用android Asset Studio在react-native android项目中添加了应用图标
以下是为防止链接失效而转录的内容:
如何在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文件。
你可以导入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'
/>
);
}
我将使用一个服务来正确缩放图标。http://makeappicon.com/似乎不错。使用较大尺寸的图像,因为放大较小的图像会导致较大的图标像素化。该网站将为你提供iOS和Android的尺寸。
从那里,它只是一个设置图标的问题,就像你会一个普通的本地应用程序。
https://help.apple.com/xcode/mac/8.0/#/dev10510b1f7
设置Android应用程序图标
我想建议使用react-native-vector-icons将图标导入到您的项目。当你使用矢量图标时,你不需要担心图标缩放方面。在使用该软件包时,您可以使用所有流行的图标集,如fontawesome, ionicons等。
除了这些图标集,你也可以把你自己的图标打包为一个ttf文件,你可以直接导入到android和ios项目react-native项目。您可以使用相同的react-native-vector-icons库来管理这些图标
下面是设置自定义图标的详细过程
https://medium.com/bam-tech/add-custom-icons-to-your-react-native-application-f039c244386c
推荐文章
- 如何设置电子/原子壳应用程序的应用程序图标
- 在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?