网格单元格上的边界在本机反应中不均匀 [英] border on cells of a grid is not uniform in react native

问题描述

我正在尝试构建一个具有本机反应的简单计算器.

I am trying to build a simple calculator with react native.

我创建了一个borderWidth为0.5的按钮组件，并使用该按钮组件来形成键盘.但是边界并不统一.与其他单元格相比，在少数单元格上边框显得较粗

I created a button component with borderWidth 0.5 and used this button component to form keypad. But border is not uniform. Border appears thick on few cells compared to others

此代码位于 https://github.com/akiran/exponent-calculator/blob/master/components/Buttons.js

https://github.com/akiran/exponent -calculator/blob/master/components/KeyPad.js

推荐答案

我用您的代码构建了一个示例，无法完全弄清为什么会发生这种情况.但是，这是一个可重现的问题.可能与重叠的边框有关?

I used your code to build an example, could not quite figure out why that is happening. It is however a reproducible issue. Possibly has to do with overlapping borders?

作为一种解决方法，可以使用borderLeftWidth: 1和borderTopWidth: 1并将其他边框保留为0宽度，这将在下面显示可见的结果.

As a workaround, you can use borderLeftWidth: 1 and borderTopWidth: 1 and leave the other borders at 0 width, which produces the result visible below.

这篇关于网格单元格上的边界在本机反应中不均匀的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！