react-native for android 学习笔记 (1) DrawerLayoutAndroid
DrawerLayoutAndroid封装了平台
var navigationView = ( <View style={{flex: 1,backgroundColor: '#fff'}}> <Text style={{margin: 10,fontSize: 15,textAlign: 'left'}}>java</Text> <Text style={{margin: 10,textAlign: 'left'}}>C</Text> </View> ); return ( <DrawerLayoutAndroid drawerWidth={300} drawerPosition={DrawerLayoutAndroid.positions.Right} renderNavigationView={() => navigationView}> <View style={{flex: 1,alignItems: 'center'}}> <Text style={{margin: 10,textAlign: 'right'}}>Hello</Text> <Text style={{margin: 10,textAlign: 'right'}}>World!</Text> <Text style={{margin: 10,textAlign: 'left'}}>往右边滑动</Text> </View> </DrawerLayoutAndroid> ); },<pre name="code" class="plain">
解释: navigationView:是定义的一个方法,在滑动的时候调用,显示的界面。 drawerWidth:滑动的宽度,指定抽屉的宽度,也就是从屏幕边缘拖进的视图的宽度。 drawerPosition:指定滑动的方向,即从屏幕的哪一边滑入。 renderNavigationView:此方法用于渲染一个可以从屏幕一边拖入的导航视图。调用拖动后的方法。 其他属性的解释: keyboardDismissModeenum('none',"on-drag")指定在拖拽的过程中是否要隐藏软键盘。
onDrawerClosefunction每当导航视图(抽屉)被关闭之后调用此回调函数。 onDrawerOpenfunction每当导航视图(抽屉)被打开之后调用此回调函数。 onDrawerSlidefunction每当导航视图(抽屉)产生交互的时候调用此回调函数。 onDrawerStateChangedfunction每当抽屉的状态变化时调用此回调函数。抽屉可以有3种状态:
(编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |