Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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..

like image 846
cacca_nello_spazio Avatar asked Jun 12 '16 19:06

cacca_nello_spazio


Video Answer


2 Answers

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.

like image 91
mfaisalhyder Avatar answered Oct 17 '22 23:10

mfaisalhyder


Make toolbar like this:

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

And after that in your Activity;

findViewById(R.id.myAppBar).bringToFront();
like image 3
Ajeet Yadav Avatar answered Oct 17 '22 21:10

Ajeet Yadav