我有一个
FlatList
,它使用标准 RefreshControl
,如下所示:
<FlatList
data={items}
refreshControl={<RefreshControl refreshing={loading} onRefresh={this.refresh} />}
renderItem={({ item, index }) => (<ListItem item={item} />)}
/>
这会在执行拉动刷新操作时呈现本机刷新指示器。我的问题如下:
RefreshControl
使用的图标/图像更改为更符合我的应用程序设计的自定义图标/图像吗?RefreshControl
?我发现了这个自定义下拉刷新的示例,这是此处参考的其他问题/答案,但该解决方案不适用于 Android(至少根据我的测试)。
您可以使用RefreshControl的tintColor属性来选择您选择的加载指示器的颜色
<FlatList
data={items}
refreshControl={<RefreshControl refreshing={loading} onRefresh={this.refresh}
tintColor={'red'} //your color string
/>}
renderItem={({ item, index }) => (<ListItem item={item} />)}
/>
您可以使用
RefreshControl
的颜色属性,您可以传递包含一组颜色的数组
例如
colors={["gray","orange"]}
这将在每次完成一圈旋转时改变指示器的颜色
import {
FlatList
RefreshControl
} from "react-native"
<FlatList
data={items}
refreshControl={
<RefreshControl
refreshing={loading}
onRefresh={this.refresh}
colors={["gray","orange"]}
/>
}
renderItem={({ item, index }) => (<ListItem item={item} />)}
/>