Search code examples
androidandroid-layoutandroid-imageviewandroid-percentrelativelayout

ImageView expanding container despite adjustViewBounds


I want to wrap an ImageView inside a LinearLayout so that I can center a group of views. However, the original image needs to be scaled down to fit in the ImageView, and the original size expands the LinearLayout, despite my use of adjustViewBounds="true" and an enclosing FrameLayout as suggested by previous questions on SO.

The desired layout should look like this,

but the observed layout looks like this,

as produced by the XML below:

<android.support.percent.PercentRelativeLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context="project.MainActivity">

        <LinearLayout
            android:layout_width="wrap_content"
            app:layout_heightPercent="32%"
            android:orientation="horizontal"
            android:background="#b44343"
            android:layout_centerHorizontal="true"
            android:layout_alignParentTop="true">
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Sample Text"/>
            <FrameLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="#5555ae">
                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:background="#2c8c4c"
                    android:src="@drawable/spades_icon"
                    android:adjustViewBounds="true"
                    android:scaleType="centerInside"/>
            </FrameLayout>
        </LinearLayout>
    </android.support.percent.PercentRelativeLayout>

I can't use the other suggestion of setting android:maxHeight="100dp" because I need the height to be relative to that of the screen.


Solution

  • Based on this answer to another question, a solution that removes the whitespace in the LinearLayout while preserving the height and aspect ratio of the image is:

    @Override
    public void onWindowFocusChanged(boolean hasFocus) {
        LinearLayout layout = (LinearLayout) findViewById(R.id.mLinearLayout);
        ImageView imageView = (ImageView) findViewById(R.id.mImageView);
        TextView textView = (TextView) findViewById(R.id.mTextView);
    
        layout.getLayoutParams().width = textView.getWidth()+imageView.getWidth();
        layout.requestLayout();
    }
    

    EDIT:
    Based on @Juan's answer and these instructions, the following code also achieves the desired result:

    @Override
    protected void onResume() {
        DisplayMetrics displayMetrics = new DisplayMetrics();
        this.getWindowManager()
            .getDefaultDisplay()
            .getMetrics(displayMetrics);
    
        ViewGroup.LayoutParams params = imgView.getLayoutParams();
        params.height = (int)Math.floor(displayMetrics.heightPixels * 0.32);
    }