全角网页视图Reactvr

Question

我正在使用ReactVr框架来处理项目。我的主要目标是设置多个热点，当单击它时，它应显示为全角显示，并在顶部带有一个十字按钮以关闭查看器。到目前为止，这是我所做的。

我创建了一个条件，如果infoText为true，则显示框，否则显示infoButton.png：

<VrButton onClick={this.toggleDisplayText}>
      {this.state.infoText === true?
      (
        <View
        style = {{
          position: 'absolute',
          height: 2,
          width: 3,
          backgroundColor: '#000',
          opacity: 0.5,
          flex: 2, // for two columns in the box
          flexDirection: 'column', //specifying column or row
          justifyContent: 'space-between', //justify space between the objects.
          layoutOrigin: [0.7, 0.7],
          transform: [{translate: [0.6, -0.7, -2.5]}]
        }}
          >
        <Text
        style = {{
          width: 1,
          fontSize: 0.18,
          marginLeft: 1.9,
          marginTop: 0.2,
          fontWeight: '300',
          textAlign: 'left',
        }}>
        This bag is the most precious bag in the world. You will love this bag.
        </Text>
          <Image source = {asset('004.png')}
          style =
          {{
          position: 'absolute',
          width: 1.8,
          height: 1.8,
          opacity: 2,
        }}
         />
        </View>

在上面的代码中，您可以看到它出现了一个带有信息和图像的文本框。要退出，我们可以单击文本框区域以关闭。取而代之的是，我正在寻找全尺寸的浏览器，并在顶部找到一个十字形以使其关闭。我尝试使用Flex：1和alignItem：'strected'，但是没有产生任何结果。如果有人可以提出这个问题的想法，我将不胜感激。

非常感谢。