DrawerLayoutAndroid

React 组件封装平台 DrawerLayout（仅适用于Android）。Drawer（通常用于导航）呈现 renderNavigationView 渲染导航视图和直接子级，是呈现（您的内容）的主要视图。导航视图是最初在屏幕上不可见的，但可以从由 drawerPosition 指定的窗口的侧面拉出，其宽度可通过 drawerWidth 设置。

例如： 

  1.     render: function() {      
  2.       var navigationView = (     
  3.                <Text style={{margin: 10, fontSize: 15, textAlign: 'left'}}>I'm in the   
  4.     Drawer!</Text  
  5.       );  
  6.       return (  
  7.     <DrawerLayoutAndroid  
  8.       drawerWidth={300}  
  9.       drawerPosition={DrawerLayoutAndroid.positions.Left}  
  10.       renderNavigationView={() =navigationView} 
  11.           <Text style={{10, fontSize: 15, textAlign: 'right'}}>Hello</Text>
  12.       <Text style={{10, fontSize: 15, textAlign: 'right'}}>World!</Text>
  13.     </DrawerLayoutAndroid>
  14.       );  
  15.     },

属性

drawerPosition enum(DrawerConsts.DrawerPosition.Left, DrawerConsts.DrawerPosition.Right)

  1. 指定 drawer 将从屏幕的一侧滑动。

drawerWidth number 

  1. 指定 drawer 的宽度，即从窗口的边缘拉到视图更精确的宽度。

keyboardDismissMode enum(‘none’, “on-drag”) 

  1. 确定键盘是否响应拖动被驳回。
  2. -'none' (默认值), 拖动不影响键盘。
  3. -'on-drag', 拖动开始，键盘被驳回。

onDrawerClose 函数 

  1. 导航视图关闭时调用函数。

onDrawerOpen 函数 

  1. 导航视图打开时调用函数。

onDrawerSlide 函数 

  1. 与导航视图交互时调用函数。

onDrawerStateChanged 函数 

  1. 当 Drawer 状态发生变化时调用函数，drawer 有 3 种状态:
  2. - idle, 表示与导航视图没有交互
  3. - dragging,表示目前有与导航视图的交互 
  4. - settling, 表示有与导航视图的交互，并且导航视图正在的关闭或打开。

renderNavigationView 函数 

  1. 导航图将被渲染到屏幕的一侧，并且可以拉出。