Creating views of the same height in LinearLayout when they are all wrap_content

I have a horizontal LinearLayout with three views inside it. Each has its own layout_width set to 0dp, and different weights. They all have the wrap_content parameter for layout_height.

The problem is that when one of them wraps, the others no longer fill the entire LinearLayout height (they have backgrounds, so it looks ugly).

I want all of them to fill in any remaining vertical space in LinearLayout, and also allow them to wrap content if necessary. Basically, I want all of them to have the height of the tallest brother.

I tried setting layout_gravity to "fill" and "fill_vertical", but it does nothing.

Here is an example layout:

<LinearLayout android:id="@+id/LinearLayout1" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@android:color/background_dark" android:orientation="horizontal" > <Button android:id="@+id/job" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_gravity="fill" android:layout_margin="1dp" android:layout_weight="4" android:background="@drawable/btn_bkgnd_dark_grey" android:drawableLeft="@drawable/icon_plus" android:onClick="jobPressed" android:padding="5dp" android:text="Add to Job fgh dfhfg " android:textAppearance="@style/rowitem_notes" android:textColor="@android:color/white" /> <ImageButton android:id="@+id/bookmark" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_gravity="fill" android:layout_margin="1dp" android:layout_weight="2" android:background="@drawable/btn_bkgnd_dark_grey" android:onClick="bookmarkPressed" android:padding="5dp" android:src="@drawable/icon_bookmark" /> <Button android:id="@+id/itemDetailsButton" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_gravity="fill" android:layout_margin="1dp" android:layout_weight="4" android:background="@drawable/btn_bkgnd_dark_grey" android:drawableRight="@drawable/icon_info" android:onClick="itemDetailsPressed" android:padding="5dp" android:text="Item Details" android:textAppearance="@style/rowitem_notes" android:textColor="@android:color/white" /> </LinearLayout> 
+4
source share
3 answers

I adjusted your layout. Use fill_parent instead of wrapping content for child views. I used ink and default colors for android, replacing them with your drawings and styles.

 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/LinearLayout1" style="@android:style/ButtonBar" android:layout_width="fill_parent" android:gravity="center" android:layout_height="wrap_content" android:orientation="horizontal" > <Button android:id="@+id/job" android:layout_width="0dip" android:layout_height="fill_parent" android:layout_gravity="center" android:layout_margin="2dp" android:layout_weight="4" android:background="#33B5E5" android:drawableLeft="@android:drawable/btn_star" android:onClick="jobPressed" android:padding="5dp" android:text="Add to Job fgh" android:textColor="@android:color/white" android:textSize="10sp" /> <ImageButton android:id="@+id/bookmark" android:layout_width="0dip" android:layout_height="fill_parent" android:layout_gravity="center" android:layout_margin="2dp" android:layout_weight="1" android:background="#33B5E5" android:onClick="bookmarkPressed" android:padding="5dp" android:scaleType="fitCenter" android:src="@android:drawable/ic_input_add" /> <Button android:id="@+id/itemDetailsButton" android:layout_width="0dip" android:layout_height="fill_parent" android:layout_gravity="center" android:layout_margin="2dp" android:layout_weight="4" android:background="#33B5E5" android:drawableRight="@android:drawable/ic_delete" android:onClick="itemDetailsPressed" android:padding="5dp" android:text="Item Details" android:textColor="@android:color/white" android:textSize="10sp" /> </LinearLayout> 
+12
source

You say the following: "Basically, I want them all to be the tallest brother’s height." Given that you don’t know who will be the brother with the highest height, you will have to do it programmatically, basically something like this:

  • First get the height of each of your widgets, for example:

     int height = widget.getHeight(); //with this you know which is the tallest one 
  • Next, create RelativeLayout parameters to set the layout_alignTop attribute to the views that need to scale to the highest view. It is clear that align_Top refers to the identifier of the highest view

     RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT); layout.setLayoutParams(params); params.addRule(RelativeLayout.ALIGN_TOP,R.id.tallest_widget); widget.setLayoutParams(params); 
  • That's all, but keep in mind that in this solution you will have to do this using RelativeLayout instead of LinearLayout.

I think RelativeLayout is the solution for this because of the flexibility it gives you, in which case it allows you to align the top of your views according to the link (i.e.: the highest view).

+1
source

In this case, I think you should do this: First, all buttons have a background, so I think you should have known the height of all views. Perhaps you can make it so, let LinearyLayout maxHeight/minHeight or fixed value, then use layout_height="match_parent" in stock. Unless you need to configure Ui pragmatically in your code.

0
source

Source: https://habr.com/ru/post/1479836/


All Articles