Question

我有FlatList使用标准RefreshControl，如下所示：

<FlatList 
    data={items}
    refreshControl={<RefreshControl refreshing={loading} onRefresh={this.refresh} />}
    renderItem={({ item, index }) => (<ListItem item={item} />)}
/>

这会在执行pull-to-refresh操作时呈现本机刷新指示符。我的问题如下：

我可以将RefreshControl使用的图标/图片更改为与我的应用设计更匹配的自定义图标/图片吗？
有没有办法只创建适用于Android和iOS的替换RefreshControl？

我找到了this example定制的“刷新”，这是其他问题/答案的参考，但该解决方案在Android上不起作用（至少不是我的测试）。

Answer 1

您可以使用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} />)}
/>

如何更改RefreshControl的加载指示器？

1 个答案: