I would like to hide a layout behind another component in my activity_main.xml. I am using a bottom sheet and would only like to view the top portion. The bottom should be hidden behind my toolbar. Is there a function or property that will push the layout behind the component?
main_activity.xml
<?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=".MainActivity">
<fragment
android:id="#+id/top_app_bar"
android:name="com.ds.base.fragments.TopAppBarFragment"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_constraintBottom_toTopOf="#+id/include"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_chainStyle="spread" />
<include
android:id="#+id/include"
android:layout_height="0dp"
android:layout_width="match_parent"
layout="#layout/content_main"
app:layout_constraintBottom_toTopOf="#+id/main_bottom_app_bar"
app:layout_constraintStart_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#+id/top_app_bar"/>
<fragment
android:id="#+id/main_bottom_app_bar"
android:name="com.ds.base.fragments.BottomAppBarFragment"
android:layout_width="match_parent"
android:layout_height="90dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#+id/include">
</fragment>
<include
android:id="#+id/time_remaining_layout"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
layout="#layout/time_remaining_bottom_sheet"
app:layout_constraintTop_toTopOf="#id/main_bottom_app_bar"/>
</androidx.constraintlayout.widget.ConstraintLayout>
use in xml
android:visibility="gone"
or
android:visibility="invisible"
also use in java(activity) code
view.setVisibility(View.INVISIBLE);
or
view.setVisibility(View.GONE);
To bring any View to top, You have to call
yourView.bringToFront()
Related
My activity is something like
<androidx.constraintlayout.widget.ConstraintLayout 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">
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#E7E7E7"
app:layout_constraintBottom_toTopOf="#+id/dummy"
app:layout_constraintTop_toTopOf="parent">
<include
android:id="#+id/bottomSheet"
layout="#layout/bottom_sheet_persistent" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
<View
android:id="#+id/dummy"
android:background="#F44336"
android:layout_width="match_parent"
android:layout_height="80dp"
app:layout_constraintBottom_toBottomOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
And the bottom sheet is as bottom_sheet_persistent.xml
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/bottomSheet"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:behavior_hideable="false"
app:behavior_peekHeight="80dp"
app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior">
<View
android:layout_width="match_parent"
android:layout_height="400dp"
android:background="#2196F3"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
The screenshot is
As you can understand from the xml that, the red part is just a static view and blue is the bottomsheet. The bottomsheet also works as expected. What I wanted to achieve is, when the user start scrolls from the static view (Red View), I would like to scroll up the bottomsheet.
Thanks in advance.
As one can see in image, RecyclerView items are visible through Standard/Persistent BottomSheet and collapsing/expanding of BottomSheet is also not happening in Standard/Persistent BottomSheet. RecyclerView items are scrollable but when I do any kind of activity in Standard/Persistent BottomSheet, it directly scrolling the RecyclerView item behind this Standard/Persistent BottomSheet.
Note: Background color used in BottomSheet is solid. It's not transparent.
I'm wondering how to solve this issue?
Here's the code snippet ->
activity_main.xml
<?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:id="#+id/layout_container_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="app.standardbottomsheet.ui.MainActivity">
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:id="#+id/layout_container_1"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintBottom_toBottomOf="parent"
tools:context="app.standardbottomsheet.ui.MainActivity">
<include
android:id="#+id/included_layout_standard_bottom_sheet"
layout="#layout/layout_standard_bottom_sheet" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recycler_list"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
layout_standard_bottom_sheet.xml
<?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"
android:id="#+id/layout_container_bottom_sheet"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="#string/bottom_sheet_behavior">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/summary"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/thumbnail"
android:layout_width="?actionBarSize"
android:layout_height="?actionBarSize"
android:src="#mipmap/ic_launcher"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/app_name"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toRightOf="#id/thumbnail"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<com.google.android.material.slider.Slider
android:id="#+id/progress"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/summary" />
</androidx.constraintlayout.widget.ConstraintLayout>
As you can see in the image your bottom sheet is behind the recycler view. To change that you have to change the order of recyclerview and coordinatelayour in your activity_main.xml
You can try by changing the order like this
<?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:id="#+id/layout_container_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="app.standardbottomsheet.ui.MainActivity">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recycler_list"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:id="#+id/layout_container_1"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintBottom_toBottomOf="parent"
tools:context="app.standardbottomsheet.ui.MainActivity">
<include
android:id="#+id/included_layout_standard_bottom_sheet"
layout="#layout/layout_standard_bottom_sheet" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Since both recycler view and CoordinatorLayout are match_parent, There order decide which is above to another.
in my app i created a bootom menubar layout with floating button and i include that in my main activity and also i place a recycler view in my main activity
i just add 100 items to display in my recyclerview to check whether it was working or not for that when i run my application the recycler view of last item hides inside the bottom menu bar how to solve this
here is the sample image of what i said
activity_main.xml
<include
layout="#layout/toolbar"
android:id="#+id/toolbar"
/>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recycle"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/toolbar"
app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
/>
<include
android:id="#+id/bottom_nav"
layout="#layout/bottom_menu_bar"
/>
bottom menu bar. xml
<?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"
android:id="#+id/relativeLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottom_nav"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:menu="#menu/bottom_nav_menu" />
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/fab_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="#dimen/margin_padding"
android:src="#drawable/ic_add"
android:tint="#color/colorWhite"
app:backgroundTint="#color/colorPrimary"
app:layout_anchor="#id/bottom_nav"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:elevation="#dimen/floating_b_ele"
android:clickable="true"
android:focusable="true"
/>
</androidx.constraintlayout.widget.ConstraintLayout>
add a layout_marginBottom to the RecyclerView which is equal to the height of the bottom navigation
I have the following code
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".ui.main.MainActivity">
<fragment
android:id="#+id/navHostFragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:defaultNavHost="true"
app:navGraph="#navigation/main_graph" />
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:id="#+id/coordinatorLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="8dp">
<include layout="#layout/bottom_sheet" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
And
<?xml version="1.0" encoding="utf-8"?><!--suppress AndroidUnknownAttribute -->
<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:id="#+id/bottomSheet"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/bottom_sheet_corners"
android:clickable="true"
android:focusable="true"
app:behavior_hideable="false"
app:behavior_peekHeight="0dp"
app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior"
tools:ignore="ContentDescription">
<com.mobilemedia.tanuki.ui.view.RoundedView
android:id="#+id/bottomSheetContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:topLeftCornerRadius="16dp"
app:topRightCornerRadius="16dp">
<fragment
android:id="#+id/bottomSheetNavHostFragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:defaultNavHost="true"
app:navGraph="#navigation/bottom_sheet_graph" />
</com.mobilemedia.tanuki.ui.view.RoundedView>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/collapsedView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<View
android:layout_width="32dp"
android:layout_height="4dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:background="#drawable/bottom_sheet_indicator"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
I need to listen to the change in height bottom sheet layout for change the position of elements relative to this height
The item must always be at a height from bottom sheet despite the fact that he is on another fragment in navHostFragment
How listen change height from bottom sheet?
In common case, you can listen to the bottom sheet slide by using BottomSheetCallback. Override onSlide method and put your actions inside. This method called when the bottom sheet is being dragged. And you can get all the properties of bottomSheet, including height.
But the better way is to implement custom CoordinatorLayout.Behavior. This works only if your depending views and BottomSheet are the children of the same coordinatorlayout.
Just extend CoordinatorLayout.Behavior and override layoutDependsOn and onDependentViewChanged methods. CoordinatorLayout was made to solve issues like that.
There are many articles about this on the internet, for example.
There is also a standard floating action button behavior in the android library.
The third way is to use MotionLayout. But it is a more complex, and it can be difficult to start. So I should not suggest it, because it could be over powerful for this task.
I am working for the first time with NavigationBar widget and I cannot set the FrameLayout not to go behind the NavigationBar.
I've tried really everything: to set both in a RelativeLayout (NavigationBar disappears) , every setting I've found here around StackOverflow but I didn't succeed.
Here is my code:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="mypackage.myActivity"
android:background="#color/background_activities">
<FrameLayout
android:id="#+id/frame_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:animateLayoutChanges="true"
app:layout_constraintTop_toTopOf="parent"
android:fitsSystemWindows="true"
>
</FrameLayout>
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#color/color_NavigationBar"
app:itemIconTint="#color/white"
app:itemTextColor="#color/white"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:menu="#menu/navigation" />
</android.support.constraint.ConstraintLayout>
Hope someone will help me to figure out where I made the mistake.
Thank you very much
EDIT
Now the navigation bar started to change dimension while clicked (it looks like the whole layout is "renderized" again) and now it get stucks in such a position
Try this, set the frame layout constraints to clip completly to the parent, except the bottom to clip to the navigation's top, then set the height and width to 0dp so it can grow according to the constraints:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="mypackage.myActivity"
android:background="#color/background_activities">
<FrameLayout
android:id="#+id/frame_layout"
android:layout_width="0dp"
android:layout_height="0dp"
android:animateLayoutChanges="true"
app:layout_constraintBottom_toTopOf="#+id/navigation"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"></FrameLayout>
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#color/color_NavigationBar"
app:itemIconTint="#color/white"
app:itemTextColor="#color/white"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:menu="#menu/navigation" />
</android.support.constraint.ConstraintLayout>