0

我无法让标签图标在 iOS 模拟器中呈现。

Navigation.startTabBasedApp({
    tabs: [
        {
            label: 'Home',
            screen: 'Home', // this is a registered name for a screen
            icon: require('img_assets/icon_message.png'),
            iconInsets: { top: 0, left: 0, bottom: 0, right: 0 },
            visible: true,
            //selectedIcon: require('../img/one_selected.png'), // iOS only
            title: 'Homepage'
        },
        {
            label: 'Second',
            screen: 'Second',
            icon: js.Lib.require('img_assets/icon_cloud/cloud.png'),
            iconInsets: { top: 0, left: 0, bottom: 0, right: 0 },
            visible: true,
            //selectedIcon: require('../img/two_selected.png'), // iOS only
            title: 'Screen Two'
        }
    ],
    tabsStyle: {
        tabBarButtonColor: '#FF0000',
        tabBarSelectedButtonColor: '#00adf5'
    },
    appStyle: {
        tabBarButtonColor: '#000000', // BottomTabs unselected button color
        tabBarSelectedButtonColor: '#00adf5', // BottomTabs selected button color
    }
});

在 package.json

"dependencies" : { ...
    "img_assets": "file:assets/"

截屏：

在此处输入图像描述

环境

  React Native Environment Info:
    System:
      OS: macOS High Sierra 10.13.4
      CPU: x64 Intel(R) Core(TM) i5 CPU         750  @ 2.67GHz
      Memory: 32.35 MB / 12.00 GB
      Shell: 3.2.57 - /bin/bash
    Binaries:
      Node: 8.12.0 - /usr/local/bin/node
      Yarn: 1.9.4 - /usr/local/bin/yarn
      npm: 6.4.1 - /usr/local/bin/npm
      Watchman: 4.9.0 - /usr/local/bin/watchman
    SDKs:
      iOS SDK:
        Platforms: iOS 11.4, macOS 10.13, tvOS 11.4, watchOS 4.3
    IDEs:
      Android Studio: 3.1 AI-173.4907809
      Xcode: 9.4.1/9F2000 - /usr/bin/xcodebuild
    npmPackages:
      react: 16.5.0 => 16.5.0 
      react-native: 0.57.0 => 0.57.0 
    npmGlobalPackages:
      create-react-native-app: 1.0.0
      react-native-cli: 2.0.1

您对可能发生的事情有任何见解吗？我不再有错误（曾经有一些错误），所以我猜图像现在已正确链接/加载。但是在屏幕上看不到任何东西。

4

2 回答 2

2

问题在于图像本身以及 react-native-navigation 应用“默认”颜色的事实。

于 2018-10-11T07:18:53.290 回答
0

默认情况下不会对图像应用重新缩放，因此需要使用有效分辨率创建它们（并处理 @x1 @x2 和 @x3）。我认为禁用色调会对您有很大帮助:)
如果您使用的是导航库的 v1 或 v2 版本，那么执行此操作的方法会有所不同。

于 2019-01-24T10:18:45.607 回答