Why doesn't `android:foreground` attribute work?

Question

Take a look at this small android app:

MainActivity.java:

package io.github.gsaga.toucheventtest;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
}

activity_main:

<ImageView android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:foreground="@drawable/ic_launcher_background"
    xmlns:android="http://schemas.android.com/apk/res/android" />

The image pointed to by android:foreground isn't displayed, but it appears if I change foreground to src or background in activity_main.xml. This code seems to follow the instructions described here:

https://developer.android.com/reference/android/view/View.html#attr_android:foreground

Why doesn't the android:foreground tag work in above code?

NOTE:

minSdkVersion is 19, I'm running this app on Android 5.1 (API level 22)

@HarishJose `minSdkVersion` is 19, I'm running this app on android 5.1 — saga, Sep 14 '18 at 09:53
@saga Hi, can you please specify the actual intention of the post? Are you are trying to set an overlay to an ImageView or to figure out why `android:foreground` attribute isn't working for `ImageViews` out of curiosity ? — Bertram Gilfoyle, Sep 16 '18 at 16:41
Hello, @saga. you should use the `android:foreground` at `FrameLayout`, please. — Eric, Sep 17 '18 at 00:41

Bertram Gilfoyle · Accepted Answer · 2019-12-12T01:03:16.187

Short answer

This is due to a bug which existing in Android since API level 23.

More details on the behavior

Here is the list of all the XML attributes and corresponding methods related to setting foreground drawables to views with the API level they are introduced through FrameLayout. However, these are later moved into View in API level 23.

╔════════════════════════════╦═════════════════════════════════════════════════╦═════════════╗
║       XML attribute        ║                     Method                      ║   Added in  ║
║                            ║                                                 ║ (API level) ║
╠════════════════════════════╬═════════════════════════════════════════════════╬═════════════╣
║ android:foreground         ║ setForeground(Drawable)                         ║ 1           ║
╠════════════════════════════╬═════════════════════════════════════════════════╬═════════════╣
║ android:foregroundGravity  ║ setForegroundGravity(int gravity)               ║ 1           ║
╠════════════════════════════╬═════════════════════════════════════════════════╬═════════════╣
║ android:foregroundTint     ║ setForegroundTintMode(PorterDuff.Mode tintMode) ║ 21          ║
╠════════════════════════════╬═════════════════════════════════════════════════╬═════════════╣
║ android:foregroundTintMode ║ setForegroundTintMode(PorterDuff.Mode tintMode) ║ 21          ║
╚════════════════════════════╩═════════════════════════════════════════════════╩═════════════╝

Android doc says setForeground(Drawable) is added in API 1 and setForegroundTintList (ColorStateList tint) and setForegroundTintMode (PorterDuff.Mode tintMode) are added in API level 21 to View. Actually they were there in FrameLayout until it moved in API 23.
In API level < 23, you will get a warning even though it is not required. You can just suppress it. See this.

Now take a look at how these properties work on different versions.

╔═══════════╦══════════════════╦══════════════════╗
║ API level ║      By code     ║     Using XML    ║
╠═══════════╬══════════════════╬══════════════════╣
║ <23       ║ FrameLayout only ║ FrameLayout only ║
╠═══════════╬══════════════════╬══════════════════╣
║ >=23      ║ FrameLayout only ║ All views        ║
╚═══════════╩══════════════════╩══════════════════╝

The cause of the bug

When these properties moved to View in API level 23, they did some strange modifications on it which can be called a bug. While loading properties from XML, it checks whether the View is a FrameLayout which is not present inside the methods we can use for the same purpose.

View constructor, API level 23:

case R.styleable.View_foreground:
    if (targetSdkVersion >= Build.VERSION_CODES.M || this instanceof FrameLayout) {
        setForeground(a.getDrawable(attr));
    }
    break;

Vikasdeep Singh · Answer 2 · 2018-09-19T02:13:41.310

12

To use android:foreground on Android 5.1 i.e. API level 22, you are not using android:foreground correctly.

As it's name clearly indicating that you can set drawable on the top/foreground of any content like overlay i.e you can put some view in FrameLayout in that you can use android:foreground. Inside this FrameLayout add your ImageView.

Documentation:

Defines the drawable to draw over the content. This can be used as an overlay. The foreground drawable participates in the padding of the content if the gravity is set to fill.

Below is usage example:

<FrameLayout
    android:id="@+id/share"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:foreground="@drawable/ic_launcher_background>

    // your ImageView here
    <ImageView
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

</FrameLayout>

Note: For API level > 23 it will work without FrameLayout.

I hope this will help you.

edited Sep 19 '18 at 02:13

answered Sep 16 '18 at 12:55

Vikasdeep Singh

20,983
15
78
104

1

The documentation states the `android:foreground` `defines the drawable to draw over the content`, it doesn't state anywhere that the content has to be a `ViewGroup`. And the tag is defined for the `View` class. If what you're saying is correct then the tag should've been defined for the `ViewGroup` class. – saga Sep 16 '18 at 13:27
1

@saga I agree that documentation is not clear enough but my solution is for `Android 5.1` i.e. `API level 22` (where you are facing the issue). Yes you are right that documentation is not clear enough for usage of `android:foreground` property. For `API level > 23` it will work without `FrameLayout`. – Vikasdeep Singh Sep 17 '18 at 05:36

Cheticamp · Answer 3 · 2018-09-17T12:54:01.570

It looks like at one time (API <23) that android:foreground would work with only FrameLayout as VicJordan suggests. However, for API 23+ it appears that android:foreground will work for any view type. See this selection from the View.java source:

case R.styleable.View_foreground:
    if (targetSdkVersion >= Build.VERSION_CODES.M || this instanceof FrameLayout) {
        setForeground(a.getDrawable(attr));
}

Here is an example of android:foreground working on API 28 with the following layout:

<androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:foreground="@drawable/ic_launcher_foreground"
        android:src="@android:drawable/ic_delete"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

Yet, on API 22, we see this:

No foreground image. So, android:foreground works only when the API level is 23+. I agree that this is not really documented, but that is just the way it is.

Update: API 23 seems to have an issue with android:foreground, so let's say android:foreground works on API 24+ for general views.

Second update: Came across a couple of other posts addressing this same issue regarding setForeground() here and here. In the accepted answer to the second question, CommonsWare identifies this as a "documentation bug."

Mickäel A. · Answer 4 · 2020-04-14T07:13:01.153

Another solution is to wrap your image with a <ripple>, set it as your ImageView's background, and use tint and tintMode to "hide" the src image so the background image that has the ripple over it is visible.

<!-- In your layout file -->

<ImageView
    android:adjustViewBounds="true"
    android:background="@drawable/image_with_ripple"
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:src="@drawable/image"
    android:tint="@android:color/transparent"
    android:tintMode="src_in" />

<!-- drawable/image_with_ripple.xml -->

<?xml version="1.0" encoding="utf-8"?>
<ripple
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="?colorControlHighlight">

    <item android:drawable="@drawable/image" />

</ripple>

Not only this works on API 21+ but if your image has rounded corners – or is another type of non-rectangle shape, like a star or a heart icon – the ripple will remain in its bounds instead of filling the view's rectangle bounds, which gives a better look in some cases.

See this Medium article for an animated GIF to see how this technique compares to using a <FrameLayout> or the foreground attribute.

score 0 · Answer 5 · answered Jan 08 '23 at 17:29

Use a constraint layout and items are drawn top to bottom of the layout.xml hence the elements at the end of the file are drawn last and appear on top I kept the gravity properties in the file in case it starts working in a future version.

    <TextView
        android:id="@+id/textView2"
        android:layout_width="184dp"
        android:layout_height="65dp"
        android:foregroundGravity="bottom"
        android:gravity="center"
        android:text = "Sample Color"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        android:background="@color/cardview_light_background" />

    <androidx.appcompat.widget.AppCompatEditText
        android:background="@android:color/transparent"
        android:foregroundGravity="top"
        android:gravity="top"
        android:id="@+id/textView"
        style="@style/word_title"
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:enabled="false"
        android:fontFamily="sans-serif-black"
        android:text="Hello Word what do you think is happening here"
        android:textSize="24sp"
        android:textColor="@drawable/edit_text_selector"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

Why doesn't `android:foreground` attribute work?

5 Answers5

Short answer

More details on the behavior

The cause of the bug

Linked

Related