Search code examples
androidandroid-layoutandroid-toolbar

AppBarLayout elevation hides toolbar


I'm trying to disable the shadow below a transparent AppBarLayout/Toolbar. Here's the layout:

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

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fitsSystemWindows="true"
        android:background="@android:color/transparent"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.v7.widget.Toolbar
            android:id="@+id/imagePreviewToolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize" />

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

    <include layout="@layout/content_image_preview" />
</android.support.design.widget.CoordinatorLayout>

I already tried with

app:elevation="0dp"

and

getSupportActionBar().setElevation(0);

but that makes the UP arrow invisible. I also tried to remove the AppBarLayout and use only the Toolbar, but the problem persists.

Anyone has a solution?


EDIT:

Replacing the AppBarLayout + Toolbar combo with this code:

<android.support.v7.widget.Toolbar
    android:id="@+id/imagePreviewToolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="@android:color/transparent"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
    app:elevation="0dp"/>

partially fixed the problem. Now the Toolbar becomes invisible only when the device is in landscape mode! The Android Studio Layout Editor shows me the Toolbar in both orientations just fine, so I don't really know what the problem could be..


Solution

  • after some tries i did find that ToolBar should be the last view in this case else if it will be first then the view coming after it will overlap it as it has height set to match_parent so try this way in layout.

    Layout

    <?xml version="1.0" encoding="utf-8"?>
    <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" >
    
    <RelativeLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/imagePreviewToolbar" >
    
        <ImageView
            android:id="@+id/image_preview"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:background="@drawable/galacticos"
            android:contentDescription="abc"
            android:scaleType="fitCenter" />
    
        <LinearLayout
            android:id="@+id/actionBtns"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:orientation="horizontal"
            android:padding="16dp" >
    
            <ImageButton
                android:id="@+id/setBackgroundBtn"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:background="@null"
                android:contentDescription="abc"
                android:src="@drawable/ic_launcher" />
    
            <ImageButton
                android:id="@+id/downloadBtn"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:background="?selectableItemBackgroundBorderless"
                android:clickable="true"
                android:contentDescription="abc"
                android:src="@drawable/ic_launcher" />
        </LinearLayout>
    </RelativeLayout>
    
    <android.support.v7.widget.Toolbar
        android:id="@+id/imagePreviewToolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:fitsSystemWindows="true"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
        app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" />
    

    And don't forget to initialize this all and set your title to false to only show the toolBar back button:

    Activity Code

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.test);
    
        Toolbar mToolBar = (Toolbar) findViewById(R.id.imagePreviewToolbar);
        setSupportActionBar(mToolBar);
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        getSupportActionBar().setDisplayShowTitleEnabled(false);
        getSupportActionBar().setHomeButtonEnabled(true);
    
    }
    

    Pics enter image description here

    Hope i helped you.