How to offset the RefreshControl

Question

I'm using the RefreshControl component in a list that scroll underneath a semi-transparent app-header-bar.

My only problem is that the RefreshControl appears underneath the semi-transparent header. What I really want is to be able to offset the y position of the RefreshControl so that it reveals directly below the app-header-bar.

I've tried using various style properties (marginTop, paddingTop, translateY), but nothing seems to do the job.

Answer 1

According to this in IOS,

If you set a contentInset top to a scrollview, RefreshControl starts from that point.

In android you can use parameter 'progressViewOffset' to a value to achieve the same.

 <RefreshControl
        refreshing={this.state.isRefreshing}
        onRefresh={this._onRefresh}
        progressViewOffset={offset}
      />

This feature will be released in react-native version 0.27. Here is the commit which added support in android.