ImageView - have height match width?

Question

I have an imageview. I want its width to be fill_parent. I want its height to be whatever the width ends up being. For example:

Answer 1

In Android 26.0.0 PercentRelativeLayout has been deprecated.

The best way to solve it is now with ConstraintLayout like this:

<android.support.constraint.ConstraintLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content">

    <ImageView android:layout_width="match_parent"
               android:layout_height="0dp"
               android:scaleType="centerCrop"
               android:src="@drawable/you_image"                       
               app:layout_constraintDimensionRatio="1:1"/>


</android.support.constraint.ConstraintLayout>

Here is a tutorial on how to add ConstraintLayout to your project.

Answer 2

I don't think there's any way you can do it in XML layout file, and I don't think android:scaleType attribute will work like you want it to be.
The only way would be to do it programmatically. You can set the width to fill_parent and can either take screen width as the height of the View or can use View.getWidth() method.

Answer 3

If your image view is inside a constraint layout, you can use following constraints to create a square image view

<ImageView
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:id="@+id/ivImageView"
    app:layout_constraintDimensionRatio="W,1:1"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintEnd_toEndOf="parent"/>

Answer 4

To set your ImageView equal to half the screen, you need to add the following to your XML for the ImageView:

<ImageView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_centerInParent="true"
    android:scaleType="fitXY"
    android:adjustViewBounds="true"/>

To then set the height equal to this width, you need to do it in code. In the getView method of your GridView adapter, set the ImageView height equal to its measured width:

mImageView.getLayoutParams().height = mImageView.getMeasuredWidth();

Answer 5

The ImageView "scaleType" function may help you here.

This code will keep the aspect ratio and position the image at the top:

android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="fitStart"

Here is a great post showing the possibilities and appearances from using scaleType.

ImageView scaleType samples

Answer 6

This can be done using LayoutParams to dynamically set the Views height once your know the Views width at runtime. You need to use a Runnable thread in order to get the Views width at runtime or else you'll be trying to set the Height before you know the View's width because the layout hasn't been drawn yet.

Example of how I solved my problem:

final FrameLayout mFrame = (FrameLayout) findViewById(R.id.frame_id);

    mFrame.post(new Runnable() {

        @Override
        public void run() {
            RelativeLayout.LayoutParams mParams;
            mParams = (RelativeLayout.LayoutParams) mFrame.getLayoutParams();
            mParams.height = mFrame.getWidth();
            mFrame.setLayoutParams(mParams);
            mFrame.postInvalidate();
        }
    });

The LayoutParams must be of the type of the Parent View that your view is in. My FrameLayout is inside of a RelativeLayout in the xml file.

    mFrame.postInvalidate();

is called to force the view to redraw while on a separate thread than the UI thread