Using Imageview As Background For An Android Layout

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 LinearLayout with 2 c

Solution 1:

I did it thusly using a RelativeLayout as the parent:

<RelativeLayoutxmlns: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" ><ImageViewstyle="@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" /><LinearLayoutandroid: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:

<stylename="BackGroundImageView"><itemname="android:alpha">0.5</item><itemname="android:scaleType">fitXY</item><itemname="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).

Solution 2:

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:

<RelativeLayoutandroid:id="@+id/relativeLayout"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"android:layout_gravity="center"><your_package_name.directory.SquareImageViewandroid:layout_width="match_parent"android:layout_height="match_parent"android:scaleType="centerCrop"android:layout_centerInParent="true"android:id="@+id/gridImageView"/><TextViewandroid: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"?><selectorxmlns:android="http://schemas.android.com/apk/res/android"><item><shape><solidandroid:color="#22000000" /><strokeandroid:color="#33000000"android:alpha="0.6"android:width="1dp" /><cornersandroid: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;

publicclassSquareImageViewextendsAppCompatImageView {

    publicSquareImageView(Context context) {
        super(context);
    }

    publicSquareImageView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    @OverrideprotectedvoidonMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        //noinspection SuspiciousNameCombinationsuper.onMeasure(widthMeasureSpec, widthMeasureSpec);
    }

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

It look like this: