Geek Answers Handbook

Android - remove the shadow between the toolbar and TabLayout

I am trying to make a layout with CollapsingToolbarLayout . But I don’t understand anything. I want to remove the shadow between the toolbar and TabLayout . I tried several ways and I was not able to remove the shadow. Can anybody help me? thank you

 <?xml version="1.0" encoding="utf-8"?> <RelativeLayout 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:layout_width="match_parent" android:layout_height="match_parent" android:background="@android:color/white" android:fitsSystemWindows="true"> <android.support.design.widget.CoordinatorLayout android:id="@+id/main_content" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_above="@+id/adview" android:fitsSystemWindows="true"> <android.support.v4.view.ViewPager android:id="@+id/container" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_marginTop="50dp" app:layout_behavior="@string/appbar_scrolling_view_behavior" /> <android.support.design.widget.TabLayout android:id="@+id/tabs" android:layout_width="match_parent" android:layout_height="50dp" android:layout_gravity="bottom" android:background="?attr/colorPrimary" android:translationZ="2dp" app:layout_anchor="@+id/appbar" app:layout_anchorGravity="bottom" app:tabGravity="fill" app:tabIndicatorColor="@android:color/white" app:tabIndicatorHeight="3dp" app:tabMode="fixed" app:tabTextColor="@color/tabs_text_selector" /> <android.support.design.widget.AppBarLayout android:id="@+id/appbar" android:layout_width="match_parent" android:layout_height="200dp" android:fitsSystemWindows="true" android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> <net.opacapp.multilinecollapsingtoolbar.CollapsingToolbarLayout android:id="@+id/collapsing_toolbar" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" app:contentScrim="?attr/colorPrimary" app:expandedTitleMarginEnd="20dp" app:expandedTitleMarginStart="20dp" app:expandedTitleTextAppearance="@style/detalle_txt_expanded" app:layout_scrollFlags="scroll|exitUntilCollapsed"> <ImageView android:id="@+id/detalle_img" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" android:scaleType="centerCrop" android:src="@drawable/img_thumb_m" android:transitionName="@string/transition" app:layout_collapseMode="parallax" tools:targetApi="lollipop" /> <ImageView android:id="@+id/detalle_img_tipo" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="15dp" android:layout_gravity="center_horizontal" android:src="@drawable/img_edificio"/> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:minHeight="?attr/actionBarSize" app:layout_collapseMode="pin" app:popupTheme="@style/AppTheme"/> </net.opacapp.multilinecollapsingtoolbar.CollapsingToolbarLayout> </android.support.design.widget.AppBarLayout> <android.support.design.widget.FloatingActionButton android:id="@+id/detalle_info_fab_check" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="16dp" android:clickable="false" android:src="@drawable/ic_check1" app:fabSize="mini" app:backgroundTint="@android:color/white" app:layout_anchor="@+id/appbar" app:layout_anchorGravity="bottom|right|end" /> </android.support.design.widget.CoordinatorLayout> <include android:id="@+id/adview" layout="@layout/adview" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" />

+6
source share
2 answers

Try setting app:elevation="0dp" (not android:elevation ) for AppBarLayout .

If you do not have the application namespace in your xml, add xmlns:app="http://schemas.android.com/apk/res-auto" .

The difference between these two properties can be found here .

After that, make sure that you do not add any background / border with any of these properties:

  <android.support.design.widget.TabLayout android:background="?attr/colorPrimary" android:translationZ="2dp" app:layout_anchor="@+id/appbar" app:layout_anchorGravity="bottom" app:tabGravity="fill" app:tabIndicatorColor="@android:color/white"/>

Or the theme you are using for AppBarLayout .

+10
source

You have to put the toolbar and TabLayout in the same AppBarLayout

  <android.support.design.widget.AppBarLayout android:id="@+id/appbar" android:layout_width="match_parent" android:layout_height="200dp" android:fitsSystemWindows="true" android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> <net.opacapp.multilinecollapsingtoolbar.CollapsingToolbarLayout android:id="@+id/collapsing_toolbar" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" app:contentScrim="?attr/colorPrimary" app:expandedTitleMarginEnd="20dp" app:expandedTitleMarginStart="20dp" app:expandedTitleTextAppearance="@style/detalle_txt_expanded" app:layout_scrollFlags="scroll|exitUntilCollapsed"> <ImageView android:id="@+id/detalle_img" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" android:scaleType="centerCrop" android:src="@drawable/img_thumb_m" android:transitionName="@string/transition" app:layout_collapseMode="parallax" tools:targetApi="lollipop" /> <ImageView android:id="@+id/detalle_img_tipo" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="15dp" android:layout_gravity="center_horizontal" android:src="@drawable/img_edificio"/> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:minHeight="?attr/actionBarSize" app:layout_collapseMode="pin" app:popupTheme="@style/AppTheme"/> </net.opacapp.multilinecollapsingtoolbar.CollapsingToolbarLayout> <android.support.design.widget.TabLayout android:id="@+id/tabs" android:layout_width="match_parent" android:layout_height="50dp" android:layout_gravity="bottom" android:background="?attr/colorPrimary" android:translationZ="2dp" app:layout_anchor="@+id/appbar" app:layout_anchorGravity="bottom" app:tabGravity="fill" app:tabIndicatorColor="@android:color/white" app:tabIndicatorHeight="3dp" app:tabMode="fixed" app:tabTextColor="@color/tabs_text_selector" /> </android.support.design.widget.AppBarLayout>

Take a look at this issue

+1
source

More articles:


All Articles