Custom theme interferes with snackbar background color

Question

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!

Solution 1

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

Solution 2

.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.

Solution 3

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);

Solution 4

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!

Solution 5

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.

View more solutions

Comments

[Toni Alvarez]

getColor() is deprecated.

[SBotirov]

If you using support4 library then you can use ContextCompat.getColor(getContext(), R.color.colorRed);

[Kamajabu]

^This! The only correct answer, every other above just doesn't understand what causes conflict and doesn't explicitly say to change text background! Thank you!