What is the correct way to use toolbar and SwipeRefreshLayout?

Question

I try to use SwipeRefreshLayout and the toolbar, but every time I use the Progress Circle, it appears above the toolbar, which is really bad from a design point of view. I tried to put the SwipeRefreshLayout under the toolbar, but this does not work, the progress bar is still displayed on top of it (above the status bar). I would like to use the toolbar and layout at the same time as in the Gmail application. I am using the AppCompat library.

Here is my code:

<?xml version="1.0" encoding="utf-8"?> <android.support.v4.widget.SwipeRefreshLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/swipe_container" android:layout_width="fill_parent" android:layout_height="fill_parent"> <ScrollView android:layout_width="fill_parent" android:layout_height="fill_parent"> <RelativeLayout android:layout_width="fill_parent" android:layout_height="fill_parent"> <include layout="@layout/bluetooth_toolbar" android:id="@+id/bluetooth_toolbar"/> <TextView android:id="@+id/swipeTo" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Swipe down to refresh" android:textSize="20sp" android:layout_below="@+id/bluetooth_toolbar" android:layout_centerHorizontal="true" /> <ListView android:id="@+id/newDevices" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/swipeTo" android:layout_marginTop="50dp" /> <ListView android:id="@+id/pairedDevices" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/newDevices" android:layout_marginTop="50dp" /> </RelativeLayout> </ScrollView> </android.support.v4.widget.SwipeRefreshLayout> 

and

 public class BluetoothActivity extends AppCompatActivity implements SwipeRefreshLayout.OnRefreshListener { private static final int REQUEST_ENABLE_BT = 0; private BluetoothAdapter bluetoothAdapter = BluetoothAdapter.getDefaultAdapter(); private SwipeRefreshLayout mSwipeRefreshLayout; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_bluetooth); Toolbar bluetoothToolbar = (Toolbar) findViewById(R.id.bluetooth_toolbar); setSupportActionBar(bluetoothToolbar); final Drawable upArrow = getResources().getDrawable(R.drawable.abc_ic_ab_back_mtrl_am_alpha); upArrow.setColorFilter(getResources().getColor(R.color.white), PorterDuff.Mode.SRC_ATOP); getSupportActionBar().setHomeAsUpIndicator(upArrow); getSupportActionBar().setDisplayHomeAsUpEnabled(true); mSwipeRefreshLayout = (SwipeRefreshLayout) findViewById(R.id.swipe_container); mSwipeRefreshLayout.setOnRefreshListener(this); mSwipeRefreshLayout.setColorScheme( R.color.yellow, R.color.flashy_blue, R.color.yellow, R.color.flashy_blue); if (bluetoothAdapter == null) { // Device does not support Bluetooth } if (!bluetoothAdapter.isEnabled()) { Intent enableBtIntent = new Intent(BluetoothAdapter.ACTION_REQUEST_ENABLE); startActivityForResult(enableBtIntent, REQUEST_ENABLE_BT); } } public void onRefresh() { Toast.makeText(this, getString(R.string.bluetooth_refresh), Toast.LENGTH_SHORT).show(); new Handler().postDelayed(new Runnable() { @Override public void run() { mSwipeRefreshLayout.setRefreshing(false); } }, 2000); bluetoothAdapter.startDiscovery(); if (bluetoothAdapter.getScanMode() != BluetoothAdapter.SCAN_MODE_CONNECTABLE_DISCOVERABLE) { Intent discoverableIntent = new Intent(BluetoothAdapter.ACTION_REQUEST_DISCOVERABLE); discoverableIntent.putExtra(BluetoothAdapter.EXTRA_DISCOVERABLE_DURATION, 300); startActivity(discoverableIntent); } } protected void onDestroy() { super.onDestroy(); bluetoothAdapter.cancelDiscovery(); } @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. getMenuInflater().inflate(R.menu.bluetooth, menu); return true; } @Override public boolean onOptionsItemSelected(MenuItem item) { // Handle action bar item clicks here. The action bar will // automatically handle clicks on the Home/Up button, so long // as you specify a parent activity in AndroidManifest.xml. int id = item.getItemId(); if (id == R.id.action_settings) { startActivityForResult(new Intent(Settings.ACTION_BLUETOOTH_SETTINGS), 0); return true; } return super.onOptionsItemSelected(item); } 

}

thanks

Answer 1

this is because your toolbar is part of the relative layout that is being updated. you should exclude the toolbar as follows:

 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <include layout="@layout/bluetooth_toolbar" android:id="@+id/bluetooth_toolbar"/> <android.support.v4.widget.SwipeRefreshLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/swipe_container" android:layout_width="fill_parent" android:layout_height="fill_parent"> <ScrollView android:layout_width="fill_parent" android:layout_height="fill_parent"> <RelativeLayout android:layout_width="fill_parent" android:layout_height="fill_parent"> <TextView android:id="@+id/swipeTo" android:layout_width="wrap_content" ... </RelativeLayout> </ScrollView> </android.support.v4.widget.SwipeRefreshLayout> </LinearLayout>