使用模态反应本机导航:调整大小;从底部显示


  1. 如何指定模态高度反应本机导航?它默认拉伸全屏,如何拉伸半屏?
  2. 抽屉可以从底部显示吗?

如果你在 react native 中要求 Modal,你可以继续下面的操作。

1 - 要降低模态高度,您可以在最父视图元素内指定高度

<View style={{height: 60%}}> 

您也可以导入尺寸并使用它来获取屏幕的高度和宽度,如下所示,

import { Dimensions } from 'react-native';
const window = Dimensions.get('window');
const screenHeight = window.height;
const screenWidth = window.width;

然后你可以使用这个屏幕高度和屏幕高度到你的css中。

<View style={{height: screenHeight - 80}}> // Any values

2 - 一切皆有可能,是的,我们也可以在 react native 中做到这一点。但首先它们被称为ActionSheets(如在iOS中(/BottomSheets(如在Android中(。您可以检查这些库是否适用于 android 和 ios 或两者。

https://github.com/beefe/react-native-actionsheet(两者(

https://github.com/cesardeazevedo/react-native-bottom-sheet-behavior(安卓(

https://github.com/eyaleizenberg/react-native-custom-action-sheet (iOS(

最新更新