Skip to content Skip to sidebar Skip to footer

Position Drawer Element At The Bottom Of The Menu

how is it possible to position the menu point at the lower edge of the screen? The best solution would be if you could simply change the style of the navigation options for each el

Solution 1:

According to react-navigation you can make a custom Drawer navigator, so what you need is to create a similar thing to their example:

import { DrawerItems, SafeAreaView } from'react-navigation';

constCustomDrawerContentComponent = (props) => (
  <ScrollView><SafeAreaViewstyle={styles.container}forceInset={{top: 'always', horizontal: 'never' }}><DrawerItems {...props} /></SafeAreaView></ScrollView>
);

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
});

So in your case what you want to do is:

import { DrawerItems, SafeAreaView } from'react-navigation';

    constCustomDrawerContentComponent = (props) => (
      <ScrollView><SafeAreaViewstyle={styles.container}forceInset={{top: 'always', horizontal: 'never' }}><Viewstyle={{flex:1 }}><DrawerItems {...props} /></View><TouchableOpacitystyle={{flexDirection: 'row', alignItems: 'center'}}>
              //Your pencil icon here with correct margin to the right
              <Text>Bearbeiten</Text></TouchableOpacity></SafeAreaView></ScrollView>
    );

    const styles = StyleSheet.create({
      container: {
        flex: 1,
      },
    });

Post a Comment for "Position Drawer Element At The Bottom Of The Menu"