Skip to content

[Android] RefreshControl offset top #6740

@UnoDeTantos

Description

@UnoDeTantos

On IOS if you set a contentInset top to a scrollview, RefreshControl starts from that point but with android don't exist that option (or at least i don't know how to do the same thing)

A possible workaroud (or feature request):

Add method to SwipeRefreshLayoutManaget.java

import com.facebook.react.uimanager.PixelUtil;

[...]

@ReactProp(name = "progressViewOffset", defaultFloat = 0)
  public void setProgressViewOffset(final ReactSwipeRefreshLayout view, final float offset) {
    // Use `post` to get the progress circle diameter properly
    // Otherwise returns 0
    view.post(new Runnable() {
      @Override
      public void run() {
        int diameter = view.getProgressCircleDiameter();
        int start = Math.round(PixelUtil.toPixelFromDIP(offset)) - diameter;
        int end = Math.round(PixelUtil.toPixelFromDIP(offset+48));
        view.setProgressViewOffset(false,start,end);
      }
    });
  }

Add PropType to RefreshControl.js:

/**
     * Progress view offset top (display points)
     * @platform android
     */
    progressViewOffset: React.PropTypes.number

And then you can make something like this on a listview on android:

render() {
    const offset = 50;
    return (
      <ListView
        contentContainerStyle={{paddingTop:offset}}
        dataSource={this.state.dataSource}
        renderRow={this._renderRow}
        refreshControl={
          <RefreshControl
            refreshing={this.state.isRefreshing}
            onRefresh={this._onRefresh}
            progressViewOffset={offset}
          />
      }/>
    );
  }

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions