React Native的布局问题

Question

我在React Native应用程序中遇到了相当奇怪的布局问题。我的布局主要基于flexbox，但在边距，图像大小和标签栏高度方面有一些例外。在两个不同的模拟器上运行应用程序会导致不同的行为在5S模拟器上，它看起来很棒。在6S Plus模拟器上运行时，ListView中的某些行看起来很奇怪，并且标签栏边距/填充看起来很奇怪（参见附件截图）。是否有其他人遇到过这个问题，或者可能知道是什么导致了这个问题？

问候 约翰

Answer 1

我刚刚遇到了类似问题的反应原生路由器磁通标签栏（应该使用你正在使用的相同标签栏）。我发现问题是对borderTopWidth使用小数。

标签栏的样式是：

    tabBarStyle: {
        borderTopWidth : .5,
        borderColor    : '#DEF6FC',
        backgroundColor: '#FFF',
        opacity        : 1,

    }

更改为：

    tabBarStyle: {
        borderTopWidth : 1,
        borderColor    : '#DEF6FC',
        backgroundColor: '#FFF',
        opacity        : 1,

    }

一切都很好。我实际上从我在网上看到的一个例子中复制了那种风格，所以我真的不知道是什么/为什么。但是，将其切换为标准加视图工作中的视图。希望它有所帮助！