react-native - 你如何屏蔽具有任何形状的 react-native ？

Question

似乎 react-native 中的所有组件都是矩形或圆角矩形(也可以表示圆形)。

你如何屏蔽<View />像六边形这样的任意形状？

Answer 1

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

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

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>