How to fix the Snackbar height and position?

Question

On Android Support Library 24.1.1, the Snackbar was working fine:

Then starting on Android Support Library 24.2.0 onwards, the Snackbar started to behave like this:

On the library revision history, there is the following statement:

Behavior changes: Snackbar now draws behind the navigation bar if the status bar is translucent.

But the thing is that my app is full screen and it doesn't have the navigation bar or the status bar. How can I fix it?

you can use custom layout! http://stackoverflow.com/questions/32453946/how-to-customize-snackbars-layout/33441214#33441214 — xbadal, Dec 23 '16 at 12:00
Could you please put some code? By code I mean the layout from this activity, all your snackbar code and your Gradle config. — LeonardoSibela, Jan 06 '17 at 13:45

score 9 · Answer 1 · edited May 23 '17 at 12:26

I recently solved this by subtracting the navigation bar height from the bottom margin of the Snackbar view.

First we need the navigation bar height. I found code for that in the answer marked as correct here: How to REALLY get the navigation bar height in Android

Next, use the following code to adjust the Snackbar bottom margin:

final Snackbar snackbar = Snackbar.make(findViewById(R.id.fullscreen_content),
                message, Snackbar.LENGTH_LONG);

View snackbarView = snackbar.getView();

// Adjust Snackbar height for fullscreen immersive mode
int navbarHeight = getNavigationBarSize(this).y;

CoordinatorLayout.LayoutParams parentParams = (CoordinatorLayout.LayoutParams) snackbarView.getLayoutParams();
    parentParams.setMargins(0, 0, 0, 0 - navbarHeight);
    snackbarView.setLayoutParams(parentParams);

snackbar.show();

Note that I used the LayoutParams of a CoordinatorLayout. You should replace CoordinatorLayout with whichever parent layout type you have passed in to your Snackbar.make() function (in my case, R.id.fullscreen_content is a CoordinatorLayout). The nice thing about using CoordinatorLayout is that it allows Snackbars to be dismissed by swiping as a standard behavior.

`You should replace CoordinatorLayout with whichever parent layout type you have passed in to your Snackbar.make() function` You can also just use the common parent MarginLayoutParams when you just want to edit margins — avalancha, Dec 09 '20 at 11:58

Philio · Answer 2 · 2019-07-05T15:00:17.627

The accepted answer worked with older versions of the support libraries where the Snackbar was just a rectangular view. What is actually happening by changing the margin to a negative value is just cutting off the bottom of the SnackbarLayout (the container layout of the Snackbar) so newer versions where the Snackbar has rounded corners look bad with this solution.

The clue is in the code here: https://github.com/material-components/material-components-android/blob/cd59e98f7e2185ddb075ff0fc91f29765d562968/lib/java/com/google/android/material/snackbar/BaseTransientBottomBar.java#L272

What is actually happening is that padding is being added to the container, so the way to correctly fix the height is to reset the padding to the correct amount. You can do this by adding an additional OnApplyWindowInsetsListener such as the following (setting the bottom padding to the same as the top makes the Snackbar look normal):

ViewCompat.setOnApplyWindowInsetsListener(snackbar.view) { v, insets ->
    v.setPadding(v.paddingLeft, v.paddingTop, v.paddingRight, v.paddingTop)
    insets
}

Then, as the Snackbar will now be the correct height but appear behind a translucent nav bar, you can increase the bottom margin by the value of the bottom inset:

ViewCompat.setOnApplyWindowInsetsListener(view) { v, insets ->
    v.setPadding(v.paddingLeft, v.paddingTop, v.paddingRight, v.paddingTop)

    val params = v.layoutParams as ViewGroup.MarginLayoutParams
    params.updateMargins(
        params.leftMargin,
        params.topMargin,
        params.rightMargin,
        params.bottomMargin + insets.systemWindowInsetBottom
    )
    v.layoutParams = params

    insets
}

This has actually been fixed in the Material 1.1.0 alpha libraries (the library now changes the margin rather than the padding), but they are probably not ready for production use yet.

score 5 · Accepted Answer · edited Mar 26 '18 at 10:38

Look this answer https://stackoverflow.com/a/42180120/2550743 and just replace

 params.setMargins(params.leftMargin,
            params.topMargin,
            params.rightMargin,
            params.bottomMargin + ScreenUtils.getNavigationBarHeight(activity));

to

 params.setMargins(params.leftMargin,
            params.topMargin,
            params.rightMargin,
            params.bottomMargin - ScreenUtils.getNavigationBarHeight(activity));

score 3 · Answer 4 · answered Aug 01 '19 at 09:43

3

Another way would be

Snackbar snackbar = Snackbar.make(view, ...);
View snackBarView = snackbar.getView();

ViewCompat.setFitsSystemWindows(snackBarView, false);
ViewCompat.setOnApplyWindowInsetsListener(snackBarView, null);

This will disable extra bottom padding in immersive mode.

answered Aug 01 '19 at 09:43

vokilam

9,563
3
42
55

it didn't work to me. Besides that, `ViewCompat.setFitsSystemWindows` is depricated. – Aliton Oliveira May 30 '20 at 02:55
Thank you, it works! I've changed code a little View snackbarView = snackbar.getView(); snackbarView.setFitsSystemWindows(false); snackbarView.setOnApplyWindowInsetsListener(null); – Sinan Ceylan Jul 09 '20 at 02:03

score 3 · Answer 5 · answered Feb 17 '20 at 08:20

It's 2020 and also I don't know if it's related but I got my snackbar having some padding at the bottom when using android 10 gesture navigation. None of the above works for my case. I finally got it fixed with a super simple line:

val snackbar = Snackbar.make(view, message, duration)
snackbar.isGestureInsetBottomIgnored = true // here
snackbar.show()

Hope it helps.

score 0 · Answer 6 · answered Dec 23 '16 at 12:07

0

Use this in your snackbar,

FrameLayout.LayoutParams params =(FrameLayout.LayoutParams)view.getLayoutParams();
    params.gravity = Gravity.BOTTOM;

answered Dec 23 '16 at 12:07

Ranjan

1,214
14
34

Have you use view.requestLayout(); after this line ? – Ranjan Mar 21 '18 at 05:29

score 0 · Answer 7 · answered Jul 29 '19 at 20:21

If all you care about is the height, not the position, then prepare to have your mind blown! :D

Set your snackbar content to:

Column(
        mainAxisSize: MainAxisSize.min,
        children: <Widget>[
          Text(
            'Your SnackBar message',
          ),
          SizedBox(
            height: 70, // Your desired height
          )
        ],
      ))

How to fix the Snackbar height and position?

7 Answers7

Linked