我正在使用React Native,一旦我引入ScrollView,我就无法保留元素的垂直居中.为了演示,我使用React Native Playground创建了3个应用程序.所有示例都有2页,可以通过点击蓝色按钮来切换它们.
例1:
第一个示例显示了在第2页上垂直居中的块.这是因为容器已应用这些样式:
flex: 1,
flexDirection: 'column',
justifyContent: 'center',
https://rnplay.org/apps/lb5wSQ
但是,一旦切换到第2页就会出现问题,因为页面的整个内容都不合适,所以我们需要一个ScrollView.
例2
在这个例子中,我将所有内容都包装在ScrollView中.这允许第2页滚动,但现在我丢失了第1页的垂直居中.
https://rnplay.org/apps/DCgOgA
例3
为了试图找回1的垂直居中,我申请flex: 1到了contentContainerStyle滚动型的.这修复了第1页的垂直居中,但我不再能够一直向下滚动到第2页的底部.
https://rnplay.org/apps/LSgbog
我如何解决这个问题,以便我在第1页上获得元素的垂直居中,但仍然可以让ScrollView一直滚动到第2页的底部？