问题标签 [react-native-flexbox]

我如何flex-direction: row-reverse在 React-Native 中重现？当我在元素风格时：

我收到错误：

提供给 flexDirection的价值道具无效row-reverseStyleSheet

更新：他们刚刚在 0.29.0 版本中添加了它:)

假设这是布局：

我想使带有页脚样式的视图位于屏幕底部。我尝试将alignSelf属性赋予页脚，但不是将其定位在底部，而是将其定位在屏幕的右侧。如何使页脚项目坚持到底？谢谢你。

我有一个ScrollView内容不一定超过它的大小。假设它是一种形式，在出现错误时，它会扩展以添加错误消息，然后超出ScrollView大小，这就是我使用该滚动条的原因。

问题是我希望内容始终至少与 ScrollView 的大小相同。我知道该minHeight属性，但我发现使用它的唯一方法是重新渲染，我想避免这种情况。

我正在使用 redux 进行状态管理，这就是我所拥有的

其中this.props.setScrollContentHeight触发了一个动作，该动作进入状态上的高度，this.props.scrollHeight称为高度。因此，在触发 onLayout 函数的第一次渲染之后，状态会使用 ScrollView 更新height，然后我将其分配minHeight给它的内容。

如果我将内容的样式设置flex: 1为 ScrollView 将不会滚动。

您能想出一种方法来避免出于性能目的进行第二次渲染吗？

谢谢！

我正在通过精彩的ReactNativeKatas学习 React Native 中的 flexbox 布局。在下面的示例中，flex父视图的两个子视图View（使用 的styles.container）的属性设置为0.1。将两者都设置为0.1将第一个View放在显示器的绝对左侧，将第二个View放在中间。为什么设置为两个s0.1的属性以这种方式对齐它们？flexView

在模拟器中渲染：

如文档中所述，Android 上的溢出设置为隐藏且无法更改。于是就产生了这样的问题。我的问题是我们如何使用原生反应制作浮动动作按钮。我想要一个像谷歌地图这样的行程按钮的按钮。它应该以某种方式链接到帝国大厦视图，因为如果后者被拖动，它将与它同步移动。

我看到了使它工作的不同方法，但它们都感觉不好，因为它们要么创建不可见的视图，要么需要传播许多道具。人们习惯了一个常见的把戏吗？

我正在使用 React Native 并尝试创建特定的布局。

我有一个图像，垂直和水平居中（在视图内），图像顶部的一些文本也垂直和水平居中。文本需要位于图像/背景图像之上，因此我将其放在图像标签内。

现在该文本的内容可能很长，因为它在图像标签内，所以它会换行。

我怎样才能使 Text 中的内容不会换行并且仍然位于 Image 之上？

到目前为止我的布局：

我试图实现的布局

我的代码：

谢谢

就我而言，我想要一个顶部有一个按钮的全屏浏览器。在Android中很容易。

这是示例代码

但是在 rn 中，似乎 flexbox 的行为就像 Android 中的 Linearlayout 一样，父级的兄弟姐妹不能相互重叠。我认为这在移动开发中没有意义，因为多层在移动开发中很常见。我有一个技巧可以通过使用position: absolute来解决这个问题。该解决方案的缺点是，如果使用绝对位置，则alignItems无效，因此您需要做另一个技巧来使按钮居中。有没有更好的办法？RN 会支持 RelativeLayout 之类的东西吗？我认为 Relativelayout 是进行应用开发布局的非常有效的方法。

这是我的 RN 代码

当我使用网络图像时，

它填满了页面：

但是当我将 require() 用于静态图像时：

不是吗？

运行 react-native 0.37.0。这段代码被直接添加到一个新的react-native init项目中，没有 3rd 方库或任何东西。

我正在迈出反应本土的第一步，并试图了解软键盘的布局。

我通过 rect-native init 创建了一个新的 react 项目并编写了以下组件：

结果看起来符合预期，当我触摸输入字段时，键盘会覆盖我的视图。但是，如果我通过按方形/概览按钮最小化应用程序，然后再次选择应用程序，则视图将调整它的高度，因此键盘不会覆盖视图。

到目前为止，我的发现是： - 这仅发生在 Android 上

• 仅当存在 scrollView 时才会发生这种情况

• 在 android 清单中使用 android:windowSoftInputMode 似乎不会影响问题。

• 我试过 react-native: 0.39.0 / react: 15.4.1 和 react-native: 0.33.0 / react: ~15.3.0 并且两者都存在

• 然而，它在 rnplay (0.33) 中不可重现：https ://rnplay.org/apps/kr-OQw

• 我已经尝试过索尼 experia z5compact (android 6.0.1)、nexus 5x 和 samsung Galaxy s6 (android 6.0.1)，它全部存在。

我认为最小化后的调整大小是一个错误，还是我在这里遗漏了什么？这个问题有解决方法吗？

在为问题创建标题方面，我可能做得不够好。下面是rnplay上演示的错误

https://rnplay.org/apps/eNIbjw

问题是我想在用户的头像上显示一些彩色图块来代表他们的状态。所以，我有一个头像图像，我在上面放置了一个View背景颜色设置为用户状态颜色（示例代码中为绿色）的头像，并且我有一个白色边框，View以便看起来更好。如果你仔细观察，可能会按几次（Cmd ++）来缩放屏幕，iOS 的边框周围有一条很细的绿线。下面是它在 iOS 上的外观截图。

此问题在 Android 上不存在，并且边框周围没有细绿线，看起来非常好。

我尝试了几种不同的样式来解决这个问题，但由于我有限的 CSS 知识，我无法这样做。

如果您有解决方法，请分享。

谢谢！