I am having an issue with the display of the backdrop menu from material-ui for android together with a nested scroll view which comes on top of the backdrop when scrolling, I have been trying to use the elevation property on different elements hoping that it will work but I got no where;
this is the layout for main_fragment.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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:clipChildren="false"
android:clipToPadding="false"
tools:context=".MainFragment">
<LinearLayout
style="#style/Widget.Provenance.Backdrop"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_horizontal"
android:orientation="vertical"
android:paddingTop="88dp">
<include layout="#layout/backdrop_menu" />
</LinearLayout>
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:elevation="8dp">
<androidx.appcompat.widget.Toolbar
android:id="#+id/app_bar"
style="#style/Widget.Provenance.Toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:elevation="10dp"
android:paddingStart="12dp"
android:paddingLeft="12dp"
android:paddingEnd="12dp"
android:paddingRight="12dp"
app:layout_scrollFlags="scroll|enterAlways"
app:contentInsetStart="0dp"
app:navigationIcon="#drawable/menu_icon"
app:title="#string/app_name" />
</com.google.android.material.appbar.AppBarLayout>
<androidx.core.widget.NestedScrollView
android:id="#+id/nested_grid"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="56dp"
android:background="#color/colorPrimary"
android:clipToPadding="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<include
android:id="#+id/main_lay"
layout="#layout/main_menu_layout" />
</androidx.core.widget.NestedScrollView>
</FrameLayout>
then main_menu_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linLayMain"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="vertical"
android:padding="15dp">
<TextView
android:id="#+id/titleTextView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="18dp"
android:gravity="center_horizontal"
android:text="#string/app_name"
android:textAlignment="center"
android:textColor="#color/colorPrimaryDark"
android:textAppearance="#style/TextAppearance.AppCompat.Body1"
android:textSize="30sp" />
<com.google.android.material.button.MaterialButton
android:id="#+id/buttonCreateUserMainMenu"
android:layout_marginTop="26dp"
style="#style/Widget.Provenance.Button.Menu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="gone"
android:text="#string/button_create_user_main_menu" />
<com.google.android.material.button.MaterialButton
android:id="#+id/buttonAddProductMainMenu"
style="#style/Widget.Provenance.Button.Menu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="gone"
android:text="#string/button_add_product_main_menu" />
<com.google.android.material.button.MaterialButton
android:id="#+id/buttonTransferProductMainMenu"
style="#style/Widget.Provenance.Button.Menu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="gone"
android:text="#string/button_transfer_product_main_menu" />
<com.google.android.material.button.MaterialButton
android:id="#+id/buttonShowAccountQRMainMenu"
style="#style/Widget.Provenance.Button.Menu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="gone"
android:text="#string/button_show_account_qr_main_menu" />
<com.google.android.material.button.MaterialButton
android:id="#+id/buttonQRCodeScanMainMenu"
style="#style/Widget.Provenance.Button.Menu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/button_qrcode_scan_main_menu" />
<com.google.android.material.button.MaterialButton
android:id="#+id/buttonOne"
style="#style/Widget.Provenance.Button.Menu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/button_one" />
<com.google.android.material.button.MaterialButton
android:id="#+id/buttonTwo"
style="#style/Widget.Provenance.Button.Menu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/button_two" />
<com.google.android.material.button.MaterialButton
android:id="#+id/buttonTest"
style="#style/Widget.Provenance.Button.Menu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Test" />
</LinearLayout>
then backdrop_menu.xml
<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android">
<com.google.android.material.button.MaterialButton
style="#style/Widget.Provenance.Button.TextButton"
android:id="#+id/menuItemLogin"
android:textColor="#color/colorWhite"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/backdrop_menu_login" />
<com.google.android.material.button.MaterialButton
style="#style/Widget.Provenance.Button.TextButton"
android:id="#+id/menuItemCommercial"
android:visibility="gone"
android:textColor="#color/colorWhite"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/backdrop_menu_commercial" />
<com.google.android.material.button.MaterialButton
style="#style/Widget.Provenance.Button.TextButton"
android:id="#+id/menuItemOption2"
android:textColor="#color/colorWhite"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/backdrop_menu_option2" />
<View
android:layout_width="56dp"
android:layout_height="1dp"
android:layout_margin="16dp"
android:background="?android:attr/textColorPrimary" />
<com.google.android.material.button.MaterialButton
style="#style/Widget.Provenance.Button.TextButton"
android:id="#+id/menuItemProducts"
android:textColor="#color/colorWhite"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/backdrop_menu_products" />
<com.google.android.material.button.MaterialButton
style="#style/Widget.Provenance.Button.TextButton"
android:id="#+id/menuItemLogout"
android:textColor="#color/colorWhite"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/backdrop_menu_logout" />
</merge>
in the following picture, in red are buttons that should not be on top of the backdrop menu, when i scroll in the main menu layout i want it to go under the backdrop menu; thanks in advance
Try using CollapsingToolbarLayout
<?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"
android:id="#+id/root"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
<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.AppBarOverlay">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:id="#+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:titleEnabled="false">
<LinearLayout
style="#style/Widget.Provenance.Backdrop"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="vertical"
android:paddingTop="88dp">
<include layout="#layout/backdrop_menu" />
</LinearLayout>
<androidx.appcompat.widget.Toolbar
android:id="#+id/app_bar"
style="#style/Widget.Provenance.Toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:elevation="10dp"
android:paddingStart="12dp"
android:paddingLeft="12dp"
android:paddingEnd="12dp"
android:paddingRight="12dp"
app:contentInsetStart="0dp"
app:layout_scrollFlags="scroll|enterAlways"
app:navigationIcon="#drawable/menu_icon"
app:title="#string/app_name" />
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
<androidx.core.widget.NestedScrollView
android:id="#+id/nested_grid"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="56dp"
android:clipToPadding="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<include
android:id="#+id/main_lay"
layout="#layout/main_menu_layout" />
</androidx.core.widget.NestedScrollView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
Related
I have a BottomNavigationView Bar on my App. This bar does not show on where it is placed until it's scrolled.
How can I change the Behavior so that the bar shows even without scrolling. That is I want a permanent Fixed position to the bottom, if user does not scroll id remains there, if they scroll it remains there still.
Here is my app_bar xml code
<?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="com.sckoolboy.app.AspirantOfflineActivity">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<androidx.appcompat.widget.Toolbar
android:visibility="gone"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</com.google.android.material.appbar.AppBarLayout>
<include layout="#layout/content_main" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:fitsSystemWindows="true"
android:background="?android:attr/windowBackground"
android:foreground="?attr/selectableItemBackground"
app:menu="#menu/master_bottom_navigation"
app:elevation="10dp"
app:labelVisibilityMode="labeled"
app:itemIconTint="#color/accent"
app:itemTextColor="#color/black"
app:itemBackground="#color/bottomNavigationBackground"/>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
And below is how this bar appears on my main activity
<?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"
tools:context="com.sckoolboy.app.AspirantOfflineActivity"
tools:showIn="#layout/app_bar_main"
style="#style/parent.contentLayout">
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="50dp"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/textViewUser"
style="#style/viewParent.headerText"
android:maxLines="2"
android:text="Aspirant Mode"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"/>
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/profileCircleImageView"
android:layout_width="60dp"
android:layout_height="60dp"
app:civ_border_width="2dp"
app:civ_border_color="#color/colorAccent"
android:src="#drawable/icon"
android:layout_alignParentRight="true" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp">
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="20dp"
app:cardCornerRadius="16dp"
app:cardPreventCornerOverlap="false"
app:cardBackgroundColor="#color/colorAccent"
android:minHeight="200dp"
android:layout_alignParentTop="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:gravity="center_vertical">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:padding="10dp"
android:orientation="vertical"
android:layout_weight="1">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Welcome to \nSckoolboy"
android:textColor="#color/whiteBodyColor"
android:textStyle="bold"
android:textSize="20sp"/>
<TextView
android:layout_marginTop="15dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="20% Complete"
android:textColor="#color/whiteBodyColor"
android:textStyle="bold"
android:textSize="13sp"/>
</LinearLayout>
<ImageView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:cropToPadding="true"
android:src="#drawable/hero"
android:elevation="44dp"/>
</LinearLayout>
</androidx.cardview.widget.CardView>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp">
<TextView
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:text="Popular"
style="#style/viewParent.headerText"/>
<TextView
android:layout_alignParentRight="true"
style="#style/viewParent"
android:text="See All"
android:layout_centerVertical="true"
android:textSize="#dimen/headerMoreTextSize"
android:textColor="#color/colorAccent"
android:textStyle="bold"/>
</RelativeLayout>
<!--remove the below layout with recycler view, use card poplar courses as model for design-->
<LinearLayout
android:layout_width="match_parent"
android:layout_marginBottom="50dp"
android:layout_height="wrap_content"
android:orientation="vertical">
<include
android:id="#+id/includeCallEnd0"
layout="#layout/offline_exam_etest"/>
<include
android:id="#+id/includeCallEnd0"
layout="#layout/sckoolboy_community"/>
<include
android:id="#+id/includeCallEnd0"
layout="#layout/sckoolboy_radio"/>
</LinearLayout>
</LinearLayout>
</androidx.core.widget.NestedScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
You can get the BottomNavigationView out of the CoordinatorLayout, and add both to another root layout:
<?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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.sckoolboy.app.AspirantOfflineActivity">
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#+id/navigation">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<androidx.appcompat.widget.Toolbar
android:visibility="gone"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</com.google.android.material.appbar.AppBarLayout>
<include layout="#layout/content_main" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:fitsSystemWindows="true"
android:background="?android:attr/windowBackground"
android:foreground="?attr/selectableItemBackground"
app:menu="#menu/master_bottom_navigation"
app:elevation="10dp"
app:labelVisibilityMode="labeled"
app:itemIconTint="#color/accent"
app:itemTextColor="#color/black"
app:layout_constraintBottom_toBottomOf="parent"
app:itemBackground="#color/bottomNavigationBackground"/>
</androidx.constraintlayout.widget.ConstraintLayout>
I'm trying to place a button to the right side of AppBarOverlay, I have got it to appear it to the right, but it's below AppBarOverlay text. Below is the image of what it looks like now.
Instead I want the "clear" button to appear where I have drawn the red circle
Below is my activity_main.xml
<?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"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/Theme.Verify.AppBarOverlay">
<TextView
android:id="#+id/title"
android:layout_alignParentLeft="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:minHeight="?actionBarSize"
android:padding="#dimen/appbar_padding"
android:text="#string/app_name"
android:textAppearance="#style/TextAppearance.Widget.AppCompat.Toolbar.Title" />
<Button
android:id="#+id/clear"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_gravity="end"
android:text="Clear"
android:textColor="#FFF"
android:textSize="12sp" />
</com.google.android.material.appbar.AppBarLayout>
<TextView
android:id="#+id/status"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:background="#333333"
android:gravity="bottom"
android:scrollbars="vertical"
android:textColor="#ffffff" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
AppBarLayout is a vertical LinearLayout. So you can't achieve this with AppBarLayout.
For reference https://developer.android.com/reference/com/google/android/material/appbar/AppBarLayout
You can achieve your desired output by using Toolbar
<?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"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/Theme.Verify.AppBarOverlay">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay">
<TextView
android:id="#+id/title"
android:layout_alignParentLeft="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:minHeight="?actionBarSize"
android:padding="#dimen/appbar_padding"
android:text="#string/app_name"
android:textAppearance="#style/TextAppearance.Widget.AppCompat.Toolbar.Title" />
<Button
android:id="#+id/clear"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_gravity="end"
android:text="Clear"
android:textColor="#FFF"
android:textSize="12sp" />
</androidx.appcompat.widget.Toolbar>
</com.google.android.material.appbar.AppBarLayout>
<TextView
android:id="#+id/status"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:background="#333333"
android:gravity="bottom"
android:scrollbars="vertical"
android:textColor="#ffffff" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
I have an AppBar and other things in my layout. When the user scrolls down, I want AppBar(actually, the Toolbar to hide. This is what I have tried, the app bar isn't hiding all small part it just stays there. Actually I think the problem is with my header of the screen it gets collapsed and adds a small space when I scroll.
As you can see in second image some part stays it doesn't hide. I need to hide that part while scrolling.
Please provide me solution what am I doing wrong?
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:orientation="vertical">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleTextAppearance="#style/TextAppearance.AppCompat.Title"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:titleEnabled="false">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/slideIV"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="#drawable/ic_dish" />
<View
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/bottomButtonRL"
android:layout_gravity="bottom"
android:background="#drawable/gradient_bg" />
<View style="#style/itemBottomViewLarge" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_margin="#dimen/_20"
android:gravity="center_vertical"
android:orientation="vertical">
<de.hdodenhof.circleimageview.CircleImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#drawable/fake_chef_bg"
app:civ_border_color="#color/border_grey_color"
app:civ_border_width="#dimen/_2" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/_5"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/bold_font"
android:text="#string/fatima_al_zahraa"
android:textColor="#color/white"
android:textSize="#dimen/large_text_size"
android:textStyle="bold" />
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:fontFamily="#font/regular_font"
android:text="#string/presenter_of_the_cuient"
android:textColor="#color/white"
android:textSize="#dimen/app_text_size" />
</LinearLayout>
</LinearLayout>
<RelativeLayout
android:id="#+id/bottomButtonRL"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_below="#+id/slideIV"
android:layout_marginTop="-25dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<View
android:layout_width="match_parent"
android:layout_height="#dimen/_0"
android:layout_weight="1" />
<View
android:layout_width="match_parent"
android:layout_height="#dimen/_0"
android:layout_weight="1"
android:background="#color/defaultColor" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingStart="#dimen/_20"
android:paddingLeft="#dimen/_20">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="#drawable/ic_share" />
<RelativeLayout
android:layout_width="220dp"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/_10"
android:layout_marginLeft="#dimen/_10"
android:background="#drawable/ic_rec1">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fontFamily="#font/regular_font"
android:gravity="center"
android:layout_centerInParent="true"
android:text="#string/add_to_fav"
android:textColor="#color/white"
android:textSize="#dimen/medium_text_size" />
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/bottom_radius_view">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/regular_font"
android:padding="#dimen/_20"
android:text="#string/galetes_fires_au_plates_fires_au_plates_fires_au_plates_fires_au_plates_fires_au_plates"
android:textColor="#color/white"
android:textSize="#dimen/app_text_size" />
</LinearLayout>
</LinearLayout>
<androidx.appcompat.widget.Toolbar
android:visibility="gone"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
/>
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingLeft="#dimen/_20"
android:paddingTop="#dimen/_10"
android:paddingRight="#dimen/_20">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/bold_font"
android:padding="#dimen/_5"
android:text="#string/les_videos"
android:textColor="#color/medium_grey_text_color"
android:textSize="#dimen/large_text_size" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/itemFRV"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="#dimen/_5" />
</LinearLayout>
</androidx.core.widget.NestedScrollView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</layout>
This is the header code:
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="#dimen/header_height"
android:background="#color/white"
android:gravity="center"
android:orientation="horizontal"
android:paddingLeft="#dimen/_20"
android:paddingRight="#dimen/_20">
<LinearLayout
android:id="#+id/backLL"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="left"
android:gravity="center"
android:paddingRight="#dimen/_20"
android:layout_marginBottom="#dimen/_10"
android:visibility="gone">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="#drawable/ic_back" />
</LinearLayout>
<ImageView
android:id="#+id/logoIV"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:adjustViewBounds="true"
android:paddingStart="0dp"
android:paddingTop="#dimen/_15"
android:paddingEnd="#dimen/_10"
android:layout_marginBottom="#dimen/_10"
android:src="#drawable/ic_header_logo" />
<View
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1" />
<ImageView
android:id="#+id/profileIV"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:adjustViewBounds="true"
android:paddingStart="#dimen/_10"
android:paddingTop="#dimen/_15"
android:paddingEnd="0dp"
android:layout_marginBottom="#dimen/_10"
android:src="#drawable/ic_default_user" />
</LinearLayout>
</layout>
Answer to the problem is just remove
android:fitsSystemWindows="true"
Change the layout_scrollFlags
app:layout_scrollFlags="scroll|exitUntilCollapsed"
replace above line with
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed"
I trying to add ToolBar to this layout, but I seeing the titleTextView is hidding behind the toolbar becasue the ScrollView is first child in layout, I tried to make ScrollView layout_height="wrap_content" but also not working
here's the full layout xml
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/detailsActivity"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".DetailsActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<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/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="20dp"
android:src="#drawable/icons8_share_480"
app:fabSize="auto"
app:layout_anchor="#id/linearLayout"
app:layout_anchorGravity="start|bottom"
/>
<ProgressBar
android:id="#+id/progressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="?android:attr/progressBarStyleLarge"
android:layout_gravity="center"
/>
<ScrollView
android:id="#+id/scrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/titleTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="15dp"
android:textSize="25sp"
android:textStyle="bold" />
<TextView
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="16dp"
android:textSize="16sp" />
<ImageView
android:id="#+id/imageView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:layout_marginBottom="20dp"
android:src="#mipmap/ic_launcher"
android:visibility="gone" />
<Button
android:id="#+id/button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="50dp"
android:text="some text"
android:textAllCaps="false"
android:textSize="20sp"
/>
</LinearLayout>
</ScrollView>
</android.support.design.widget.CoordinatorLayout>
this image with AppBarLayout
detailsActivity AppBar issue
this without AppBarLayout
detailsActivity
Change the root layout to LinearLayout and make AppBarLayout the child of it, and put all other layouts insde CoordinatorLayout
here's the xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:id="#+id/detailsActivity"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".DetailsActivity"
android:orientation="vertical"
>
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<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/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="20dp"
android:src="#drawable/icons8_share_480"
app:fabSize="auto"
app:layout_anchor="#id/linearLayout"
app:layout_anchorGravity="start|bottom"
/>
<ProgressBar
android:id="#+id/progressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="?android:attr/progressBarStyleLarge"
android:layout_gravity="center"
/>
<ScrollView
android:id="#+id/scrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/titleTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="15dp"
android:textSize="25sp"
android:textStyle="bold" />
<TextView
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="16dp"
android:textSize="16sp" />
<ImageView
android:id="#+id/imageView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:layout_marginBottom="20dp"
android:src="#mipmap/ic_launcher"
android:visibility="gone" />
<Button
android:id="#+id/button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="50dp"
android:text="some text"
android:textAllCaps="false"
android:textSize="20dp"
/>
</LinearLayout>
</ScrollView>
</android.support.design.widget.CoordinatorLayout>
</LinearLayout>
I am having following issues when using bottomsheet with snackbar:
Whenever Snackbar is shown then Bottoomsheet is getting inflated first.
Refer screenshot below
Here is the layout file, id of bottomSheet is details_bottom_sheet
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:animateLayoutChanges="true"
android:fitsSystemWindows="true"
tools:context="project.udacity.com.investishare.ui.ItemsDetailActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:popupTheme="#style/AppTheme.PopupOverlay" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/tv_subhead_desc"
style="#style/TextAppearance.AppCompat.Caption"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="#dimen/subheading_margin_bottom"
android:layout_marginLeft="#dimen/subheading_margin_left"
android:layout_marginStart="#dimen/subheading_margin_left"
android:drawableLeft="#drawable/ic_subtree"
android:drawablePadding="#dimen/subheading_drawable_padding"
android:drawableStart="#drawable/ic_subtree"
android:gravity="center_vertical"
android:paddingLeft="#dimen/subheading_padding_left"
android:paddingStart="#dimen/subheading_padding_left"
android:textColor="#color/color_white"
android:textSize="#dimen/tv_subhead_desc_text_size"
tools:text="#string/tv_subhead_desc_sample_text" />
<TextView
android:id="#+id/tv_shared_with"
style="#style/TextAppearance.AppCompat.Caption"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/tv_subhead_desc"
android:layout_marginBottom="#dimen/subheading_margin_bottom"
android:layout_marginLeft="#dimen/subheading_margin_left"
android:layout_marginStart="#dimen/subheading_margin_left"
android:drawableLeft="#drawable/ic_shared_white"
android:drawablePadding="#dimen/subheading_drawable_padding"
android:drawableStart="#drawable/ic_shared_white"
android:gravity="center_vertical"
android:paddingEnd="#dimen/tv_shared_with_padding_right"
android:paddingLeft="#dimen/subheading_padding_left"
android:paddingRight="#dimen/tv_shared_with_padding_right"
android:paddingStart="#dimen/subheading_padding_left"
android:textColor="#color/color_white"
android:textSize="#dimen/tv_shared_with_text_size"
tools:text="#string/tv_shared_with_sample_text" />
<ImageView
android:id="#+id/iv_remove_sharing"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_below="#id/tv_subhead_desc"
android:layout_marginEnd="#dimen/subheading_drawable_padding"
android:layout_marginRight="#dimen/subheading_drawable_padding"
android:clickable="true"
android:contentDescription="#string/cd_remove_sharing"
android:foreground="?attr/selectableItemBackgroundBorderless"
android:padding="#dimen/subheading_drawable_padding"
android:src="#drawable/ic_cancel_white" />
</RelativeLayout>
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_items_detail" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab_detail_activity"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="#dimen/fab_margin"
android:src="#drawable/ic_shared_white" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="450dp"
android:id="#+id/details_bottom_sheet"
android:elevation="16dp"
android:background="#color/color_white"
app:layout_behavior="#string/bottom_sheet_behavior">
<TextView
android:id="#+id/bottom_sheet_header"
style="#style/Base.TextAppearance.AppCompat.Title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/textview_bg"
android:padding="10dp"
android:text="hello"
android:textSize="24sp" />
<android.support.v7.widget.RecyclerView
android:id="#+id/rv_bottom_sheet"
android:layout_width="match_parent"
android:layout_below="#id/bottom_sheet_header"
android:background="#color/color_white"
android:layout_height="wrap_content" />
</RelativeLayout>
</android.support.design.widget.CoordinatorLayout>