React Native-为什么我们对图像组件使用tintColor属性？

Question

当我使用tintColor属性时，它将整个图像填充为我为tintColor属性指定的颜色。我使用的是错误的还是它的工作与我得到的相同？谁能说出此属性用于<Image/>组件的用途以及该属性的正确用法是什么？一个小例子将不胜感激。谢谢!!!

Reference link

Answer 1

<Image
  tintColor='#2d3436'
  style={{width: 20, height: 15,margin:10}}
  source={{uri: 'backsignup'}}
/>

这在android上工作正常，但在ios中不行

如果您希望它也可以在ios上运行，请使用此ie。通过样式传递色调颜色，而不是将其作为道具传递

<Image
 style={{ width: 20,height: 23,margin: 10,tintColor: "#2d3436"}}
 source={{ uri: "pdficon" }}                                                 
/>

Answer 2

我认为这可以消除您对Image的tintColor属性的困惑。

反应本机样式备忘单-https://github.com/vhpoet/react-native-styling-cheat-sheet#image

Answer 3

根据文档，tintColor将所有非透明像素的颜色更改为tintColor（逐字逐句）。

例如，在我的一个React Native软件包中，我使用了一个增量资产-https://github.com/hannigand/react-native-ui-stepper/blob/master/assets/increment.png-带有蓝色+号。使用tintColor，另一个用户可以将蓝色（非透明像素）重新着色为所需的任何颜色。

Answer 4

在tintColor中使用<Image>无效。

在style的{​​{1}}中使用它是有效的。

参考：https://github.com/facebook/react-native/issues/17124