zIndex可在Android上运行，但不能在iOS React Native 0.60.4上运行

问题描述

请参阅附件中的图像以供参考，我希望像Android一样输出。我使用的是本机反应0.60.4，我希望“群体和机会”在前面。我的当前代码在Android设备上运行正常，但在iOS设备上运行不正常，请帮助。

我的代码是：

<View style={{ marginTop: 4,marginLeft: -30,zIndex: 0 }}>
  <View
    style={{
      flexDirection: "row",justifyContent: "center",}}
  >
    <View
      onTouchStart={() => this.props.navigation.navigate("Profiles")}
      style={{
        width: height / 3.8,height: height / 3.8,borderRadius: height / 2.3,backgroundColor: "rgba(147,144,198,1)",opacity: 0.98
      }}
    >
      <Text
        style={{
          ...CommonStyles.TellYourFriendButtonTextStyle(),borderRadius: 50,textAlign: "center",position: "absolute",alignSelf: "center",color: "white",fontSize: parseInt(height / 38)
        }}
      >
        {Strings.lbl_profiles}
      
      </Text>
    </View>

    <View style={{ justifyContent: "flex-end" }}>
      <View
       onTouchStart={ () =>
        this.props.navigation.push("OpportunitiesForHome",{
          moduleStrings: this.state.appString,userid: this.state.user_id,isUserProfile: false,isFromHome: true
        })
      }
        style={{
          width: height / 5.8,height: height / 5.8,borderRadius: height / 3.3,backgroundColor: "rgba(71,76,125,marginLeft: -18,marginBottom: 35,opacity: 0.98,zIndex: 1
        }}
      >
        <Text
          style={{
            ...CommonStyles.TellYourFriendButtonTextStyle(),fontSize: parseInt(height / 47)
          }}
        >
          {Strings.lbl_opportunities}
        </Text>
      </View>
    </View>
  </View>
  <View
    style={{
      flexDirection: "row",}}
  >
    <View
      style={{
        marginTop: -55,width: height / 5.1,height: height / 5.1,borderRadius: height / 2.8,backgroundColor: "rgba(76,77,150,marginRight: -5,zIndex: 1
      }}
      onTouchStart={() => this.props.navigation.navigate("FindGroups")}
    >
      <Text
        style={{
          ...CommonStyles.TellYourFriendButtonTextStyle(),fontSize: parseInt(height / 40)
        }}
      >
        {Strings.lbl_groups}
      </Text>
    </View>

    <View style={{ justifyContent: "flex-end" }}>
      <View
        onTouchStart={() =>
          this.props.navigation.navigate("Events")
        }
        style={{
          marginTop: -80,width: height / 4.4,height: height / 4.4,backgroundColor: "rgba(101,98,172,marginLeft: -5,}}
      >
        <Text
          style={{
            ...CommonStyles.TellYourFriendButtonTextStyle(),fontSize: parseInt(height / 40)
          }}
        >
          {Strings.lbl_events}
        </Text>
      </View>
    </View>
  </View>

  <View
    style={{
      flexDirection: "row",justifyContent: "center"
    }}
  >
   
   <View
      style={{
        marginTop: -65,marginLeft: 145,width: height / 5.8,backgroundColor: "rgba(129,105,161,opacity: 0.98
      }}
      onTouchStart={ () =>
      this.props.navigation.push("Business")
    }
    >
      <Text
        style={{
          ...CommonStyles.TellYourFriendButtonTextStyle(),borderRadius: 250,fontSize: parseInt(height / 47)
        }}
      >
         {Strings.lbl_business}
      </Text>
    </View>

    <View
      style={{
        marginTop: -68,marginLeft: 10,width: height / 7.2,height: height / 7.2,backgroundColor: "rgba(150,202,opacity: 0.98
      }}
      onTouchStart={ () =>
        this.props.navigation.push("ForSale")
      }
    >
      <Text
        style={{
          ...CommonStyles.TellYourFriendButtonTextStyle(),fontSize: parseInt(height / 53)
        }}
      >
         {Strings.lbl_forsale}
      </Text>
    </View>
  </View>
</View>

在Android上的屏幕截图：

iOS上的屏幕截图：

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）