DrawerLayoutAndroid
非官方测试版翻译
本页面由 PageTurner AI 翻译（测试版）。未经项目官方认可。 发现错误？ 报告问题 →
React 组件，封装了 Android 平台的 DrawerLayout（仅限 Android）。抽屉（通常用于导航）通过 renderNavigationView 渲染，其直接子组件是主视图（放置内容的位置）。导航视图初始时不可见，但可通过 drawerPosition prop 指定的窗口边缘拉出，其宽度可通过 drawerWidth prop 设置。
示例
- TypeScript
- JavaScript
参考
属性
View 属性
继承 View 属性。
drawerBackgroundColor
指定抽屉背景色。默认值为 white。如需设置透明度请使用 rgba 格式。示例：
tsx
return (
<DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)" />
);
| Type | Required |
|---|---|
| color | No |
drawerLockMode
指定抽屉的锁定模式。抽屉有三种锁定状态：
-
unlocked（默认）：抽屉响应触摸手势（打开/关闭）
-
locked-closed：抽屉保持关闭状态，不响应手势
-
locked-open：抽屉保持打开状态，不响应手势（仍可通过编程方式调用
openDrawer/closeDrawer开关）
| Type | Required |
|---|---|
| enum('unlocked', 'locked-closed', 'locked-open') | No |
drawerPosition
指定抽屉滑入的屏幕侧边。默认值为 left。
| Type | Required |
|---|---|
| enum('left', 'right') | No |
drawerWidth
指定抽屉宽度，即从窗口边缘拉出视图的宽度。
| Type | Required |
|---|---|
| number | No |
keyboardDismissMode
控制拖拽时是否关闭键盘：
-
'none'（默认）：拖拽不关闭键盘
-
'on-drag'：拖拽开始时关闭键盘
| Type | Required |
|---|---|
| enum('none', 'on-drag') | No |
onDrawerClose
导航视图关闭时触发的回调函数。
| Type | Required |
|---|---|
| function | No |
onDrawerOpen
导航视图打开时触发的回调函数。
| Type | Required |
|---|---|
| function | No |
onDrawerSlide
导航视图发生交互时触发的回调函数。
| Type | Required |
|---|---|
| function | No |
onDrawerStateChanged
抽屉状态变化时触发的回调函数。抽屉有三种状态：
-
idle：当前无导航视图交互
-
dragging：正在与导航视图交互
-
settling：导航视图交互结束，正在执行开/关动画
| Type | Required |
|---|---|
| function | No |
renderNavigationView
渲染在屏幕侧边且可被拉出的导航视图。
| Type | Required |
|---|---|
| function | Yes |
statusBarBackgroundColor
使抽屉覆盖整个屏幕并绘制状态栏背景，允许抽屉在状态栏上方打开。此属性仅在 API 21+ 生效。
| Type | Required |
|---|---|
| color | No |
方法
closeDrawer()
tsx
closeDrawer();
关闭抽屉导航。
openDrawer()
tsx
openDrawer();
打开抽屉导航。