如何删除短语图像中默认插入的阴影？

Question

我有一个带有图像内部和文本的抽屉，但是当选择默认图像时，它会突出显示，其余部分会留下阴影，我希望它们都是相同的，不仅在我选择该组件时看起来很好。接下来，我会想象你想要什么和我得到什么的形象。

what i want to do

what i have done

我的代码：

    const DrawerNavigator = createDrawerNavigator(
  {
    DIPUTADOS: {
      screen: DiputadosStack,
      navigationOptions
    },
    BLOQUES: {
      screen: BloquesStack,
      navigationOptions: {
        drawerIcon: () => {
          return (
            <Image
              style={styles.Icon}
              source={require("./src/assets/Menu-002-b.png")}
            />
          );
        }
      }
    },
    INTERBLOQUES: {
      screen: InterBloquesStack,
      navigationOptions: {
        drawerIcon: () => {
          return (
            <Image
              style={styles.Icon}
              source={require("./src/assets/Menu-003-b.png")}
            />
          );
        }
      }
    },
    COMISIONES: {
      screen: ComisionesStack,
      navigationOptions: {
        drawerIcon: () => {
          return (
            <Image
              style={styles.Icon}
              source={require("./src/assets/Menu-004-b.png")}
            />
          );
        }
      }
    },
    AUTORIDADES: {
      screen: AutoridadesStack,
      navigationOptions: {
        drawerIcon: () => {
          return (
            <Image
              style={styles.Icon}
              source={require("./src/assets/Menu-005-b.png")}
            />
          );
        }
      }
    },
    "SESIÓN EN VIVO": {
      screen: SesionEnVivoStack,
      navigationOptions: {
        drawerIcon: () => {
          return (
            <Image
              style={styles.Icon}
              source={require("./src/assets/Menu-006-b.png")}
            />
          );
        }
      }
    },
    "DIPUTADOS TV": {
      screen: DiputadosTVStack,
      navigationOptions: {
        drawerIcon: () => {
          return (
            <Image
              style={styles.Icon}
              source={require("./src/assets/Menu-007-b.png")}
            />
          );
        }
      }
    },
    REGLAMENTOS: {
      screen: PDFReglamentosStack,
      navigationOptions: {
        drawerIcon: () => {
          return (
            <Image
              style={styles.Icon}
              source={require("./src/assets/Menu-008-b.png")}
            />
          );
        }
      }
    }
  },
  {
    contentComponent: CustomDrawerContentComponent,
    drawerWidth: width * 0.63,
    contentOptions: {
      activeTintColor: blue,
      inactiveTintColor: grey,
      itemsContainerStyle: {
        textAlign: "center"
      },
      labelStyle: {
        fontFamily: "RobotoCondensed-Regular",
        fontWeight: "400",
        fontSize: 17,
        marginLeft: -5
      },
      iconContainerStyle: {
        alignItems: "center"
      }
    }
  }
);

Answer 1

你可以使用overlayColor。 https://reactnavigation.org/docs/en/drawer-navigator.html#drawernavigatorconfig

{
    overlayColor: 'rgba(0,0,0,0.1)', // if you wannt no color, you can write 'transparent'.
    contentComponent: CustomDrawerContentComponent,
    drawerWidth: width * 0.63,
    contentOptions: {
      activeTintColor: blue,
      inactiveTintColor: grey,
      itemsContainerStyle: {
        textAlign: "center"
      },
      labelStyle: {
        fontFamily: "RobotoCondensed-Regular",
        fontWeight: "400",
        fontSize: 17,
        marginLeft: -5
      },
      iconContainerStyle: {
        alignItems: "center"
      }
    }
  }