make sheet full screen
Closed this issue · 7 comments
I want to make a full screen sheet. this is my layout file
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.CoordinatorLayout
android:id="@+id/eventdetail_coordinatorlayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.hhtv.eventqa.activity.EventDetailActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="@+id/eventdetail_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
<android.support.design.widget.TabLayout
android:id="@+id/eventdetail_tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fillViewport="false"
app:tabGravity="fill"
app:tabIndicatorColor="@color/base_color_4"
app:tabIndicatorHeight="@dimen/tablayout_indicator_height"
app:tabMode="fixed" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="@+id/eventdetail_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
<com.hhtv.eventqa.customView.CustomFAB
android:id="@+id/eventdetail_fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:layout_alignParentBottom="true"
android:layout_margin="@dimen/fab_margin"
android:src="@drawable/ic_comment" />
<com.gordonwong.materialsheetfab.DimOverlayFrameLayout
android:id="@+id/dim_overlay"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<!-- Circular reveal container for the sheet -->
<io.codetail.widget.RevealLinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!-- Sheet that contains your items -->
<android.support.v7.widget.CardView
android:id="@+id/fab_sheet"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v7.widget.CardView>
</io.codetail.widget.RevealLinearLayout>
</RelativeLayout>
and the custom FAB class is same as your sample, but this is the result:
http://i.imgur.com/Xd9toz6.gif
please tell me how did I do wrong and how to fix it
thanks
It looks like your CardView
is either not centered on the screen or its width and height aren't filling the screen. I know I've had some difficulties styling CardView
s in the past so maybe try googling for that.
I'm getting a similar issue. When I move the FAB to the bottom center (layout_gravity in XML) the animation and card position is off. The animation expands toward the right and positions the material to the right and partly off screen, even though I've got both the RevealLinearLayout and the CardView set to layout_gravity="center".
Does the cardview appear centered when it's not used by the library?
I can tell you that the card is showing as centered in my IDE layout rendering. I see no reason why it would evidently appear to the right.
Gordon, I'm noticing odd behavior as the CardView layout_width XML parameter is changed. Now, I've got the FAB set to layout_gravity="bottom" so the FAB is at bottom center of the screen, and the CardView has layout_gravity="center" so it is displaying in the layout rendering at the center of the screen. The expected behavior here is that the FAB on click would animate and expand UP and the CardView would display in the center of the screen. This is not what we're seeing.
With the CardView layout_width="250dp" the FAB expands to the LEFT. Changing that layout_width="300dp" and the FAB expands to the RIGHT. And when I have the layout_width="match_parent" it goes far off to the right and off screen like mentioned earlier. Seems to me something is going wrong with the material sheet animation calculations, because changing the width of the card here should not affect it appearing in the center of the screen. In every case here we would expect the animation should go UP (neither left nor right) and display the card in the center.
Can you open a new issue and include your layout with a screenshot?
It's expected that the FAB will only animate to the left or to the right. Animating only up or down hasn't been implemented.
Also, I'm not sure if this library is the best way to transition from a FAB to a new screen. It makes more sense to show a CircularReveal animation on FAB click, wait for the animation to end, and then open the activity, fragment, etc.
Hi, same problem ....any solution?