hasMobi - Android Apps hasMobi - Android Apps - 4 months ago 19
Android Question

Horizontal LinearLayout with Multiple Children, Move Children Below on New Line When No More Horizontal Space

I would like to have a horizontal

LinearLayout
that is as wide as the screen and as high as its children, but the trick is that its children will have dynamic width each and I don't want them going off screen (cut out). I want them to flow/break in a new line so that they are all visible.

Although totally irrelevant to Android, it should work similar to how inline
<div>
's work in HTML.


Here's what I have right now:

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="If you would enter some digits in this field " />
<EditText
android:id="@+id/tvDistance"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="enter some digits here"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" that would be great" />
</LinearLayout>


But as soon as the children of the
LinearLayout
get wider than the screen the extra part gets off the screen/invisible.

Answer

I would like to have a horizontal LinearLayout that is as wide as the screen and as high as its children, but the trick is that its children will have dynamic width each and I don't want them going off screen (cut out).

A LinearLayout can't do that(any default layout from the SDK can't do that) because the LinearLayout is set to place all the children in one horizontal or vertical line. Also, any type of conditional layout rules based on dimensions not yet available(like in your case the available width for the LinearLayout) are not possible in the xml anyway.

What you need is a custom layout which measures the children to use the available space moving any non fitting children on a new line below(a FlowLayout). You have an example of such a layout, from one of the engineers working on Android, in this video. There are also other implementations out there to have a look at(implementing such a layout isn't hard anyway).

Comments