Question

我有一个宽度为50％的视图，其父视图具有手机的整个宽度，但是我想使其变成圆形，这是我的代码不起作用：

  clockContainer: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    width:Dimensions.get('window').width
  },
  clock: {
    width: '50%',
    borderRadius: '100%', // divide this by 2?
    backgroundColor: 'red'
  },

我环顾四周，它说您将其宽度除以2，但是在这种情况下我不知道如何实现。帮助吗？

Answer 1

React Native仅允许在CSS值中输入数字，而不是百分比。

您将要像计算父级borderRadius一样计算width，然后简单地除以二：

borderRadius: Dimensions.get('window').width / 2

或者：

borderRadius: Dimensions.get('window').width * 0.5

通过百分比创建原生圈子？

1 个答案: