如何淡化View的边缘反应原生？

Question

例1

例2

如何淡化视图的边缘像上面的图像反应原生？

Answer 1

我知道这篇文章已经过时了，但对于现在看到这篇文章的任何人来说，您可以像这样在 ScrollView 上设置 fadingEdgeLength 来实现该效果。请注意，它仅适用于 Android。例如：

<ScrollView fadingEdgeLength={100}>
  ... scroll view content ...
</ScrollView>

Answer 2

在iOS上,您可以使用该MaskedViewIOS组件为淡入淡出效果创建透明的alpha蒙版.

对于渐变渐变本身,您可以使用像react-native-linear-gradient(也包含在Expo中)或半透明图像(黑色像素将显示内容,透明像素将阻止蒙版内容).

<MaskedViewIOS 
  maskElement={
    <LinearGradient colors={['black', 'transparent']} />
  }
>
  <YourContent />
</MaskedViewIOS>

这是一个关于小吃的例子.

不幸的是,MaskedView尚未在Android上实现.我不知道实现这个的简单方法,但很高兴被证明是错误的.