stefan stefan - 2 months ago 44
Android Question

AppBarLayout Toolbar TabLayout ViewPager DrawerLayout

I want to use a DrawerLayout in combination with a ViewPager which is connected to a TabLayout. On top I want the Toolbar.

This code brings the best results however, when the drawer is open it hides the toolbar.

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">


<android.support.v4.widget.DrawerLayout
android:id="@+id/my_drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">

<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">


<android.support.v7.widget.Toolbar
android:id="@+id/my_awesome_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"

android:minHeight="?attr/actionBarSize" />

<android.support.design.widget.TabLayout
android:id="@+id/tabs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="0dp"

android:paddingTop="0dp"
app:tabGravity="fill"


app:tabMode="scrollable" />

<com.sourcecastle.commons.controls.CustomViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />


</android.support.design.widget.AppBarLayout>

<LinearLayout
android:id="@+id/left_drawer"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="?attr/theme_background_color"
android:choiceMode="singleChoice"

android:orientation="vertical">


<TextView
android:id="@+id/tvTime"
android:layout_width="match_parent"
android:layout_height="wrap_content"

android:gravity="center"
android:text="00:00:00"
android:textAppearance="?android:attr/textAppearanceLarge" />


<TextView
android:id="@+id/tvDistance"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"

android:text="123km"
android:textAppearance="?android:attr/textAppearanceLarge"
android:visibility="gone" />

<LinearLayout
android:id="@+id/llMap"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical">

<fragment
android:id="@+id/speedFragment"
class="com.sourcecastle.logbook.fragments.SpeedFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"

android:layout_weight=".60" />

<fragment
android:id="@+id/mMap"
class="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight=".40" />
</LinearLayout>

<TextView
android:id="@+id/tvEnlarge"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"

android:gravity="center"
android:text="@string/enlarge"
android:textAppearance="?android:attr/textAppearanceLarge" />

</LinearLayout>

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




Screenshot1
Screenshot2

I already tried almost all combinations and read a lot of posts. Also the simmilar question here:
Android CoordinatorLayout + TabLayout + ViewPager Toolbar not hidding on scroll

When I bring out the AppBarLayout and leave the ViewPager in the DrawerLayout the ViewPager is unter the TabLayout and Toolbar.

Answer

To this Linear Layout give top margin of the height of your toolbar

<LinearLayout
    android:id="@+id/left_drawer"
    android:layout_width="240dp"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:background="?attr/theme_background_color"
    android:choiceMode="singleChoice"
    android:layout_marginTop="?attr/actionBarSize"
    android:orientation="vertical">
Comments