Adding EditText alongside RadioButton

问题:

I have a custom DialogPreference subclass in which I would like to have a RadioGroup with three radio buttons. The first two are vanilla RadioButton components with titles, but for the third I would like to place an EditText directly to the right of it so I can enter a custom value when that button is selected.

I have tried putting the third button into a horizontal LinearLayout along with the EditText but then the third button does not participate in the parent RadioGroup anymore.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:layout_width="match_parent"
              android:layout_height="match_parent">
    <RadioGroup
            android:id="@+id/lactate_radio"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" >

        <RadioButton
                android:id="@+id/lactate_default_value"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/lactate_default_value"/>

        <RadioButton
                android:id="@+id/lactate_calibrated_value"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/lactate_calibrated_value" />
        <LinearLayout android:orientation="horizontal"
                      android:layout_width="match_parent"
                      android:layout_height="wrap_content">
            <RadioButton
                    android:id="@+id/lactate_custom_value"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="@string/lactate_custom_value"/>

            <EditText
                    android:id="@+id/lactate_custom_value_edit_text"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"/>

        </LinearLayout>
    </RadioGroup>
</LinearLayout>

I have also tried adding this LinearLayout programmatically but still had the same behavior. Is there any way to do this, perhaps by explicitly telling the parent RadioGroup about the third button or by somehow positioning the EditText appropriately without using a horizontal LinearLayout? Otherwise, I think I'll have to write a RadioButton subclass which ought to be a real party!

回答1:

You should be able to change your parent layout to RelativeLayout. Then give your RadioGroup

android:orientation="vertical"

then place your EditText next to and aligned with the bottom of the RadioGroup. I haven't tried it but something like this should work.

Update

I got time to test it. This seems to give the output you are looking for

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
          android:orientation="vertical"
          android:layout_width="match_parent"
          android:layout_height="match_parent">
<RadioGroup
        android:id="@+id/lactate_radio"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

    <RadioButton
            android:id="@+id/lactate_default_value"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="lactate_default_value"/>

    <RadioButton
            android:id="@+id/lactate_calibrated_value"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="lactate_calibrated_value" />
        <RadioButton
                android:id="@+id/lactate_custom_value"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="lactate_custom_value"/>
    </RadioGroup>

        <EditText
            android:id="@+id/lactate_custom_value_edit_text"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@+id/lactate_radio"
            android:layout_toRightOf="@+id/lactate_radio"
            android:text="Test Text" />
</RelativeLayout>

Note that I also changed some of the widths to wrap_content so it would fit together. Changing the orientation of the RadioGroup to vertical eliminates the need for the LinearLayout

回答2:

<LinearLayout
  android:layout_height= "wrap_content"
  android:layout_width= "wrap_content"
  android:orientation= "horizontal"
>

 <LinearLayout
   android:layout_height= "wrap_content"
   android:layout_width= "wrap_content"
   android:orientation= "vertical"
 >

<RadioGroup
  <!-- radio buttons code here -->
/>

 </LinearLayout>

 <LinearLayout
   android:layout_height= "wrap_content"
   android:layout_width= "wrap_content"
 >

 <EditText

 <!-- edit text code here -->
     android:layout_alignBottom="@+id/id_ofRadioButton"
     android:layout_toRightOf="@+id/id_ofRadioButton"
 />

 </LinearLayout>

If you want edit text along side each radio button:

<LinearLayout
  android:layout_height= "wrap_content"
  android:layout_width= "wrap_content"
  android:orientation= "vertical"
>

 <LinearLayout
   android:layout_height= "wrap_content"
   android:layout_width= "wrap_content"
   android:orientation= "horizontal"
 >

<RadioGroup
  <!-- single radio button code here -->
/>

 <EditText

 <!-- edit text code here -->

 />

 </LinearLayout>


<LinearLayout
  android:layout_height= "wrap_content"
  android:layout_width= "wrap_content"
  android:orientation= "vertical"
>

 <LinearLayout
   android:layout_height= "wrap_content"
   android:layout_width= "wrap_content"
   android:orientation= "horizontal"
 >

<RadioGroup
  <!-- single radio button code here -->
/>

 <EditText

 <!-- edit text code here -->

 />

 </LinearLayout>