反应类似于Nest应用程序的本机水平模态

Question

我正在使用React Native + Expo构建一个iOS应用。使用“时间表”视图时，您将如何构建模态或导航卡以使其类似于Nest应用？

请注意时间表是如何水平放置的，但是没有笨拙的方向更改动画，并且关闭时，用户将返回纵向模式。

我尝试像这样使用https://github.com/react-native-community/react-native-modal：

        <Modal
          onSwipe={this._toggleModal}
          animationIn={'slideInLeft'}
          animationOut={'slideOutRight'}
          swipeDirection='down'
          style={{margin: 0}}
          isVisible={this.state.isModalVisible}>
          <View style={{
            width: '100%',
            height: '100%',
            backgroundColor: 'white',
            flex: 1
          }}>
            <View style={{transform: [{ rotate: '90deg' }]}}>
              <Text>Hello!</Text>
              <TouchableOpacity onPress={this._toggleModal}>
                <Text>Hide me!</Text>
              </TouchableOpacity>
            </View>
          </View>
        </Modal>

这使我非常接近，但是由于某种原因而不是在白色背景上，旋转后的内容在屏幕外呈现。也许transform不是正确的方法。