Как переопределить поведение по умолчанию панели навигации в реагировать родной? - PullRequest
Новая
       71

Как переопределить поведение по умолчанию панели навигации в реагировать родной?

0 голосов
/ 05 февраля 2020

Есть ли способ, чтобы панель навигации закрывалась (go вне экрана) больше, чем ширина экрана?

Причина, по которой я спрашиваю это, заключается в том, что в моем блоке навигации у меня есть значок плавающий вне навигационного ящика вот так

enter image description here

И когда ящик закрыт, то получается результат

enter image description here

Как видите, плавающая часть все еще видна.

Вот мой код 

    const Drawer = createDrawerNavigator(
    {
      Home: { screen: Home },
      Anatomy: { screen: Anatomy },
      Header: { screen: Header },
      Footer: { screen: Footer },
      NHBadge: { screen: NHBadge }
    },
    {
      initialRouteName: "Home",
      drawerLockMode: 'locked-closed',
      drawerPosition: 'right',
      drawerWidth: 300,
      contentComponent: props => <SideBar {...props} />
    }
    );

А это код боковой панели 

  render() {
return (
  <Container>
    <View style={styles.drawerCover} />
    <Image square style={styles.drawerImage} source={drawerImage} />

    <Content
      bounces={false}
      style={{ flex: 1, backgroundColor: "#fff", top: -1 }}
    >

      <List
        dataArray={datas}
        renderRow={data =>
          <ListItem
            button
            noBorder
            onPress={() => this.props.navigation.navigate(data.route)}
          >
            <Left>
              <Icon
                active
                name={data.icon}
                style={{ color: "#777", fontSize: 26, width: 30 }}
              />
              <Text style={styles.text}>
                {data.name}
              </Text>
            </Left>
            {data.types &&
              <Right style={{ flex: 1 }}>
                <Badge
                  style={{
                    borderRadius: 3,
                    height: 25,
                    width: 72,
                    backgroundColor: data.bg
                  }}
                >
                  <Text
                    style={styles.badgeText}
                  >{`${data.types} Types`}</Text>
                </Badge>
              </Right>}
          </ListItem>}
      />
    </Content>
  </Container>
);
}
}

РЕДАКТИРОВАТЬ: Решение

Вот как я решил проблему: Изменен рендеринг изображения в зависимости от состояния панели навигации (закрыть / открыть)

...