How To Align Imageview To The Bottom, Fill Its Width And Height, And Keep Its Aspect Ratio?

Background There are various XML attributes for ImageView to scale its content , and various layout views that allow to place views and set their sizes. However, I can't figure out

Solution 1:

You need a combination of three attributes:

android:layout_height="wrap_content"android:scaleType="fitCenter"android:adjustViewBounds="true"

The adjustViewBounds attribute is needed because ImageView measures itself to match the original dimensions of the drawable by default, without regard to any scaling performed according to the scale type.

Solution 2:

You can use is custom FitWidthAtBottomImageView to achieve this code:

publicclassFitWidthAtBottomImageViewextendsImageView {
    publicFitWidthAtBottomImageView(Context context) {
        super(context);
    }

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

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

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

    @OverrideprotectedvoidonDraw(Canvas canvas) {
        inti= getWidth() - getPaddingLeft() - getPaddingRight();
        intj= getHeight() - getPaddingTop() - getPaddingBottom();
        if (getBackground() != null) {
            getBackground().draw(canvas);
        }
        if (getDrawable() != null && getDrawable() instanceof BitmapDrawable) {
            Bitmapbitmap= ((BitmapDrawable) getDrawable()).getBitmap();
            inth= bitmap.getHeight() * i / bitmap.getWidth();
            canvas.drawBitmap(bitmap, null, newRectF(getPaddingLeft(), getPaddingTop() + j - h, getPaddingLeft() + i, getHeight() - getPaddingBottom()), null);
        } else {
            super.onDraw(canvas);
        }

    }
}

by manually draw the bottom aligned image that you want.

Solution 3:

this is a proof-om-concept custom ImageView, you will need to add missing constructors and perform the Matrix setting whenever ImageView's Drawable changes:

classVextendsImageView {
    publicV(Context context) {
        super(context);
        setScaleType(ScaleType.MATRIX);
    }
    @OverrideprotectedvoidonSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        Drawabled= getDrawable();
        if (d != null) {
            Matrixmatrix=newMatrix();
            RectFsrc=newRectF(0, 0, d.getIntrinsicWidth(), d.getIntrinsicHeight());
            RectFdst=newRectF(0, 0, w, h);
            matrix.setRectToRect(src, dst, Matrix.ScaleToFit.CENTER);
            float[] points = {
                    0, d.getIntrinsicHeight()
            };
            matrix.mapPoints(points);
            matrix.postTranslate(0, h - points[1]);
            setImageMatrix(matrix);
        }
    }
}

how it works in short:

• first the Matrix is set by calling Matrix.setRectToRect() with stf == Matrix.ScaleToFit.CENTER, the result is the same as ImageView.ScaleType.FIT_CENTER

• then in order to align the Drawable to the bottom Matrix.mapPoints() is called, it maps the Drawable's left/bottom corner and the result is transformed point as would be seen in the ImageView

• and finally Matrix.postTranslate() translates the MAtrix in Y axis to the ImageView's bottom

Solution 4:

Try using android:scaleType="fitCenter"

Edit

Hm, I saw what you mean, another option is to have it fitEnd on the portrait xml and create an identical xml on layout-land folder (create it if needed) with android:scaleType="fitCenter" which will be used on landscape only

Solution 5:

I used android:scaleType="fitXY" but it got me trying it so many times until the image did get fit the XY of the whole screen,,, what I mean there is a wierd bug in scaleType and fitEnd will work fine but you'll need to delete it and write again until it fit the end of any screen without corpping. Bottom line scaleType has bugs and bugs you until it gives you what you need.