I've been working on a weather app for a while now and I happened to have worked on other sections of the app before realizing I needed to use a left navigation drawer bar. On trying to create the new nav bar following samples from tutorials, I realized it needed to be displayed on a toolbar to function well and I earlier didn't use a toolbar(i initially placed all my items directly on the activity's layout). Now
that I have created a new toolbar, it displays on my items and obstructs them from displaying on the app.
i.e. I want it to be displayed like this https://i.stack.imgur.com/NTKaY.png only that the toolbar
should be displayed behind, not on them.
But here's how it displays currently https://i.stack.imgur.com/rBkf1.png obstructing the items from displaying.
The items it obstructs are my edittexts, textview, and imageview(as shown on the first image).
I've tried to correct it by placing the item views directly below the toolbar's code in the layout, but it still displays the same way. Please can anyone help/suggestions on how I can correct this issue?
Here's my activity's layout code:
<androidx.drawerlayout.widget.DrawerLayout 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:id="#+id/drawer_layout"
android:fitsSystemWindows="true"
tools:context=".Activity.HomeActivity"
tools:openDrawer="start">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/layout"
android:background="#drawable/dubai">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimary"
android:elevation="4dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_constraintTop_toTopOf="parent"
app:popuptheme="#style/ThemeOverlay.AppCompat.Light" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottomNavigationView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#FFFFFF"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:menu="#menu/bottom_menu" />
<androidx.fragment.app.FragmentContainerView
android:id="#+id/fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="409dp"
android:layout_height="599dp"
app:defaultNavHost="true"
app:layout_constraintBottom_toTopOf="#+id/bottomNavigationView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:navGraph="#navigation/my_nav" />
<EditText
android:id="#+id/textfield"
android:layout_width="250dp"
android:layout_height="35dp"
android:autofillHints="#string/change_city"
android:background="#color/colorPrimary"
android:hint="#string/search_city"
android:inputType="text"
android:labelFor="#id/imageView4"
android:padding="8dp"
android:textColor="#color/colorAccent"
android:textSize="16sp"
app:layout_constraintEnd_toStartOf="#+id/imageView4"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="#+id/imageView4"
android:layout_width="50dp"
android:layout_height="35dp"
android:layout_marginEnd="1dp"
android:contentDescription="#string/searchbtn"
android:src="#drawable/look"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/time_field"
android:visibility="gone"
android:textColor="#FFFFFF"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textfield" />
</androidx.constraintlayout.widget.ConstraintLayout>
<com.google.android.material.navigation.NavigationView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:id="#+id/nav_view"
app:headerLayout="#layout/nav_header"
app:menu="#menu/drawer_menu"/>
</androidx.drawerlayout.widget.DrawerLayout>
So, there are a couple of things that need to be adjusted:
In your desired layout the ToolBar looks transparent
The Toolbar obstructs the EditText & ImageView.
For the first point, I'd suggest to change the background of the ToolBar to transparent color. And to remove the the elevation that could block out those items; so the toolBar would be:
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#android:color/transparent"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_constraintTop_toTopOf="parent"
app:popuptheme="#style/ThemeOverlay.AppCompat.Light" />
Related
I show/hide the bottom navigation bar on swiping with CoordinatorLayout but am unable to show/hide the action bar using CoordinatorLayout. What mistake I did in my layout?
On swiping, the bottom navigation bar in my layout is auto-hide and show but not on the top action bar?
This is My XML Layout:
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout
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:orientation="vertical"
android:layout_height="match_parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/noInternet_layout"
android:visibility="gone"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/no_wifi_image"
android:visibility="gone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_wifi_off_24" />
<TextView
android:id="#+id/no_wifi_text"
android:visibility="gone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="#string/noWifi"
android:textSize="16sp"
app:layout_constraintEnd_toEndOf="#+id/no_wifi_image"
app:layout_constraintStart_toStartOf="#+id/no_wifi_image"
app:layout_constraintTop_toBottomOf="#+id/no_wifi_image" />
<Button
android:id="#+id/no_wifi_button"
android:visibility="gone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="TRY AGAIN"
app:layout_constraintEnd_toEndOf="#+id/no_wifi_text"
app:layout_constraintStart_toStartOf="#+id/no_wifi_text"
app:layout_constraintTop_toBottomOf="#+id/no_wifi_text" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/constraintLyt"
android:layout_width="match_parent"
android:layout_height="match_parent">
<include
android:id="#+id/toolbar"
layout="#layout/main_toolbar"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_scrollFlags="scroll|enterAlways" />
<androidx.fragment.app.FragmentContainerView
android:id="#+id/navHostFrag"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="0dp"
app:defaultNavHost="true"
app:layout_constraintBottom_toBottomOf="#+id/constraintLyt"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar"
app:layout_constraintVertical_bias="1.0"
app:navGraph="#navigation/mobile_navigation" />
</androidx.constraintlayout.widget.ConstraintLayout>
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/navView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?android:attr/windowBackground"
app:itemTextColor="#drawable/bottom_text_selector"
app:itemIconTint="#drawable/bottom_navigation_selector"
app:layout_behavior="#string/hide_bottom_view_on_scroll_behavior"
app:itemTextAppearanceActive="#color/white"
app:labelVisibilityMode="labeled"
app:itemRippleColor="#color/menucolor"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
android:layout_gravity="bottom"
app:layout_constraintRight_toRightOf="parent"
app:menu="#menu/bottom_nav_menu" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
Please Help me to solve this issue?
Finally I found.
This is very simple to get swipeable (Show-Hide) both side of bottom Navigation and Top ActionBar without any backend code.
Follow Below code
<!--This is your parent layout-->
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout 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"
tools:context=".MainActivity">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/appBarLayout"
app:elevation="0dp"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways|snap"
android:layout_height="?attr/actionBarSize">
</androidx.appcompat.widget.Toolbar>
</com.google.android.material.appbar.AppBarLayout>
<!--Move your main layout of the screen to a different layout and call it with include. Without including that, you cannot hide one of them Top or Bottom. So move that layout and include it here. (example- #layout/content_main)-->
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<include layout="#layout/content_main"/>
</FrameLayout>
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottom_view"
android:layout_width="match_parent"
android:layout_height="#dimen/custom_bottomBar_size"
android:layout_alignParentBottom="true"
android:layout_gravity="bottom"
app:layout_behavior="com.google.android.material.behavior.HideBottomViewOnScrollBehavior"
style="#style/Widget.Custom.BottomNavigationView"
app:itemRippleColor="?android:attr/windowBackground"
app:itemTextAppearanceActive="#color/white"
app:labelVisibilityMode="labeled"
app:menu="#menu/bottom_navigation" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
By using ablow proper method, you'll easily swipe up-down both BottomNavigation and Top ActionBar
Output is like below
Hope It'll help someone.
I want to create a menu with multiple checkbox like in the video. I searched a lot and tried a number of ways: created Dialog but could not locate it under button, created popup menu but was impossible to customize it. Maybe I am in wrong way, maybe there is a better option to achieve it.
Any kind of tip can be useful for me
What I want:
What I have:
My actionBar xml:
<com.google.android.material.appbar.AppBarLayout
android:elevation="0dp"
android:outlineSpotShadowColor="#color/white"
android:outlineProvider="none"
android:outlineAmbientShadowColor="#color/white"
android:divider="#color/white"
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="55dp"
android:background="#color/white"
android:paddingTop="10dp"
android:paddingBottom="10dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="36dp"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<ImageView
android:id="#+id/logo_white"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:src="#drawable/logo_white" />
<TextView
android:id="#+id/toolbarTextView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_vertical"
android:layout_marginLeft="15dp"
android:background="#drawable/toolbar_text_background"
android:drawableStart="#drawable/ic_filter"
android:drawableEnd="#drawable/ic_search"
android:drawablePadding="15dp"
android:gravity="fill_vertical"
android:hint="Toshkent Shahar"
android:paddingLeft="10dp"
android:paddingRight="15dp"
android:textSize="20sp" />
</LinearLayout>
</androidx.appcompat.widget.Toolbar>
</com.google.android.material.appbar.AppBarLayout>
I am getting this issue when only using Pixel 4 devices. I have a bottomnavigationview on my home screen and it just disappears.
Here is the code for my home screen
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
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:background="#color/colorWhite"
android:fitsSystemWindows="true"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.fragment.app.FragmentContainerView
android:id="#+id/nav_fragment_home_container"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="#id/bottom_navigation"
app:defaultNavHost="true"
app:navGraph="#navigation/home_nav_graph" />
<!--<FrameLayout
android:id="#+id/nav_fragment_container_list"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="#id/bottom_navigation" />-->
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorWhite"
app:itemBackground="#color/white_transparent"
app:itemTextColor="#drawable/bottom_nav_color"
app:labelVisibilityMode="labeled"
app:itemIconSize="#dimen/_18sdp"
android:isScrollContainer="false"
app:itemTextAppearanceActive="#style/BottomNavigationView.Active"
app:itemTextAppearanceInactive="#style/BottomNavigationView"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:menu="#menu/bottom_navigation" />
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/scan_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top"
app:fabCustomSize="#dimen/_35sdp"
app:layout_anchorGravity="center_horizontal"
app:layout_anchor="#id/bottom_navigation"
android:backgroundTint="#color/colorPrimaryDark"
app:tint="#null"
app:rippleColor="#color/colorPrimaryDark"
android:background="#color/colorPrimaryDark"
app:srcCompat="#drawable/ic_scan_nav"
app:elevation="#dimen/_10sdp"
android:translationZ="#dimen/_10sdp"
app:borderWidth="0dp"
android:outlineProvider="none"
tools:ignore="ContentDescription"
app:layout_constraintTop_toTopOf="#id/bottom_navigation"
app:layout_constraintBottom_toTopOf="#id/bottom_navigation"
app:layout_constraintLeft_toLeftOf="#id/bottom_navigation"
app:layout_constraintRight_toRightOf="#id/bottom_navigation"/>
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Scan Receipt"
style="#style/SfProDisplay10Pt"
android:layout_marginTop="3dp"
app:elevation="#dimen/_20sdp"
android:translationZ="#dimen/_20sdp"
app:layout_constraintTop_toBottomOf="#id/scan_button"
app:layout_constraintLeft_toLeftOf="#id/scan_button"
app:layout_constraintRight_toRightOf="#id/scan_button"/>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone"
android:elevation="#dimen/_20sdp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
android:id="#+id/spendleeid_layout"/>
</androidx.constraintlayout.widget.ConstraintLayout>
As you can see there is a FragmentContainerView, which shows fine but on the Pixel 4, the bottomnavigationview disappears. From checking the layout inspector while debugging it seems that the bottomnavigation becomes invisible or hidden behind the view. On other devices I see it works fine. One thing that I see that fixes this issue is changing the style of the activity to include this
<item name="android:windowFullscreen">true</item>
I would just like to know if there is any way I can show the bottomnavigationview without using the fullscreen style. Or is there any plausible explanation for this? Any help would be appreciated
try another layout like LinearLayout
it maybe help
Please help me. I have a tab layout and a viewpager. I have 2 problems. I want to decrease the height of tablayout. Also while scrolling(a list view in the page) as the viewpager is behind tab layout , the tab layout hides some elements of the list. Please help me solve the problem!!!
The problem can be resolved but i dont know how. Please hep me soon.I have tried many ways but nothing solved it. Also send the entire corrected code as answer
If i just set the layoutheight of the tab layout... this happens...
See there is a white line below the bottom grey color tablayout
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/res-auto"
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:id="#+id/root">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.NoActionBar.AppBarOverlay">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/bgColor"
app:popupTheme="#style/AppTheme.PopupOverlay">
<!--app:layout_scrollFlags="scroll|snap"-->
<TextView
android:id="#+id/tv_selected_chat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:gravity="center_vertical"
android:text="0"
android:textColor="#color/colorWhite"
android:textSize="17sp"
android:visibility="gone" />
</androidx.appcompat.widget.Toolbar>
</com.google.android.material.appbar.AppBarLayout>
<androidx.viewpager.widget.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="644dp"
android:paddingBottom="20dp"
ads:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:showIn="#layout/activity_main">
</androidx.viewpager.widget.ViewPager>
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/open_new_chat_fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|right"
android:layout_marginRight="27dp"
android:layout_marginBottom="84dp"
android:tint="#color/colorWhite"
android:visibility="visible"
app:backgroundTint="#color/colorAccent"
app:fabSize="normal"
app:layout_anchor="#id/view_pager"
app:layout_anchorGravity="bottom|right|end"
app:srcCompat="#drawable/ic_message" />
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/text_status_fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|right"
android:layout_marginRight="27dp"
android:layout_marginBottom="84dp"
android:tint="#color/colorWhite"
android:visibility="invisible"
app:backgroundTint="#color/colorGreen"
app:fabSize="normal"
app:layout_anchor="#id/view_pager"
app:layout_anchorGravity="bottom|right|end"
app:srcCompat="#drawable/ic_edit" />
<com.google.android.material.tabs.TabLayout
android:id="#+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="65dp"
android:background="#color/bgColor"
ads:layout_anchor="#+id/view_pager"
ads:layout_anchorGravity="bottom|center"
ads:tabBackground="#color/actionModeBackground"
ads:tabIndicatorColor="#color/audio_wave_background"
ads:tabIndicatorHeight="2dp"
app:tabGravity="fill"
app:tabMaxWidth="0dp"
app:tabMode="fixed"
app:tabSelectedTextColor="#android:color/white" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
you can use hardcode value of height as like 20dp etc as much you require. also move your view pager upside appbar layout and use this code
<androidx.viewpager.widget.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="644dp"
android:paddingBottom="20dp"
ads:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:showIn="#layout/activity_main"/>
look at your code you dont use this instead of using this
<androidx.viewpager.widget.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="644dp"
android:paddingBottom="20dp"
ads:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:showIn="#layout/activity_main">
</androidx.viewpager.widget.ViewPager>
it means you are using this area to add some layout etc.
In my ProfileFragment.java I have a collapsing toolbar.
There is a problem when I scroll the toolbar; my profile image doesn't scroll entirely.
Does the collapsing toolbar need to be inside a Coordinator Layout?
I've tested with relative and I couldn't scroll.
This is a gif showing its behavior:
.
This is my XML code:
<android.support.design.widget.AppBarLayout
android:id="#+id/testeparabackground"
android:layout_width="match_parent"
android:layout_height="203dp"
android:background="?attr/actionBarDivider">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/backgroundcollapsedtoolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:expandedTitleMarginEnd="64dp"
app:expandedTitleMarginStart="48dp"
app:layout_scrollFlags="exitUntilCollapsed|scroll">
<ImageView
android:id="#+id/imgFotoCapa"
android:layout_width="446dp"
android:layout_height="203dp"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:paddingLeft="-32dp"
android:visibility="visible"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:srcCompat="#drawable/banner_profile"
tools:layout_editor_absoluteY="1dp" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbarid"
android:layout_width="match_parent"
android:layout_height="110dp"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<ImageView
android:id="#+id/picFotoPerfil3"
android:layout_width="117dp"
android:layout_height="103dp"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="109dp"
android:elevation="50dp"
app:layout_anchor="#+id/testeparabackground"
app:layout_anchorGravity="bottom|center"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#android:color/black" />
</android.support.design.widget.CoordinatorLayout>
Add app:layout_behavior="#string/appbar_scrolling_view_behavior" inside your ImageView