EditText getting out of GridLayout

Question

I am trying to create a view with an EditText and a label associated. I am placing them in a GridLayout. The EditText is in the last column and the text seems to go out of the screen.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="mobi.designmyapp.osmtemplate.note.NoteActivity"
android:orientation="vertical">

<GridLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:columnCount="2"
    android:rowCount="1">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:labelFor="@+id/comment_edit_text"
        android:text="@string/comment_label"
        android:padding="8dp"
        android:textColor="@color/background_material_dark"
        android:maxLines="5"
        />

    <EditText
        android:id="@+id/comment_edit_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:hint="@string/comment_text_hint"/>

</GridLayout>

Demigod

Have you tried changing the children's width/height to match_parent? – Rhapsodic

yes, and it gave the same result. – Demigod

Looking okay on my end. Is the grid layout a child for another view? Eg: RelativeLayout – Rhapsodic

it is in a linearLayout, the edit text seems to go out of the screen about the size of my label. – Demigod

Okay, I've got it now. See my answer. – Rhapsodic

Answer 1

Thanks to @Jack I found the solution: don't put any layout_width to the label, the gridlayout will handle it. Add android:layout_gravity="fill_horizontal" and android:layout_width="0dp" to the editText.

<GridLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:columnCount="2"
    android:rowCount="1">

    <TextView
        android:labelFor="@+id/comment_edit_text"
        android:text="@string/comment_label"
        android:padding="8dp"
        android:textColor="@color/background_material_dark"/>

    <EditText
        android:id="@+id/comment_edit_text"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_gravity="fill_horizontal"
        android:hint="@string/comment_text_hint"/>
</GridLayout>

Demigod

If you have multiple rows, each row will have to be changed to see the expected behavior. – Rone

Answer 2

Okay, this problem seems to tricker than it seems.

To stop the TextView label pushing the EditText off of the screen.

<TextView
    android:layout_width="0dp"
    android:layout_gravity="fill_horizontal" /> 

But you're then left with a problem where adding text to the EditText squishes the TextView untils you can't see it.

Try what was done in this answer which seems to be a good compromise.

Rhapsodic