如何设置反应原生侧边菜单的样式？答案

【问题标题】：How to style the react native side menu?如何设置反应原生侧边菜单的样式？
【发布时间】：2018-01-09 04:56:09
【问题描述】：

我使用 react native 侧边菜单开发了侧边菜单，想知道如何将图像样式设置为下图中的设计：

只是用样式来做吗？如果是这样可以调整侧面菜单的屏幕宽度，因为也没有找到任何解决方案。谢谢你。我使用 react-native-side-menu 完成的侧边菜单。

//侧边菜单代码：

<View style={{backgroundColor: '#ededed', marginBottom: 20}}>
      <TouchableHighlight>
        <Text>Menu</Text>
      </TouchableHighlight>
      <TouchableHighlight onPress={this.TodoList}>
        <Text>WR List</Text>
      </TouchableHighlight>
      <TouchableHighlight onPress={this.addNewTodo}>
        <Text>Create WR</Text>
      </TouchableHighlight>
      </View>
// the style

menu: {
    flex: 1,
    width: window.width,
    height: window.height,
    padding: 0,
  },

我已经按照你刚才提到的 react-native-elements 尝试了样式，我想像示例图像一样设置它的样式，但不知道该怎么做。还有一个问题是 react-native-side-menu 不能调整它的屏幕宽度，因为当打开侧面菜单时它会覆盖屏幕的 2/3 宽度，是否可以调整它？谢谢

【问题讨论】：

是什么阻止你像这样使用“风格”：react-native-training.github.io/react-native-elements/API/… ??如果可能的话，你能分享你的代码吗？
我不知道如何像上面的示例图像那样设置样式，请找到下面的代码和如何做的建议，谢谢~~~
先生，请看截图。我在社区中发布了这个问题，但他们说它似乎已经过时了......i.stack.imgur.com/Jc3Ch.png

标签： android css react-native styles side-menu

【解决方案1】：

Nvm，我使用另一种方法来做到这一点，即使用来自 react native 库的 Drawer Layout Android，因为它可以用来调整抽屉宽度，并且可以用来导航到其他页面。以下是 Drawer Layout Android 的文档： http://blog.csdn.net/github_33304260/article/details/55517995

【讨论】：

【解决方案2】：

也许你可以关注thisidea。我使用库react-native-drawer-layout 创建侧边菜单。

实际上这个想法可以显示为：

//Main apps

//When button Menu cliked.

【讨论】：

实际上我成功地使用了来自 react native 的 Drawer Layout Android，我可以按照上面显示的图像进行设计，顺便说一句谢谢您的帮助...:)
哇...酷。不客气。我很高兴帮助你。你能接受我的回答吗？ ;))
嗨，先生，我使用 react-native-drawer-layout 尝试了您的示例，但在 Android 和 iOS 平台中收到此错误消息“无法读取 'isRTL' 未定义的属性”。你能帮我解决这个问题吗？谢谢
嗨@johnhour ..您是否尝试过删除node_module 文件夹，并尝试再次运行npm install 并安装您在项目中使用的库。
你能更清楚地显示 SC 的错误，所以也许我可以看到实际发生了什么......因为在我的模拟器中 my code 工作得很好。