Custom theme interferes with snackbar background color

14.1k views Asked by At

Trying out the new Design Support Library, I added a snackbar; but unlike its main background, the text area is not colored with the default value of #323232. Instead, it looks like this. It seems to take its color from the android:background value defined in the custom theme in my styles.xml, which goes like this:

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    ...
    <item name="android:background">#4f4f5e</item>
    ...
</style>

If I try to forcefully color it with

View snackbarView = snackbar.getView(); 
snackbarView.setBackgroundColor(Color.YELLOW);

it only impacts the main background, like this, and the text background still gets colored by the custom theme. Is there a way to both keep my custom theme, and have a standard snackbar? Thanks!

10

There are 10 answers

0
Saurabh Khare On

I also faced similar issue & unfortunately no solution works for me Hence I write my own solution where I set background color for parent view too.

    TextView snackbarTextView = snackbar.getView().findViewById(android.support.design.R.id.snackbar_text);
    snackbarTextView.setBackgroundColor(ContextCompat.getColor(getActivity(), R.color.colorPrimary));

    ViewParent parentView = snackbarTextView.getParent();
    if (parentView instanceof View) {
        ((View) parentView).setBackgroundColor(ContextCompat.getColor(getActivity(), R.color.colorPrimary));
    }

    View snackbarView = snackbar.getView();
    snackbarView.setBackgroundColor(ContextCompat.getColor(getActivity(), R.color.colorPrimary));

    snackbar.show();
0
Antonio On

You can simply create your own Snackbar class and simulate Snackbar's make method. Doing this, you just have to use this class instead of android's snackbar widget.

Snackbar.class

import android.graphics.Color;
import android.support.annotation.IntDef;
import android.support.annotation.IntRange;
import android.support.annotation.NonNull;
import android.support.design.widget.CoordinatorLayout;
import android.support.design.widget.FloatingActionButton;
import android.view.View;

import java.lang.annotation.Retention;
import java.lang.annotation.RetentionPolicy;

public class Snackbar {

    /** Snackbar's lengths **/
    public static final int LENGTH_SHORT = android.support.design.widget.Snackbar.LENGTH_SHORT;
    public static final int LENGTH_LONG = android.support.design.widget.Snackbar.LENGTH_LONG;
    public static final int LENGTH_INDEFINITE = android.support.design.widget.Snackbar.LENGTH_INDEFINITE;

    @NonNull
    public static android.support.design.widget.Snackbar make(@NonNull View view, @NonNull CharSequence text,
                                                              @Duration int duration) {
        android.support.design.widget.Snackbar snackbar = android.support.design.widget.Snackbar.make(view, text, duration);
        // TODO: This is where you have to customize your snackbar
        snackbar.getView().setBackgroundColor(Color.RED);
        return snackbar;
    }

    @NonNull
    public static android.support.design.widget.Snackbar make(@NonNull View view, @StringRes int resId, @Duration int duration) {
        return make(view, view.getResources().getText(resId), duration);
    }

    // Optional
    @IntDef({LENGTH_INDEFINITE, LENGTH_SHORT, LENGTH_LONG})
    @IntRange(from = 1)
    @Retention(RetentionPolicy.SOURCE)
    public @interface Duration {}

}

Use:

// WARNING: Make sure you're using your snackbar's package
import com.mypackage.custom_views.Snackbar;

public class MyActivity extends Activity {
    ...
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        ...
        Snackbar.make(view, R.string.my_msg, Snackbar.LENGTH_LONG).show();
    }
}

Hope this helps!

0
Sandro Machado On

You can use this library: https://github.com/SandroMachado/restaurant

new Restaurant(MainActivity.this, "Snackbar with custom background and text color", Snackbar.LENGTH_LONG)
    .setBackgroundColor(Color.GRAY)
    .show();

Disclaimer: I made the library.

1
Jean-Paul Rizkallah On

The snackbar contains a TextView, so you need to change the background color for both, the snackbar the way you already did, and then the TextView like this:

View snackbarView = snackbar.getView(); 
TextView textView = (TextView)snackbarView.findViewById(android.support.design.R.id.snackbar_text); 
textView.setBackgroundColor(Color.YELLOW);
0
Thiago On

Here is a complete sample:

Snackbar snack = Snackbar.make(view, "Replace with your own action", Snackbar.LENGTH_LONG)
                        .setAction("Action", null);
                ViewGroup group = (ViewGroup) snack.getView();
                group.setBackgroundColor(ContextCompat.getColor(MainActivity.this, R.color.blue));
                snack.show();

replace MainActivity.this with your currently activity or getAppContext()

0
Pacific P. Regmi On

.setBackgroundColor allows you to change background color of snackbar

msnackBar.setBackgroundColor(Color.parseColor("#009688"));

or

 msnackBar.setBackgroundColor(getResources().getColor(R.color.BLUE)););

Here is complete tutorial to use snackbar using design support library.

2
agirardello On

To change the Snackbar's background colour you can do the following from code:

Snackbar snack = Snackbar.make(...);
ViewGroup group = (ViewGroup) snack.getView();
group.setBackgroundColor(ContextCompat.getColor(getContext(), R.color.red));
snack.show();

Instead of red you can use the Snackbar's default colour: #323232

0
jakubbialkowski On

This effect happens when in style attribute android:background is set.

Removing that will of course affect all layouts in your application but snackbar will be fixed.

0
sivaBE35 On

this is how i'm using custom snackbar

  Snackbar snackbar_network = Snackbar.make(rLayout, "Your Message", Snackbar.LENGTH_SHORT)
                        .setAction("EXIT", new View.OnClickListener() {
                            @Override
                            public void onClick(final View v) {


                                  finish();

                            }
                        });

Action Text Color

 snackbar_network.setActionTextColor(Color.RED);

Action Message Text Color

  final View sbView = snackbar_network.getView();
                final TextView tv = (TextView) sbView.findViewById(android.support.design.R.id.snackbar_text);
                tv.setTextColor(Color.YELLOW);

Set Snackbar Background

sbView.setBackgroundColor(ContextCompat.getColor(MapsActivity.this, R.color.black));

        snackbar_network.show();
0
Douglas On

Works this way for me:

LinearLayout linearLayout = (LinearLayout) findViewById(R.id.ll);
        Snackbar snackbar = Snackbar.make(lineatLayout, "TEXT", Snackbar.LENGTH_LONG);
        ViewGroup group = (ViewGroup) snackbar.getView();
        group.setBackgroundColor(ContextCompat.getColor(getApplicationContext(), R.color.yourColor));
        TextView textView = (TextView) group.findViewById(android.support.design.R.id.snackbar_text);
        textView.setTextColor(ContextCompat.getColor(this, R.color.yor collor));

        snackbar.show();