如何在字符串和图标之间编辑 -add 边距？反应原生 - 抽屉

【问题标题】：How can I edit -add margin between the string and the icon? REACT-NATIVE - DRAWER如何在字符串和图标之间编辑 -add 边距？反应原生 - 抽屉
【发布时间】：2020-09-27 07:02:56
【问题描述】：

我正在构建一个侧边栏菜单，我使用react-navigation-drawer，代码如下：

    const drawer = createDrawerNavigator({ //hooks
            Home: { screen: Home_Stack, navigationOptions: {drawerIcon: <Entypo name = "home" size = {24} color = {"black"}></Entypo>}},
            About: { screen: Slide_menu_stack}
    });

    export default createAppContainer(drawer);

它看起来像这样：

我希望家离图标更近，我该怎么做？

【问题讨论】：

标签： javascript react-native android-studio

【解决方案1】：

您可以创建一个自定义抽屉组件，如 think

import { NavigationContainer } from '@react-navigation/native';
import {createDrawerNavigator,} from '@react-navigation/drawer'; 
const Drawer = createDrawerNavigator();

export function MyDrawer() {
 return (
<NavigationContainer>
<Drawer.Navigator drawerContent={props => <CustomDrawerContent {...props} />}>

  <Drawer.Screen name="Home" component={Home_Stack} />
  <Drawer.Screen name="About" component={Slide_menu_stack} />

</Drawer.Navigator>
</NavigationContainer>
);
}

和我创建的这样的定制抽屉

function CustomDrawerContent(props) {

  return (
    <View style={styles.container}>
      <ScrollView>
        {here you can style your drawer as you want}
      </ScrollView>
    </View>
  )
}

【讨论】：