android: Change height to match width

Question

Very short: I have drawn 3 shapes with xml spanning the full width of the device:

<LinearLayout
    android:id="@+id/linearLayout1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:orientation="horizontal" >

    <ImageView
        android:id="@+id/menu_ebook"
        android:layout_width="0dp"
        android:layout_height="100dp"
        android:layout_weight="1"
        android:background="@color/menuBlue"
        android:clickable="true"
        android:contentDescription="@string/menu_ebook"
        android:soundEffectsEnabled="false" />

    <ImageView
        android:id="@+id/menu_library"
        android:layout_width="0dp"
        android:layout_height="100dp"
        android:layout_marginLeft="1dp"
        android:layout_marginRight="1dp"
        android:layout_weight="1"
        android:background="@color/menuBlue"
        android:clickable="true"
        android:contentDescription="@string/menu_ebook"
        android:soundEffectsEnabled="false" />

    <ImageView
        android:id="@+id/menu_faq"
        android:layout_width="0dp"
        android:layout_height="100dp"
        android:layout_weight="1"
        android:background="@color/menuBlue"
        android:clickable="true"
        android:contentDescription="@string/menu_ebook"
        android:soundEffectsEnabled="false" />

</LinearLayout>

These 3 shapes should always be a square on every device possible. Is this possible via xml, if not how to do this programmatically?

To clarify: The height of all 3 ImageViews should become equal to the width of 1 ImageView.

Thx in advance

you are setting the hight of the images to be 100dp, so settings the width as well will set the ImageView to be squared. do you want them to fill entirly the width of the screen/parentView? — Mario Lenci, Feb 24 '14 at 15:07
The images now fill the entire width of the screen. Setting the width in the xml was just to test it on my device tomake sure they take up the full width of the screen. But if I test it on another device (something with a very big screen), the images will become rectangles with a huge width, but only a 100dp height. So the 100dp should become equal to the width of 1 square. — ZackWhite, Feb 24 '14 at 15:10

Leonidos · Answer 1 · 2014-02-24T15:47:17.967

You can't easily do ImageViews square. The only standart way to do this is to set exact width=height=some_value. If at some point you know square side length you can apply this value to imageViews.

If you really want to make some view to be square, you should create custom view and override onMeasure method. You can run standart measure function, and then use setMeasuredDimension to set equal dimentions.

E.g. like this if it is a ViewGroup:

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    // simple implementation, this can be done better )
    super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    int squareSize = getMeasuredWidth(); // square size
    int measureSpec = MeasureSpec.makeMeasureSpec(squareSize, MeasureSpec.EXACTLY);
    super.onMeasure(measureSpec, measureSpec); // we should remeasure childrens to fit square
}

or like this if it's view:

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    int squareSize = getMeasuredWidth();
    setMeasuredDimension(squareSize, squareSize);
}

All Overrides use view's width as square size.

This is the way to go - the inflator recognizes the correct dimensions right away with this solution! forget all other hacks which set the height/width using a runnable after inflating it — ruptha, Aug 26 '16 at 07:08

score -1 · Answer 2 · answered Feb 24 '14 at 14:58

-1

Add android:weightSum="3" in the parent layout linearLayout1.

answered Feb 24 '14 at 14:58

Manitoba

8,522
11
60
122

android: Change height to match width

2 Answers2