我想在 React-Native 的视角中心创建内角半径答案

【问题标题】：I want to create inside Corner Radius on center of view corners in React-Native我想在 React-Native 的视角中心创建内角半径
【发布时间】：2023-01-21 21:35:19
【问题描述】：

我想创建一个 React-Native UIView，它在所有四个角上都有一个倒转的角半径具有这样的透明背景

【问题讨论】：

标签： react-native

【解决方案1】：

这样的 css 技巧应该有效：

import React from 'react'
import { View, Dimensions } from "react-native";

const App = () => {

    const DEVICE_WIDTH = Dimensions.get("window").width; // could use hooks for this too.

    return (
      <View style={{ backgroundColor: 'red', flex: 1 }}>
          <View style={{position: 'absolute', bottom: 100, backgroundColor: 'white', width: '100%', height: 50, flexDirection: 'row'}} >
              <View style={{left: -25, backgroundColor: 'red', height: 50, width: 50, borderRadius: 90}} />
              <View style={{left: -75 + DEVICE_WIDTH, backgroundColor: 'red', height: 50, width: 50, borderRadius: 90}} />
          </View>
      </View>
    );

}

export default App;

【讨论】：

谢谢你的回答，但我有一个透明的背景，你已经添加了主视图的两个圆形视图。如此透明不显示。
我不太确定我是否理解，但是如果你让整个背景透明并且圆圈变白不是很好吗？
我已经设置了背景图像，圆圈需要透明。所以曲线区域应该是可见的。