What is the difference between background, backgroundTint, backgroundTintMode attributes in android layout xml?
While working with the android layout xml I came across backgroundTint
attribute . I don't understand what is for.
Also what is backgroundTintMode
??
I tested various combinations of android:background
, android:backgroundTint
and android:backgroundTintMode
.
android:backgroundTint
applies the color filter to the resource of android:background
when used together with android:backgroundTintMode
.
Here are the results:
Here's the code if you want to experiment further:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical"
android:layout_height="match_parent"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
tools:showIn="@layout/activity_main">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:textSize="45sp"
android:background="#37AEE4"
android:text="Background" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:textSize="45sp"
android:backgroundTint="#FEFBDE"
android:text="Background tint" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:textSize="45sp"
android:background="#37AEE4"
android:backgroundTint="#FEFBDE"
android:text="Both together" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:textSize="45sp"
android:background="#37AEE4"
android:backgroundTint="#FEFBDE"
android:backgroundTintMode="multiply"
android:text="With tint mode" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:textSize="45sp"
android:text="Without any" />
</LinearLayout>
I won't stress much on the difference as it is already covered, but notice the below:
-
android:backgroundTint
android:backgroundTintMode
are only available at API 21 - If you have a widget that has a png/vector drawable background set by
android:background
, and you want to change its default color, then you can useandroid:backgroundTint
to add a shade to it.
example
<Button
android:layout_width="50dp"
android:layout_height="wrap_content"
android:background="@android:drawable/ic_dialog_email" />
<Button
android:layout_width="50dp"
android:layout_height="wrap_content"
android:background="@android:drawable/ic_dialog_email"
android:backgroundTint="@color/colorAccent" />
Another example
If you try to change the accent color of the FloatingActionButton
using android:background
you won't notice a change, that is because it's already utilizes app:srcCompat
, so in order to do that you can use android:backgroundTint
instead
The backgroundTint
attribute will help you to add a tint(shade) to the background. You can provide a color value for the same in the form of - "#rgb", "#argb", "#rrggbb", or "#aarrggbb".
The backgroundTintMode
on the other hand will help you to apply the background tint. It must have constant values like src_over, src_in, src_atop,
etc.
Refer this to get a clear idea of the the constant values that can be used. Search for the backgroundTint
attribute and the description along with various attributes will be available.
BackgroundTint works as color filter.
FEFBDE as tint
37AEE4 as background
Try seeing the difference by comment tint/background and check the output when both are set.