如何在React Native ART中使用LinearGradient？

Question

我想使用React Native ART创建一些动画SVG图。我的图形需要一个线性渐变，我看到React Native ART似乎实现了它，但我不知道如何使用它。

通过查看此处的https://github.com/facebook/react-native/blob/master/Libraries/ART/ReactNativeART.js

，是否有人知道或可以解决这个问题

不幸的是，我对Javascript并不是那么好。

Answer 1

感谢this post

，我想通了

您可以这样声明LinearGradient：

  let colors = [ "red", "green",  "blue", ];
  let linearGradient = new LinearGradient(colors, 0, 20, 0, 280);

然后在你的形状中使用它，例如：

<Shape d={path} fill={linearGradient} />

不幸的是，似乎不支持偏移％，例如d3js。

Answer 2

Here是反应原生ART模块LinearGradient方法用法的文档。

AFAIK，Android平台有些问题，here是问题所在，您可以使用productpains跟踪它。

Answer 3

就像海勒（Hylle）指出的那样，我无法获得补偿百分比，无法在iOS之类的Android系统中使用。所有颜色都均匀分布。但这是一个对我有用的技巧：

let iosColors = { '.33': '#000', '.66': '#FFF' };
let androidColors = [ '#000', '#000', '#FFF', '#FFF' ];

或更复杂的示例：

let iosColors = { '.2': '#000', '.8': '#FFF' };
let androidColors = [ '#000', '#000', '#555', '#AAA', '#FFF', '#FFF' ];

基本上，如果您有足够简单，固定的渐变值，则可以“预先计算”在Android上获得相同百分比偏移效果所需的均匀间隔的值。