反应原生矢量图标赢得了在Android设备中显示

Question

我在react本机项目中使用了react-native-vector-icons，并使用npm start启动了应用。

图标在iOS中正常显示，但在Android中无法显示。

我尝试的事情：

• 在react-native-vector-icons文档中的三个方法（最后我可以在fonts文件夹中看到* .tff文件）
• 使用react-native run-android启动应用。图标显示正常，但我想要的是集成反应原生与我现有的Android应用程序，而不是完全RN应用程序。
• 在我的应用中使用jsbundle文件而不是调试服务器

以上都不起作用

那么，我应该在现有的Android应用程序中添加一些内容吗？

我不知道如何解决这个问题

react@15.2.0

react-native@0.30.0

react-native-vector-icons@2.0.3

node v5.10.1

npm v3.8.3

Answer 1

我遇到了同样的问题，我通过执行以下方法解决了这个问题：

react-native link
react-native run-android

Answer 2

打开android/app/build.gradle并添加以下内容：

apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"

您可以按照说明在Android上正确安装模块：react-native-vector-icons#install-android

Answer 3

我遇到了同样的问题，比我解决了这个问题，让我们尝试一下：

1. 打开android/app/build.gradle（不是android/build.gradle）
2. 添加以下内容：apply from: file("../../node_modules/react-native-vector-icons/fonts.gradle")
3. 此后，您必须停止开发，然后重新启动/运行它（npm run android）

希望这对您有帮助：D

Answer 4

打开 android/app/bundle.gradle

Answer 5

完成下面提到的步骤后，工作正常。

之前，请确保这些步骤。

安装包：

 yarn add react-native-vector-icons

导入：import Ionicons from 'react-native-vector-icons/Ionicons';

示例代码：

return (
      <View style={styles.buttonCircle}>
        <Ionicons
          testID="nextButton"
          name="arrow-forward"
          color="rgba(255, 255, 255, .9)"
          size={24}
          style={{backgroundColor: 'transparent'}}
        />
      </View>
    );

打开 android/app/build.gradle 并在 react.gradle 之后添加下面提到的行。

apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"

打开 android/settings.gradle 在提到的行下面添加。

//添加这两行

include ':react-native-vector-icons'
project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android')

您停止开发服务器并重新运行应用 react-native run-android

希望对您有所帮助。

Answer 6

编辑android/app/build.gradle（不是android/build.gradle）并添加以下内容：

apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"

编辑android/settings.gradle使其看起来像这样（不带+）：

rootProject.name = 'MyApp'

include ':app'

+ include ':react-native-vector-icons'
+ project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android')

参考： https://github.com/oblador/react-native-vector-icons

Answer 7

我遇到了同样的问题，我通过执行来解决这个问题：

npx react-native link react-native-vector-icons

npx react-native run-android

Answer 8

这可能有几个可能的答案：

1-也许您使用的图标仅适用于ios ...尝试在下面的链接中查看其他徽标包：https://oblador.github.io/react-native-vector-icons

2-也许您导入错误的链接以使用导入此矢量图标的代码顶部的包，导入确切的链接，例如：

这是错误的：import Icon from "react-native-vector-icons 这是真的："import Icon from "react-native-vector-icons/MaterialIcons";"

Answer 9

我已经按照其他答案中的说明配置了所有内容，但仍在运行react-native run-android，我始终看到该应用程序没有图标！

我做到了：

cd android && ./gradlew clean

然后另一个

react-native run-android

它有效是的！

Answer 10

在同一项目路径上打开终端：

react-native link react-native-vector-icons 
react-native run-android 

Answer 11

按照官方的建议（https://github.com/oblador/react-native-vector-icons#android）在创建捆绑包时加载此模块：

编辑android / app / build.gradle（不是android / build.gradle）并添加 以下：

<GameScreen>: ChaseTheAce:ChaseTheAce name: "GameScreen" GridLayout: rows: 3 Image: id: cardimage source: ChaseTheAce.cardimagefile #<<<<<<<<<<<<<<<<<<< allow_stretch: True GridLayout: dealer:deal cols: 3 Button: id: deal text: "Deal" on_release: app.deal()