Diego Monsalve
Diego Monsalve

Reputation: 97

place the footer at the bottom of a react native Drawer

I have tried in many ways to try to position my footer at the bottom of the Drawer ... If someone knows, can you please tell me, the idea is to place the component with the Footer text in the lower part (Image)

enter image description here

I do not put the code of the application with mine, but I put a snack of react native with an added View that is the one that wants to put in the bottom

https://snack.expo.io/@monsadiego/ask-footer-reactnative

component to place on the bottom:

   <Text>
        This text in the footer ...
        </Text>
        </View>

Upvotes: 0

Views: 1309

Answers (1)

Nacho Zullo
Nacho Zullo

Reputation: 571

You could add contentContainerStyle={{ flex: 1 }} to the DrawerContentScrollView component and then add a <View style={{ flex: 1 }} /> in the top of your footer.

function CustomDrawerContent(props) {
  return (
    <DrawerContentScrollView {...props} contentContainerStyle={{ flex: 1 }}>
      <DrawerItemList {...props} />
      <DrawerItem label="Help" onPress={() => alert('Link to help')} />
      {/* Add this View */}
      <View style={{ flex: 1 }} />
      <View>
        <Text>This text in the footer ...</Text>
      </View>
    </DrawerContentScrollView>
  );
}

Upvotes: 4

Related Questions