Using ImageView as background for an Android Layout

Question

I want to take advantage of the scaleType property, which I cannot use if I set my image using the background property on the LinearLayout. I\'ve tried using a

Answer 1

I cannot use above because of I have adapter and images are set from their to display in GridView. So, in 2019 Im doing like below:

<RelativeLayout
    android:id="@+id/relativeLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:layout_gravity="center">

    <your_package_name.directory.SquareImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="centerCrop"
        android:layout_centerInParent="true"
        android:id="@+id/gridImageView"/>

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerInParent="true"
        android:paddingStart="6dp"
        android:paddingEnd="6dp"
        android:paddingTop="3dp"
        android:paddingBottom="3dp"
        android:textColor="@android:color/white"
        android:background="@drawable/shape_image_holder_text"
        android:alpha=".85"
        android:scaleType="centerCrop"
        android:textSize="24sp"/>
</RelativeLayout>

The key attribute for Stacking view here is android:layout_centerInParent="true".

Also note that I created android:background="@drawable/shape_image_holder_text" to get some corner radius around my text view with some backdrop. Here is that xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape>
            <solid android:color="#22000000" />
            <stroke
                android:color="#33000000"
                android:alpha="0.6"
                android:width="1dp" />
            <corners android:radius="12dp" />
        </shape>
    </item>
</selector>

To make my image adjust to height and width to same size in GridView. I created a custom class for SquareImageView(You can use default ImageView if you are not using GridView or if you don't care about this).

My SquareImageView.java file:

import android.content.Context;
import android.support.v7.widget.AppCompatImageView;
import android.util.AttributeSet;

public class SquareImageView extends AppCompatImageView {

    public SquareImageView(Context context) {
        super(context);
    }

    public SquareImageView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        //noinspection SuspiciousNameCombination
        super.onMeasure(widthMeasureSpec, widthMeasureSpec);
    }

    public SquareImageView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }
}

It look like this:

Answer 2

I did it thusly using a RelativeLayout as the parent:

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:background="#000000" >

    <ImageView
        style="@style/BackGroundImageView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="42dp"
        tools:ignore="ContentDescription" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center_horizontal"
        android:orientation="vertical" >

        <!--Rest of widgets......-->

    </LinearLayout>

</RelativeLayout>

My Style for it:

<style name="BackGroundImageView">
    <item name="android:alpha">0.5</item>
    <item name="android:scaleType">fitXY</item>
    <item name="android:src">@drawable/img_background</item>
</style>

I used a style, because the alpha setting doesn't work on lower APIs (can't remember what the limit is offhand).