android Wix-Navigation 中图标的 React-native 问题，在 iOS 中运行良好

Question

在 ios 中显示图标存在问题，但在 android 中，尺寸减小了，我在 react-native 中使用 Wix 导航，所有其他图标在两个平台上都显示完美，但在导航中添加的那个图标有问题

这是底部标签的代码

 const HomeIcon = require("../assets/images/tabs/home_off.png");
  const HomeIconSelected = require("../assets/images/tabs/home_on.png");

  const HomeIconx = require("../assets/images/home_off.png");
  const HomeIconSelectedx = require("../assets/images/home_on.png");

  const MessageIcon = require("../assets/images/tabs/chat_off.png");
  const MessageIconSelected = require("../assets/images/tabs/chat_on.png");

  const MessageIconx = require("../assets/images/chat_off.png");
  const MessageIconSelectedx = require("../assets/images/chat_on.png");

  const PostIcon = require("../assets/images/tabs/edit.png");
  const PostIconSelected = require("../assets/images/tabs/edit.png");

  const PostIconx = require("../assets/images/edit_home.png");
  const PostIconSelectedx = require("../assets/images/edit_home.png");

  const ProfileIcon = require("../assets/images/tabs/profile_off.png");
  const ProfileIconSelected = require("../assets/images/tabs/profile_on.png");

  const ProfileIconx = require("../assets/images/profile_off.png");
  const ProfileIconSelectedx = require("../assets/images/profile_on.png");

  const NotiIcon = require("../assets/images/tabs/notificatin_off.png");
  const NotiIconSelected = require("../assets/images/tabs/notificatin_on.png");

  const NotiIconx = require("../assets/images/notificatin_off.png");
  const NotiIconSelectedx = require("../assets/images/notificatin_on.png");
  Navigation.setRoot({
    root: {
      id: "root",
      sideMenu: {
        id: "leftSideMenu",
        left: leftSideMenu("leftSideMenu", theme),
        center: {
          bottomTabs: {
            appStyle: {
              forceTitlesDisplay: true,
            },
            titleDisplayMode: "alwaysShow",
            id: "bottomTabs",
            children: [
              {
                stack: zeroTabStack(
                  Platform.OS == "ios" ? HomeIcon : HomeIconx,
                  Platform.OS == "ios" ? HomeIconSelected : HomeIconSelectedx,
                  theme
                ),
              },
              {
                stack: firstTabStack(
                  Platform.OS == "ios" ? MessageIcon : MessageIconx,
                  Platform.OS == "ios"
                    ? MessageIconSelected
                    : MessageIconSelectedx,
                  theme
                ),
              },
              {
                stack: secondTabStack(
                  Platform.OS == "ios" ? PostIcon : PostIconx,
                  Platform.OS == "ios" ? PostIconSelected : PostIconSelectedx,
                  theme
                ),
              },
              {
                stack: thirdTabStack(
                  Platform.OS == "ios" ? ProfileIcon : ProfileIconx,
                  Platform.OS == "ios"
                    ? ProfileIconSelected
                    : ProfileIconSelectedx,
                  theme
                ),
              },
              {
                stack: fourthTabStack(
                  Platform.OS == "ios" ? NotiIcon : NotiIconx,
                  Platform.OS == "ios" ? NotiIconSelected : NotiIconSelectedx,
                  theme
                ),
              },
            ],
          },
        },
      },
    },
  });

导航页眉代码

component: {
                        name: TERM_AND_CONDITIONS,
                        passProps: {
                          name: "Settings",
                        },
                        options: {
                          topBar: {
                            title: {
                              text: "Terms And Conditions",
                              alignment: "center",
                              color: color.text_color,
                              fontFamily:
                                Platform.OS === "ios"
                                  ? "Roboto-Medium"
                                  : "RobotoRegular",
                            },
                            background: { color: color.background },

                            backButton: {
                              icon: Images.back,
                              showTitle: "hide",
                              color: color.text_color,
                            },
                            visible: true,
                          },
                          bottomTabs: {
                            backgroundColor:
                              props.theme && props.theme === "dark"
                                ? "#000"
                                : "#fff",
                          },
                        },
                      },

iOS

安卓

Answer 1

Android 上的标题文本似乎是默认呈现的，即使它没有提供。我通过设置titleDisplayMode: 'alwaysHide'解决了它

Navigation.setRoot({
    root: {
      bottomTabs: {
        children: [...],
        options: {
          bottomTabs: {
            titleDisplayMode: 'alwaysHide',
          },
        },
      },
    },
  })