Question

我正在尝试使用此处的模块在我的本机应用程序中显示一个弹出窗口：

https://github.com/jacklam718/react-native-popup-dialog

但是，我希望弹出窗口只出现在屏幕的底部。我在popupStyle中尝试了各种各样的东西，但弹出窗口的位置始终保持在中心位置。是否可以将其位置更改为仅显示在屏幕底部。

index.js

import PopupDialog, { SlideAnimation, DialogTitle } from 'react-native-popup-dialog';
import { styles } from './styles';

....
<PopupDialog
  ref={(popupDialog) => { this.popupDialog = popupDialog; }}
  style={styles.popupDialogStyle}
  dialogAnimation={slideAnimation}
  height={150}
  dialogTitle={<DialogTitle title="Select options" />}
>

styles.js

export const styles = StyleSheet.create({
    popupDialogStyle: {
        backgroundColor: 'lightgray',
        marginTop: 100,
    },
});

Answer 1

根据Issue #89: How to position absolute，你需要使用

<PopupDialog 
  containerStyle={{ justifyContent: 'flex-end' }}
/>

或

<PopupDialog 
  dialogStyle={{ position: 'absolute', bottom: 0 }}
/>

位置会在屏幕底部对原始弹出窗口作出反应

1 个答案: