时间戳

首页 > 解决方案 > iOS 在使用 PNG 时会覆盖 `navBarButtonColor`

ios - iOS 在使用 PNG 时会覆盖 `navBarButtonColor`

问题描述

问题描述

在我的应用程序中，我有一个导航栏搜索按钮设置如下：

static navigatorButtons = {
    leftButtons: [
        {
            id: 'back-nav-button',
            icon: require('../assets/images/icons/arrow-left.png')
        }
   ]
};

该按钮在 iOS 和 Android 上均按预期工作，但在 iOS 上该按钮为蓝色。我知道这是所需的行为，并且可以通过设置覆盖颜色navBarButtonColor，但问题是它是一个多色按钮 - 这意味着我希望按钮仅包含 PNG 图像的颜色，而不是navBarButtonColor.

我尝试设置navBarButtonColor为null, transparent，但似乎没有任何效果。

所以我的问题是，有没有办法让导航栏图标呈现所提供的 PNG 的颜色，就像在 Android 上一样？

重现步骤/代码片段/屏幕截图

只需static navigatorButtons = ...使用本地多色 PNG 在 iOS 上运行任何 RNN 应用程序，您就会看到图标的颜色被覆盖。

环境

标签： iosreactjsreact-nativereact-native-navigationwix-react-native-navigation

解决方案

在 iOS 上，UIBarButtonItem使用使用源图像的 Alpha 通道创建的图像。要显示实际图像（不是它的 Alpha 通道蒙版），您需要将图像的渲染模式更改为alwaysOriginal

虽然，查看React Native Image 类文档我看不到renderingMode属性

推荐阅读