How to change background color of the snackbar?

Question

I am showing snackbar in DialogFragment Within the Positive click of alertDialog. Here is my code snippet.

Snackbar snackbar = Snackbar.make(view, \"Please e         


        

Answer 1

With the Snackbar included in the Material Components Library (com.google.android.material.snackbar.Snackbar) just use the setBackgroundTint method.

    Snackbar snackbar = Snackbar.make(view, "Snackbar custom style", Snackbar.LENGTH_LONG);
    snackbar.setBackgroundTint(ContextCompat.getColor(this,R.color.secondaryColor));
    snackbar.show();

Answer 2

Kotlin version (with an extension) :

Create in a file (for exemple SnackbarExtension.kt) an extension :

fun Snackbar.withColor(@ColorInt colorInt: Int): Snackbar{
   this.view.setBackgroundColor(colorInt)
   return this
}

Next, in your Activity/Fragment, you'll be able to do this :

Snackbar
  .make(coordinatorLayout, message, Snackbar.LENGTH_LONG)
  .withColor(YOUR_COLOR)
  .show()

Answer 3

If you want to define a background color for all your Snackbars, just override the design_snackbar_background_color value somewhere in your resources. For example:

<color name="design_snackbar_background_color" tools:override="true">@color/colorPrimaryLight</color>

Answer 4

I don't know why setBackgroundColor() didn't find in my project. That's why I created an extension function and it's fine now.

fun View.showSnackBar(message: String) {
    val snackBar = Snackbar.make(this, message, Snackbar.LENGTH_LONG)
    snackBar.setBackgroundTint(ContextCompat.getColor(this.context, R.color.colorAccent))
    snackBar.show()
}

and call it like bellow

activity_login.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:id="@+id/login_holder_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

   // your UI

</FrameLayout>

LoginActivity.kt

login_holder_layout.showSnackBar("Invalid Email") 

Answer 5

As none of the other answers provided a custom style override (that I consider one of the safest update way to do that) I post here my solution.

I post a solution that already address the new AndroidX (support design 28) theme.

Provided that your application use a custom them called MyAppTheme in your AndroidManifest.xml:

<application
        android:name=".MyApplicationName"
        android:allowBackup="true"
        android:icon="@mipmap/icon"
        android:roundIcon="@mipmap/icon_round"
        android:label="@string/app_name"
        android:theme="@style/MyAppTheme">

Create (if you haven't already) values/style.xml file overriding the theme used by your application:

<style name="MyAppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
    <item name="colorPrimary">@color/myColorPrimary</item>
    <item name="colorPrimaryDark">@color/myColorPrimaryDark</item>
    <item name="colorAccent">@color/myColorAccent</item>
    <item name="snackbarStyle">@style/MySnackBarStyle</item>
</style>

<!-- snackbar style in res/values -->
<style name="MySnackBarStyle" parent="Widget.MaterialComponents.Snackbar">
    <item name="android:background">@color/mySnackbarBackgroundColor</item>
</style>

and provide your colors in your values/colors.xml file

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="myColorPrimary">#008577</color>
    <color name="myColorPrimaryDark">#00574B</color>
    <color name="myColorAccent">#D81B60</color>
    <color name="mySnackbarBackgroundColor">#D81B60</color>
</resources>

UPDATE 2020

As the above solution removes the round corner of the snacker bacause setting the background this way uses the legacy snackbar design, if you want to preserve the material design you can.

1. If you are targeting API 21+

replace android:background with android:backgroundTint

<!-- snackbar style in res/values-21/ -->
<style name="MySnackBarStyle" parent="Widget.MaterialComponents.Snackbar">
    <item name="android:backgroundTint">@color/mySnackbarBackgroundColor</item>
</style>

2. If you are targeting API < 21 then if you decide to use legacy snackbar for API < 21 you could set your abouve MySnackbarStyle in res/values-21/ folder and leave the previous — legacy — style in your res/values folder.

3. If you are targeting API < 21 and you want to have the material style of the snackbar also in this lower API levels you can change your snackbar style in your res/values/ this way:

<!-- snackbar style in res/values/ -->
<style name="MySnackBarStyle" parent="Widget.MaterialComponents.Snackbar">
    <item name="android:background">@drawable/my_snackbar_background</item>
</style>

and borrow your my_snackbar_background from the official repo, this way:

<!-- in res/drawable/ -->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners android:radius="4dp"/>
    <solid android:color="@color/mySnackbarBackgroundColor"/>
</shape>

Here is a playground repo.

Answer 6

Put it in an Utility class:

public class Utility {
    public static void showSnackBar(Context context, View view, String text) {
        Snackbar sb = Snackbar.make(view, text, Snackbar.LENGTH_SHORT);
        sb.getView().setBackgroundColor(ContextCompat.getColor(context, R.color.colorAccent));
        sb.show();
    }
}

Using like this:

Utility.showSnackBar(getApplicationContext(), findViewById(android.R.id.content), "Add success!!!");