Differencebetween Background, Backgroundtint, Backgroundtintmode Attributes in Android Layout Xml

What is the difference between background, backgroundTint, backgroundTintMode attributes in android layout xml?

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:

Tint Check

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>

Programmatically change backgroundTint of ImageView with Vector Asset for background

Instead of using ImageView you can use AppCompatImageView, Because setBackgroundTintList is supported from API level 21, If you use AppCompatImageView you can change the tint color using setSupportBackgroundTintList.

so change you ImageView like this,

<android.support.v7.widget.AppCompatImageView
android:id="@+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:backgroundTint="@color/colorRed"
android:background="@drawable/ic_delete"/>

So that you can call setSupportBackgroundTintList to set the tint color like this,

imageView.setSupportBackgroundTintList(ContextCompat.getColorStateList(this, R.color.colorBlue));

If you have an Android XML layout and you need to change only 3 things (2 textViews and 1 icon) what do you think is the best solution?

You are in the right direction. Using 2 different layouts for different results will be absolutely redundant. You can set TextView values by :

textView.setText("Your Text")
and Image resource programatically by:

imageView.setImageResource(R.drawable.yourImage); according to your result.

Can provided Android SDK icons be set with color?

You can indeed use a tint as a way of changing an ImageView's colour, BUT you should be reminded that the android:tint will always be applied on top of the original colour.

as stated by blogger danlew

  • ImageView's tint mixes the tint color with the original asset. What you want is for the tint color to take over entirely; instead it
    applies the tint on top of the existing color. So, for example, if the
    source asset is black, and you want it to be #77FFFFFF (a translucent
    shade of white), you'll actually end up getting that shade of white
    with a black background beneath it.

  • android:tint is limited to ImageView. You want to be able to tint any Drawable in any View.

One possible alternative would be for you to use android ColorFilter

According to the official documentation:

A color filter can be used with a Paint to modify the color of each pixel drawn with that paint. This is an abstract class that should never be used directly.

There are lots of more or less complex things you can do with ColorFilter but how can you apply this then?

One simple example from another so question is:

//White tint
imageView.setColorFilter(Color.argb(255, 255, 255, 255));

or

imageView.setColorFilter(ContextCompat.getColor(context,R.color.COLOR_YOUR_COLOR))

Or a more complete answer here in SO from here

ImageView redCircle = (ImageView) findViewById(R.id.circle_red_imageview);
ImageView greenCircle = (ImageView) findViewById(R.id.circle_green_imageview);
ImageView blueCircle = (ImageView) findViewById(R.id.circle_blue_imageview);

// we can create the color values in different ways:
redCircle.getDrawable().setColorFilter(Color.RED, PorterDuff.Mode.MULTIPLY );
greenCircle.getDrawable().setColorFilter(0xff00ff00, PorterDuff.Mode.MULTIPLY );
blueCircle.getDrawable().setColorFilter(getResources().getColor(R.color.blue), PorterDuff.Mode.MULTIPLY );

You should check these links if you want to learn more

SO - What is the difference between background, backgroundTint, backgroundTintMode attributes in android layout xml?

setColorFilter()

Fast Android asset theming with ColorFilter

SO-Modifying the color of an android drawable

Some questions about buttons..(elevation, click effect, etc.)

first of all, it's not the best way to ask multiple questions at once! and for your questions, here's a hint :

  • Use a MaterialButton instead of a normal button:

    <com.google.android.material.button.MaterialButton android:layout_width="wrap_content" android:layout_height="wrap_content"/>

  • Visit this link for your second question



Related Topics



Leave a reply



Submit