EditText in RelativeLayout issue in Android

Question

I currently have a layout defined as follows:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <EditText
        android:id="@+id/valueEditText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_alignParentRight="true"
        android:layout_gravity="center_vertical"
        android:layout_marginRight="20dp"
        android:text="EditText"
        android:textSize="18sp"
        android:gravity="right"
        />
    <TextView
        android:id="@+id/labelTextView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_marginLeft="20dp"
        android:layout_alignParentLeft="true"
        android:layout_toLeftOf="@id/valueEditText"
        android:text="Label"
        android:textStyle="bold"
        android:textSize="18sp"
        android:gravity="left"
        android:maxLines="1"/>
</RelativeLayout>

The layout is used for rendering of a few ListView items. This layout is rendered correctly at first. The EditText is aligned to the right and expands to the left when typing:

However, when typing in the EditText, the expanding text field will eventually overlap the Label textview:

Is there any way to make the EditText wrap and go multiline so that the Label textview doesn't get overlapped? I know I could use android:maxWidth="XXdp" attribute on the EditText but considering that the contents of the Label textview (and therefore it's size) may change dynamically I don't think that's the best way to do it.

Answer 1

2 changes required..

1- Make the width of the editText static like android:layout_width="150dip"

2- add this line android:singleLine="true" which wont allow the edittext go second line.

so basically...

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<EditText
    android:id="@+id/valueEditText"
    android:layout_width="150dip" //this line
    android:layout_height="wrap_content"
    android:layout_centerVertical="true"
    android:layout_alignParentRight="true"
    android:layout_gravity="center_vertical"
    android:layout_marginRight="20dp"
    android:text="EditText"
    android:textSize="18sp"
    android:singleLine="true" //and this line
    android:gravity="right"
    />
<TextView
    android:id="@+id/labelTextView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerVertical="true"
    android:layout_marginLeft="20dp"
    android:layout_alignParentLeft="true"
    android:layout_toLeftOf="@id/valueEditText"
    android:text="Label"
    android:textStyle="bold"
    android:textSize="18sp"
    android:gravity="left"
    android:maxLines="1"/>
</RelativeLayout>

hope this is what you are looking for

Answer 2

一种解决方案是将EditText和TextView包装在LinearLayout中，这应该可以防止重叠。

Answer 3

You can simply use following edit.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <TextView
        android:id="@+id/labelTextView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_centerVertical="true"
        android:layout_marginLeft="20dp"
        android:gravity="left"
        android:maxLines="1"
        android:text="Label"
        android:textSize="18sp"
        android:textStyle="bold" />

    <EditText
        android:id="@+id/valueEditText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:layout_gravity="center_vertical"
        android:layout_marginRight="20dp"
        android:layout_toRightOf="@id/labelTextView"
        android:gravity="right"
        android:text="EditText "
        android:textSize="18sp" />

</RelativeLayout>