Tommy Wu
Tommy Wu

Reputation: 672

How to remove divider in bottom of the AppBarLayout

enter image description here

I want to remove the divider line like in the picture above. I've tried anything but still no luck. This is what I have tried until now. styles.xml

<resources>

<!-- Base application theme. -->
<style name="AppTheme" parent="MaterialDrawerTheme.Light.DarkToolbar">
    <item name="android:windowContentOverlay">@null</item>
    <item name="actionBarDivider">@null</item>
    <item name="android:actionBarDivider">@null</item>
</style>

<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
<item name="android:windowContentOverlay">@null</item></style>

<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />

</resources>

fragment.xml

<?xml version="1.0" encoding="utf-8"?>

<android.support.design.widget.CoordinatorLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay"
        android:fitsSystemWindows="true"
        app:elevation="0dp">

        <android.support.design.widget.TabLayout
            android:id="@+id/tab_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:tabMode="fixed"
            app:tabGravity="fill"
            android:fillViewport="false" />
        <com.jaredrummler.materialspinner.MaterialSpinner
            android:id="@+id/spinner"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textColor="#000000"
            />
    </android.support.design.widget.AppBarLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"/>



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

</layout>

Is anyone has the solution for this issue ? Sorry for my bad English and thanks in advance !

Upvotes: 4

Views: 3021

Answers (6)

Ye Wint Naing
Ye Wint Naing

Reputation: 11

You should set app:layout_insetEdge="none" and app:elevation="0dp" in AppBarLayout.I hope that it is ok.

  <android.support.design.widget.AppBarLayout
    android:id="@+id/appBar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:elevation="0dp"
    app:layout_insetEdge="none"
        >
....
</android.support.design.widget.AppBarLayout>

Upvotes: 0

Anant Shah
Anant Shah

Reputation: 4044

You have to set elevation="0dp" like: <android.support.design.widget.AppBarLayout android:layout_height="wrap_content" android:layout_width="match_parent" app:elevation="0dp" android:theme="@style/AppTheme.AppBarOverlay"> </android.support.design.widget.AppBarLayout>

But it seems that this elevation is from your parent activity not of your fragment. So make sure in your activity you are extending toolbar_layout and that activity's toolbar inside of AppBarLayout set app:elevation="0dp will solve your problem.

Or

Also check your res-> values-> style.xml and style-v21.xml files you set: <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar"> <item name="android:windowContentOverlay">@null</item> </style>

Or

If you are not using toolbar you have to call setElevation(0) on your action bar. Note that if you're using the support library you must call it to that like so:

getSupportActionBar().setElevation(0);

It's unaffected by the windowContentOverlay style item, so no changes to styles are required

Upvotes: 4

Nikola Despotoski
Nikola Despotoski

Reputation: 50538

It is not a divider but Toolbar elevation. You should set it to the maximum elevation of AppBarLayout and the Toolbar

int elevationAppBar = ViewCompat.getElevation(mAppBarLayout);
int elevationToolbar = getSupportActionbar().getElevation();
elevationToolbar = Math.max(elevationToolbar, elevationAppBar);
getSupportActionBar().setElevation(elevationToolbar);

Upvotes: 0

Tommy Wu
Tommy Wu

Reputation: 672

In the end, I tried to raise my minSdkVersion from 15 to 21 and add the app:elevation="0dp" to the code. It worked perfectly. Thanks guys for the feedbacks !

Upvotes: 7

Amit Tiwari
Amit Tiwari

Reputation: 3692

See this layout from Chris Banes cheesesquare sample:

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

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <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:layout_scrollFlags="scroll|enterAlways|snap" />

        <android.support.design.widget.TabLayout
            android:id="@+id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />

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

    <android.support.v4.view.ViewPager
        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.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="end|bottom"
        android:layout_margin="@dimen/fab_margin"
        android:src="@drawable/ic_done" />

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

Upvotes: 0

Related Questions