1

我正在开发导航抽屉:

<Drawer.Navigator
    initialRouteName={InitialScreen}
    drawerContent={props => <MyDrawer {...props} />}
    screenOptions={{
        headerShown: true,
    }}>
    <Drawer.Screen name="main" component={MainScreen} />
</Drawer.Navigator>

正如您在上面看到的,我正在通过实现自己的MyDrawer组件来自定义抽屉的内容。

在 的渲染部分MyDrawer,我有:

return (
    <View style={styles.myContent}>
      <DrawerContentScrollView
        style={{flex: 1, top: 0, bottom: 0, backgroundColor: 'yellow'}}
        {...props}>
        <View
          style={{
            backgroundColor: 'green',
            flex: 1,
            width: '100%',
            height: '100%',
          }}>
          <View>
            <DrawerItem name="Purhcase" text="Purchase" />
            <DrawerItem name="Sell" text="Sell" />
          </View>
          ...
        </View>
      </DrawerContentScrollView>
    </View>
  );

const styles = StyleSheet.create({
  myContent: {
    flex: 1,
    paddingLeft: 0,
    paddingTop: 10,
  }
});

我想要通过填充整个高度来View直接包裹的绿色组件。上面的代码显示了我尝试过的内容,但无论我做什么,那个绿色的 View 组件总是只根据它包装的内容占据高度。那么如何让它填满整个高度呢?DrawerContentScrollViewDrawerContentScrollView

4

1 回答 1

6

style将您的道具更改DrawerContentScrollViewcontentContainerStyle.

于 2020-07-27T17:07:27.303 回答