I am working with bottom sheet and it is working great if I dont add margin top.
I want the bottom sheet to fill the screen when pulled up but it also goes behind the Action Bar.
To solve this, I added margin top to the bottom sheet equivalent to the height of action bar, it works great until bottom bar is back to bottom.
<RelativeLayout
android:id="#+id/rl_bottom_sheet"
android:layout_width="match_parent"
android:layout_height="280dp"
android:margin_top="60dp"
app:behavior_peekHeight="80dp"
app:behavior_hideable="false"
app:layout_behavior="#string/bottom_sheet_behavior"
android:background="#drawable/ic_camera">
When bottom sheet is slided down, margin is no more there and view above the screen becomes equal to peekHeight + marginTop
Before Expanded
Collapsed after expanding once
One option is to use a Toolbar instead of adding a margin to the BottomSheet. You can put this inside the CoordinatorLayout at the top so it will be behind the BottomSheet. Make sure the View that has the BottomSheetBehavior is at the bottom of the layout and that it has a higher elevation than the Toolbar.
I can suggest you to change the root layout - from CoordinatorLayout to any other (Relative/Linear and so on). And after that you can add your CoordinatorLayout in your new root ViewGroup with desired marginTop.
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="80dp"
Related
I have a rather complex BottomSheetLayout which layout is as follow
The root view of my bottom sheet is a custom FrameLayout that allows to round it's corner (both background and children). Nothing else (nothing touch-related)
Then, I use the usual ConstraintLayout in order to layout my Bottom sheet.
This ConstraintLayout contains, amongst other views, a vertical RecyclerView:
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="10dp">
<!-- other views -->
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/events"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="25dp"
android:layout_marginBottom="74dp"
app:layout_constraintTop_toBottomOf="#+id/days"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:background="#{viewModel.colors.defaultBackgroundColor}"
tools:background="#ECF0F3"
android:orientation="vertical"
app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
tools:listitem="#layout/event_item"
tools:itemCount="10" />
</androidx.constraintlayout.widget.ConstraintLayout>
I have no particular issue while dragging my bottom sheet, however, when fully expanded I was expecting the be able to scroll the content of my RecyclerView. But I cannot.
After a lot of researches, I managed to make it scroll by enabling scrolling when my Fragment's view is inflated :
ViewCompat.setNestedScrollingEnabled(this.binding.bottomSheetEvents.getRoot(), true);
However, doing so has a weird consequence. When my bottom sheet's state is EXPANDED, I can finally scroll my RecyclerView, but then there is absolutely no way to drag my Bottom sheet any more : it remains fully expanded.
I have tried a few other ways.
I have tried wrapping my NestedScrollView. In past experience I was able to have the full content of my bottom sheet scrollable thanks to NestedScrollView, but in this case, I only want to scroll my RecyclerView. What ever is above it must remain idle.
I have tired this.binding.bottomSheetEvents.events.setNestedScrollingEnabled(false); but there is no difference.
My belief is that when the bottom sheet is fully expanded, it dispatches scroll events to inner children that can supports its. And, backwards, it knows, at some point, when uses wishes to collapse said bottom sheet. So I guess, something wrong must be happening there.
Further informations:
this bottomsheet is included in my fragment which roots view is a CoordinatorLayout obviously.
the fragment is also hosted in CoordinatorLayout with an AppBar
the include layout uses the app:layout_behavior="#string/bottom_sheet_behavior"
and the include layout also uses behavior_fitToContents set to false so that I can use method setExpandedOffset to prevent the bottom sheet to reach the top.
Version used : 1.1.0-alpha07
Thanks for the help!
I'm struggled with this for hours looking for solution on google and stackoverflow. Thought that this is some trivial bug in my app but finally made empty project and can reproduce this too. Just run new project and select "Tabbed Activity" with navigation style "Action Bar Tabs (with ViewPager)
Then try to put any widget at the bottom of the fragment's layout. I did this by modify fragment_main.xml and adding:
android:layout_height="match_parent"
android:gravity="bottom"
android:textAlignment="center"
So the whole layout is:
<?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/constraintLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity$PlaceholderFragment">
<TextView
android:id="#+id/section_label"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="#dimen/activity_vertical_margin"
android:gravity="bottom"
android:text="aaaaaaa"
android:textAlignment="center"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="#+id/constraintLayout"
tools:layout_constraintLeft_creator="1"
tools:layout_constraintTop_creator="1" />
</android.support.constraint.ConstraintLayout>
In design mode everything looks fine:
But when you run app:
You will see text only when you swipe action bar to hide it:
So it is impossible to set widget at the bottom of the tab's fragment or even match some list/picture to the height of the parent because bottom edge will be always under navigation bar.
Workaround which I found is here:
ViewPager with Toolbar and TabLayout has wrong height
First one is to put AppBarLayout and ViewPager between LinearLayout but then I lose hidding action bar functionality when scrolling ViewPager's content. Second one is add android:paddingBottom="?attr/actionBarSize" in ViewPager but then there is a gap when I hide action bar. Seriously there is no solution for this?
I think this is an expected behavior since the ActionBar gets hidden when scrolling up. In the design mode the text can be shown because it doesn't display the TabLayout. However, when you launch the app, it will inflate the TabLayout and the fragment will go below it. So it's not like the fragment is getting expanded or giving you wrong height.
Imagine putting an ImageView that has a matching height of the visible field (from below the TabLayout to right above the navigation menu). When you hide action bar from there, it will have a gap on the bottom since there's no content to fill up the space of hidden action bar, unless you stretch the ImageView as you scroll up, which will result in wired stretched image :/
One possible solution I can think of is, if you want to add a view on the bottom of the fragment, I will set the actionbar padding to the view and when I scroll the screen, I will adjust the padding depends on the scroll offset so that I can always be on the bottom.
i have botton inner of BottomSheetDialogFragment, i want botton always stay in bottom of screen when bottomSheet slide up / or drag, button not appear only when BottomSheet dismiss, this is layout of bottomSheetDialog
<FrameLayout>
<!--content-->
<LinearLayout
<!--header-->
<LinearLayout>
</LinearLayout>
<RelativeLayout>
<!--BOTTON-->
<Botton/>
</RelativeLayout>
</FrameLayout>
but button always in bottom of layout bottomSheet, not in bottom of screen.
how to keep it under the screen
i want create like comment line, but ui comment is button and i'm using buttonSheetDialog
I have a bottom sheet with its height and width set to match_parent. So when on button click I set the behavior to STATE_EXPANDED like this:
mBottomSheetBehavior.setState(BottomSheetBehavior.STATE_EXPANDED);
My Bottomsheet is defined as below:
<FrameLayout
android:id="#+id/bottom_sheet"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clickable="true"
android:elevation="#dimen/design_appbar_elevation"
app:behavior_hideable="true"
app:layout_behavior="#string/bottom_sheet_behavior">
<include
android:id="#+id/bottom_sheet_content"
layout="#layout/bottomsheet_layout" />
</FrameLayout>
I am monitoring states with the BottomSheet Callbacks.
I click on a button and bottom sheet expanded to full screen.
Its current State is STATE_EXPANDED
I quickly swipe down on the bottom sheet. (Not fully drag till it closed, simple swipe down like scrolling)
It stops at the middle and its state is logged as STATE_COLLAPSED
If I swipe again it is all gone and its state is STATE_HIDDEN
I don't understand why it stops in the middle. How can I make it hidden with a single swipe.
I tried that by setting peek_height to 0dp. By this, it never encounters the STATE_HIDDEN. When hidden, its state becomes STATE_COLLAPSED. I just don't understand this states.
How to achieve STATE_HIDDEN with a single swipe down?
Kinda late but I just stumbled upon this while searching for something similar.
This is how you can skip the collapsed state:
In XML by adding app:behavior_skipCollapsed="true" to the BottomSheet view.
OR
Programmatically with setSkipCollapsed(boolean).
I'm looking for a way to overlay a drop shadow onto a ScrollView like this:
My intention is to have another layout above and outside the ScrollView (the green one) that stays at the top while scrolling the content of the ScrollView. The ScrollView should have a drop shadow overlay at the top which appears to be from the layout above.
Since I want the content of the ScrollView to scroll into the drop shadow, that shadow must not be part of the layout above, otherwise the drop shadow would stay seperated from the scrolling contents below.
Any ideas how I can bring that drop shadow to life?
I found android:foreground but then read that it wouldn't work on ScrollViews.
Ok, found a solution to do this. This is what I did:
To have a drop shadow image overlay on the ScrollView, I put the ScrollView inside a FrameLayout and applied the drop shadow drawable to the FrameLayout via android:foreground.
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:foreground="#drawable/drop_shadow_bitmap"
android:foregroundGravity="top|fill_horizontal" >
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top" >