Question

我想在我的应用程序中实现UI Kitten模式。我的模态工作很好。我在设置模态的样式，大小和颜色时遇到的问题。

<Modal
  visible={visible}
  backdropStyle={styles.backdrop}
  style={styles.modalContainer}
  ViewProps={styles.modalSize}>
  <Card disabled={true} header={modalHeader} footer={modalFooter}>
    {selectedType ? renderItemSelectedDetails() : ''}
  </Card>
</Modal>

我正在将此CSS样式传递给模式ViewProps。

  modalSize: {
    width: '250px',
    height: '200px',
    backgroundColor: '#58B83E',
  },

无论我在此CSS中传递了什么，它都不会影响模式的样式或大小。我在做什么错了？

Answer 1

您需要将样式传递给Modals的样式道具。

<Modal
  backdropStyle={styles.backdrop}
  style={styles.modalSize}
  visible={visible}>
    <Something />
</Modal>

此外，您可以将Layout作为子级添加，并以所需的样式对模式进行样式设置。（我更喜欢这种解决方案）

<Modal
  backdropStyle={styles.backdrop}
  visible={visible}>
  <Layout
    level='3'
    style={styles.modalSize}>
     <Something />
  </Layout>
</Modal>

UI小猫-模态-如何设置样式和设置大小，颜色等？

1 个答案: