视图周围的边框在视图颜色的边缘周围留下一些区域

Question

我可能没有在创建问题的标题方面做得最好。以下是rnplay

上显示的错误

https://rnplay.org/apps/eNIbjw

问题是我想在用户身上展示一些彩色瓷砖＆＃39;化身来代表他们的身份。所以，我有一个头像图片，我已经将View的背景颜色设置为用户＆＃39;状态颜色（示例代码中为绿色）我在View周围有一个白色边框，以便它看起来更好。如果您仔细观察，可能会按几次（Cmd + +）来缩放屏幕，iOS边框周围有一条非常细的绿线。下面是它在iOS上的外观截图。

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

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

如果您有办法，请分享。

谢谢！

Answer 1

以下代码应该为您提供相同的结果，但它不会使用＆＃39; border＆＃39;属性。它使用两个圆圈，一个比另一个圆圈大。较大的（父）一个是白色，而内（孩子）是绿色。由于你的justifyContent和alignItems都设置为＆＃39; center＆＃39;内圈总是会有2px的白色。这是代码：

<View style={styles.container}>
     <View style={{width: 30, height: 30, marginHorizontal: 2}}>
      <Image
        source={{uri: 'https://cdn1.iconfinder.com/data/icons/avatar-2-2/512/Salesman_2-512.png'}}
            style={{height: 30, width: 30}} />
      <View style={{backgroundColor: 'white', position: 'absolute', height: 16, width: 16, top: -6, right: -6, 
        borderRadius: 8, justifyContent: 'center', alignItems: 'center'}}>
        <View style={{width: 26, height: 26,
            backgroundColor: 'green'}} />
      </View>
    </View>
  </View>