Issues when relative layout implement swipe-to-refresh layout

Question

I'm currently attempting to implement swipe-to-refresh layout into relative layout, but it is extremely insensitive and unstable. When I pull down the screen, it usually either doesn't refresh or it refreshes without progress bar.

<android.support.v4.widget.SwipeRefreshLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="com.example.miaor.tutorialweather.MainActivity"
android:id="@+id/refreshLayout"
android:background="#fe970b">

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

</RelativeLayout>

public class MainActivity extends AppCompatActivity{

public static final String TAG = MainActivity.class.getSimpleName();
@BindView(R.id.TimeString) TextView mTimeLabel;
@BindView(R.id.TemperatureLabel) TextView mTemperatureLabel;
@BindView(R.id.HumidityValue) TextView mHumidityValue;
@BindView(R.id.rainingChanceValue) TextView mChance;
@BindView(R.id.weatherIcon) ImageView mWeatherIcon;
@BindView(R.id.SummaryText) TextView mSummaryText;
@BindView(R.id.refreshLayout) SwipeRefreshLayout mSwipeRefreshLayout;

///why do we make a new variable of CurrentWeather
private CurrentWeather mCurrentWeather;
private String apiKey = "6b9448b8e21c2abe2fb623b25554a77c";
private double latitude = 31.230708;
private double longitude = 121.472916;
private String forecastUrl = "https://api.forecast.io/forecast/" + apiKey +
        "/" + latitude + "," + longitude;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    ButterKnife.bind(this);

    ///implement swipe-to-refresh feature
    mSwipeRefreshLayout.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
        @Override
        public void onRefresh() {
            Log.i(TAG, "onRefresh is working");
            getForecast();
        }
    });

    getForecast();

    Log.d(TAG, "Main UI code is running!");
}

Answer 1

You can't implement SwipeToRefreshLayout with RelativeLayout as its child. You need to have a scrollable view as its only child. eg Listview, RecyclerView, ScrollView. That is the reason why it is not working as expected for you.

Answer 2

That is not the right position.

You need type like this:

<android.support.v4.widget.SwipeRefreshLayout
    android:id="@+id/your_id"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        YOUR RELATIVE LAYOUT HERE

    </ScrollView>

</android.support.v4.widget.SwipeRefreshLayout>

Answer 3

Your code looks fine, it's weird that it's not working correctly... Maybe it's because of the ButterKnife library? I don't think that's the problem, but it will be worth the shot to get views manually to see if that's the problem

Then, if you need the loading animation to appear/hide you can use mSwipeRefreshLayout.setRefreshing(boolean);

For example in my app I attach the listener first (as you did in your example) and then I use the following code to show the loading animation while I fetch the data.

// Show loading while fetching the first set of data
mainSwipeRefreshLayout.post(new Runnable() {
    @Override
    public void run() {
        mainSwipeRefreshLayout.setRefreshing(true);
    }
});

In my fetchData() method I use the following line to hide the animation again when it finishes fetching the data.

// On load complete stop refresh animation
mainSwipeRefreshLayout.setRefreshing(false);

Hope this helps! Andres.