使用 React-native 模态形成和样式化适当的对话框或警告框

Question

我想在 react native modal 的帮助下制作一个通用对话框。我已经编写了如下代码：

<Modal isVisible={isModalVisible} style={styles.modalStyle} >                                      

   <Text>Hello World!</Text>                               

</Modal>

下面提到了样式：

const styles = StyleSheet.create({

    modalStyle : {

      top                   : '50%',

      left                  : '50%',

      right                 : 'auto',

      bottom                : 'auto',

      marginRight           : '-50%',

    },

}

但是模态对话框占用了整个屏幕！

我还尝试将代码编辑为：

<Modal>

  <View style={{ flex: 1, top: 50%, left: 50%, width: 70%, height : 50% }}>

       <Text>Hello World!</Text>

  </View>

</Modal>

删除模态中的样式。但结果还是一样！

Answer 1

我使用了本机模态反应，并部分显示模态，我所做的是，高度为 100，因此您可以裁剪高度<Modal isVisible={true} style={{justifyContent: "flex-end"}} ><View style={{height:100}}></View></Modal>现在，尝试一次。让我知道这是否有效。因为它对我有用。否则生病改变它。

Answer 2

内置 Modalreact-native有时难以定制。这个很棒的库我用过很多次了。看到这个。