显示列表项时分隔符的宽度不一致

Question

以下是显示带分隔符的列表项的代码

</View>
  <Text style={{padding: 10}}>List Item</Text>
  <View style={{height: StyleSheet.hairlineWidth, backgroundColor: 'grey'}} />
</View>

（请假设我多次重复上面的代码以获得列表视图的外观）

分隔符中存在一些不一致

这个问题已经发布在stack overflow和github中了，但是对于这个问题还没有任何永久性的解决方案，这个问题已经过去了将近2年已发布。

所以，我只想知道最近有人找到了永久性解决方案。

Answer 1

据我所知，由于扩展，这是与模拟器和IOS模拟器相关的问题。这只是一种视觉上的错误陈述。我不认为它会在真实设备上发生。

使用真实设备尝试使用您的代码，或者尝试使用设备模拟器或模拟器进行缩放。

Answer 2

我发现通常可以很好地起作用的一种解决方案是在分频器上增加一小部分空白。

const styles = StyleSheet.create({
  divider: {
    borderBottomColor: '#ccc',
    borderBottomWidth: StyleSheet.hairlineWidth,
    marginVertical: 1,
  },
});

return <View style={styles.divider} />