我正在使用 React Native 版本 0.44.0 和 expo 应用程序在 ListView 的屏幕上渲染一些图像和文本。
我的问题是样式。
A. 最初，我只有一个 View (View1) 以及 View1 中并排的图像和文本组件。我设置了 flexDirection="row" 和 justifyContent="center" 并将图像和文本在屏幕内居中。
B. 我需要在第一个文本下插入另一个具有不同样式的文本组件，但 flexDirection="row" 根本不允许它插入到第一个文本下它。
我插入了View2，这确实允许文本垂直放置，但较高的文本在屏幕的右边缘被切断(我相信这是因为图像设置了>固定高度和宽度)。
在添加 View3 并为其指定固定宽度之前，我无法将文本放回到中心。
因此 View1 具有 flex=1 ，View2 具有 flex=1 ，View3 具有 width="someValue"
我担心:现在它在设备上完美呈现。但这种做法可以接受吗？它会在其他设备上失真吗？还是会根据屏幕分辨率动态渲染固定宽度，因为它的像素单元与密度无关？
最佳答案
will it render the fixed width dynamically based on the screen resolution since its density-independent pixel unit?
不。不会根据不同的屏幕尺寸进行调整。宽度会随着屏幕的不同而变化。使用弹性盒是获取东西的最佳方式
完成，但有时您需要屏幕宽度和屏幕高度的帮助。为此，您可以使用react-native中的Dimensions。这是一个guide使用它。还有一些库可以使应用程序响应，例如 react-native-responsive和react-native-extended-stylesheet .
在您的特定情况下，您可以将行 View (view1)划分为具有所需弹性的 2 个内部 View 。第一个内部 View 可能包含 ImageView ，如果您发现图像的高度和宽度与其父级的高度和宽度有困难，您可能还需要引用图像resizemod。第二个内部 View 保存您的文本。还要记住向 view1 添加一些填充，以便内部 View 始终位于视口(viewport)中，而 Nevers 超出视口(viewport)。
关于javascript - React Native - 图像将文本推出屏幕 - 用第三个 View 修复？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45084213/