你如何用任何形状掩盖反应本机 <View />？

Question

好像react-native里面的组件都是矩形或者圆角矩形（也可以表示一个圆）

如何用六边形等任意形状遮盖 <View />？

Answer 1

我得出的结论是这个功能不是开箱即用的，所以我在 Objective-C 中实现了一个名为 react-native-masked-view 的原生组件.

basic idea是使用UIView的mask属性class:

CALayer *mask = [CALayer layer];
mask.contents = (id)[_maskUIImage CGImage];
mask.frame = self.bounds; //TODO custom: CGRectMake(left, top, width, height);
self.layer.mask = mask;
self.layer.masksToBounds = YES;

它在 JavaScript 中的工作方式与此类似：

<MaskedView maskImage="mask.png">
   ...
</MaskedView>

你如何用任何形状掩盖反应本机 <View />？

How do you mask a react-native <View /> with any shape?

react-native