更改默认的React Native <Picker>下拉箭头图标

Question

我想特别改变它的颜色:

<Picker selectedValue={this.state.selected}
        onValueChange={(value) => this.setState({selected:value})}  >
  {data.map ((value)=><Picker.Item label={value} value={value} key={value}/>)}
</Picker>

Answer 1

您可以更改 Android 中的下拉箭头图标，如下所示：

<Picker dropdownIconColor= 'colorName'/>

Answer 2

对于那些希望在 android 中更改插入符号图标（下拉箭头）颜色的人，您可以尝试将以下行添加到您的 style.xml 中：

<item name="android:colorControlNormal">#FFFFFF</item>

应该是这样的：

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="android:colorControlNormal">#FFFFFF</item>
    </style>
</resources>

完成后，重建应用程序，因为对本机文件所做的更改不会热重新加载。

Answer 3

一种可能的解决方案是用一个绝对定位的矢量图标覆盖现有的箭头，该图标被包裹在一个视图中，该视图具有与 Picker 容器的其余部分匹配的背景颜色。这通常很有效，因为默认情况下 Picker 箭头不会根据 Picker.Item 值的长度重新定位自身。