Inflating AppBarLayout with Toolbar + TabLayout

Question

I currently have a DrawerLayout in my main.xml. There's a Toolbar wrapped in an AppBarLayout, and then a simple LinearLayout to swap out fragments.

One of the fragments I navigate to, I want it to contain a TabLayout for a ViewPager of fragments. Currently, I have both of these in the fragment's layout file, but this causes a drop shadow to appear between the Toolbar and the TabLayout, which is something I don't want. I also don't want to use setElevation() because it won't work for pre-Lollipop devices.

A possible solution would be to inflate the AppBarLayout from my fragment, so that it holds both the Toolbar+Tabs. However, I'm not really sure how to do this, so any help would be appreciated.

Here is my main.xml file:

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"     xmlns:app="http://schemas.android.com/apk/res-auto"     xmlns:tools="http://schemas.android.com/tools"     android:id="@+id/drawerLayout"     android:layout_width="match_parent"     android:layout_height="match_parent"     tools:context="com.lumivote.lumivote.ui.MainActivity">      <android.support.design.widget.CoordinatorLayout         android:id="@+id/rootLayout"         android:layout_width="match_parent"         android:layout_height="match_parent">          <android.support.design.widget.AppBarLayout             android:id="@+id/appbarlayout"             android:layout_width="match_parent"             android:layout_height="wrap_content">              <android.support.v7.widget.Toolbar                 android:id="@+id/toolbar"                 android:layout_width="match_parent"                 android:layout_height="?attr/actionBarSize"                 android:background="?attr/colorPrimary"                 app:popupTheme="@style/ThemeOverlay.AppCompat.Light"                 app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" />          </android.support.design.widget.AppBarLayout>          <LinearLayout             android:id="@+id/flContent"             android:layout_width="match_parent"             android:layout_height="match_parent"             android:orientation="vertical"             app:layout_behavior="@string/appbar_scrolling_view_behavior"/>      </android.support.design.widget.CoordinatorLayout>      <android.support.design.widget.NavigationView         android:id="@+id/navigation"         android:layout_width="wrap_content"         android:layout_height="match_parent"         android:layout_gravity="start"         app:headerLayout="@layout/nav_header"         app:itemIconTint="#333"         app:itemTextColor="#333"         app:menu="@menu/navigation_drawer_items" />  </android.support.v4.widget.DrawerLayout> 

And here is my fragment's xml file:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"     xmlns:tools="http://schemas.android.com/tools"     xmlns:app="http://schemas.android.com/apk/res-auto"     android:layout_width="match_parent"     android:layout_height="match_parent"     android:orientation="vertical"     tools:context="com.alexdao.democracy.ui.candidate_tab.CandidateListFragment">      <android.support.design.widget.TabLayout         android:id="@+id/tabLayout"         android:layout_width="match_parent"         android:layout_height="wrap_content"         android:background="@color/myPrimaryColor"         app:tabMode="fixed"         app:tabGravity="fill"         app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/>      <android.support.v4.view.ViewPager         android:id="@+id/viewpager"         android:layout_width="match_parent"         android:layout_height="wrap_content"         android:background="@android:color/white" /> </LinearLayout> 

Answer 1

You are able to have separate toolbar for each fragment. Its possible to set fragments toolbar as activity actionbar. Example code:

Toolbar toolbar = (Toolbar) v.findViewById(R.id.toolbar);  ((AppCompatActivity) getActivity()).setSupportActionBar(toolbar); 

It should be possible to have titles, icons and other stuff as well. With it you can mimic shadow on pre lollipop devices, no matter what you have on them.

Answer 2

I modified the solution given by bleeding182 and got it to work for AppBarLayout as well (to resolve the problem pointed out by bopa).

@Override public void onAttach(Context context) {      if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {         getActivity().findViewById(R.id.appbar).setElevation(0);     }     super.onAttach(context);  }  @Override public void onDetach() {     super.onDetach();     if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {         getActivity().findViewById(R.id.appbar).setElevation(R.dimen.toolbar_elevation);     } } 

What I did was replace the call to getSupportActionBar() by giving an ID to my AppBarLayout and then calling findViewById() on it and then calling setElevation on its result. Tested on API 23.