ラジオボタンのカスタムレイアウト

Question

RadioButtonのレイアウトを変更しても、RadioGroupに認識させる方法はありますか？

私が必要としているのは、ユーザーがそのボタンを選択したときにそれらのフィールドがアクティブになるように、レイアウトにいくつかのEditTextフィールドが含まれることです。 LinearLayoutに基づいてカスタムパーツを作成し、（LinearLayout）LayoutInflater.from（context）.inflate（R.layout.my_layout、this、true）を使用して独自のレイアウトを設定できることはわかっていますが、その方法がわかりません。ラジオボタンでも同じです。

RadioGroupの外部に追加のフィールドを配置し、ボタンと並べるオプションを試しましたが、単に機能しません。デバイスに依存しすぎているようです。

元のレイアウトは次のようになります。

    <RadioGroup
    Android:id="@+id/time_selector_radio_group"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:layout_toLeftOf="@id/time_selector_hours_Prompt"
    Android:layout_below="@id/time_selector_hours_Prompt"
    Android:layout_alignParentRight="true"
    Android:gravity="right"
    Android:orientation="vertical"
    Android:checkedButton="@+id/time_selector_first_radio"
    >

    <RadioButton
        Android:id="@+id/time_selector_first_radio"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_marginTop="1dip"
        Android:button="@drawable/radio_button_selector"
        />
    <RadioButton
        Android:id="@+id/time_selector_second_radio"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_marginTop="1dip"
        Android:button="@drawable/radio_button_selector"
        />
    <RadioButton
        Android:id="@+id/time_selector_third_radio"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_marginTop="1dip"
        Android:button="@drawable/radio_button_selector"
        />
    <RadioButton
        Android:id="@+id/time_selector_hours_radio"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_marginTop="1dip"
        Android:button="@drawable/radio_button_selector"
        />

</RadioGroup>
<TextView
    Android:id="@+id/time_selector_all_day_Prompt"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:layout_toLeftOf="@id/time_selector_radio_group"
    Android:layout_below="@id/time_selector_hours_Prompt"
    Android:layout_marginTop="11dip"
    Android:text="@string/time_all_day"
    />
<TextView
    Android:id="@+id/time_selector_before_noon_Prompt"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:layout_toLeftOf="@id/time_selector_radio_group"
    Android:layout_below="@id/time_selector_all_day_Prompt"
    Android:layout_marginTop="19dip"
    Android:text="@string/time_before_noon"
    />
<TextView
    Android:id="@+id/time_selector_after_noon_Prompt"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:layout_toLeftOf="@id/time_selector_radio_group"
    Android:layout_below="@id/time_selector_before_noon_Prompt"
    Android:layout_marginTop="19dip"
    Android:text="@string/time_after_noon"
    />
<TextView
    Android:id="@+id/time_selector_starting_time_Prompt"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:layout_alignRight="@id/time_selector_starting_date_Prompt"
    Android:layout_below="@id/time_selector_after_noon_Prompt"
    Android:layout_marginTop="20dip"
    Android:layout_marginLeft="2dip"
    Android:text="@string/advanced_time_selector_dialog_starting_time_Prompt"
    />
<EditText
    Android:id="@+id/time_selector_starting_time"
    Android:layout_width="@dimen/advanced_time_selector_edit_texts_width"
    Android:layout_height="wrap_content"
    Android:layout_alignRight="@id/time_selector_starting_date"
    Android:layout_alignBaseline="@id/time_selector_starting_time_Prompt"
    Android:textSize="14sp"
    Android:paddingRight="10dip"
    Android:paddingLeft="10dip"
    Android:gravity="center"
    Android:singleLine="true"
    Android:maxWidth="@dimen/advanced_time_selector_edit_texts_width"
    Android:background="@drawable/text_field_bg"
    Android:inputType="datetime"
    />
<TextView
    Android:id="@+id/time_selector_ending_time_Prompt"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:layout_alignRight="@id/time_selector_ending_date_Prompt"
    Android:layout_alignBottom="@id/time_selector_starting_time_Prompt"
    Android:layout_alignBaseline="@id/time_selector_starting_time_Prompt"
    Android:layout_marginRight="2dip"
    Android:layout_marginLeft="2dip"
    Android:text="@string/ending_date_Prompt"
    />
<EditText
    Android:id="@+id/time_selector_ending_time"
    Android:layout_width="@dimen/advanced_time_selector_edit_texts_width"
    Android:layout_height="wrap_content"
    Android:layout_alignRight="@id/time_selector_ending_date"
    Android:layout_alignBaseline="@id/time_selector_ending_time_Prompt"
    Android:textSize="14sp"
    Android:paddingRight="10dip"
    Android:paddingLeft="10dip"
    Android:gravity="center"
    Android:singleLine="true"
    Android:maxWidth="@dimen/advanced_time_selector_edit_texts_width"
    Android:background="@drawable/text_field_bg"
    Android:inputType="datetime"
    />

ボタンにはテキストがなく、左側に表示できるようにTextViewに追加されていることに注意してください。何が起こっていたのかというと、テキストが「忍び寄る」ということでした。

だから、私はそれを次のように変更しました：

<RadioGroup
    Android:id="@+id/time_selector_radio_group"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:layout_toLeftOf="@id/time_selector_hours_Prompt"
    Android:layout_below="@id/time_selector_hours_Prompt"
    Android:layout_alignParentRight="true"
    Android:layout_marginRight="30dip"
    Android:gravity="right"
    Android:orientation="vertical"
    Android:checkedButton="@+id/time_selector_first_radio"
    >

    <RadioButton
        Android:id="@+id/time_selector_all_day_radio"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_marginTop="1dip"
        Android:button="@null"
        Android:drawableRight="@drawable/radio_button_selector"
        Android:text="@string/time_all_day"
        Android:textColor="@color/content_text_color"
        />
    <RadioButton
        Android:id="@+id/time_selector_before_noon_radio"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_marginTop="1dip"
        Android:button="@null"
        Android:drawableRight="@drawable/radio_button_selector"
        Android:text="@string/time_before_noon"
        Android:textColor="@color/content_text_color"
        />

    <RadioButton
        Android:id="@+id/time_selector_after_noon_radio"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_marginTop="1dip"
        Android:button="@null"
        Android:drawableRight="@drawable/radio_button_selector"
        Android:text="@string/time_after_noon"
        Android:textColor="@color/content_text_color"
        />

    <RelativeLayout
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:orientation="horizontal">   
        <RadioButton
            Android:id="@+id/time_selector_hours_radio"
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
            Android:layout_marginTop="1dip"
            Android:button="@null"
            Android:drawableRight="@drawable/radio_button_selector"
            Android:layout_alignParentRight="true"
            Android:text="@string/advanced_time_selector_dialog_starting_time_Prompt"
            Android:textColor="@color/content_text_color"
            Android:layout_marginLeft="-1dip"
            Android:paddingLeft="-1dip"
            />  
        <RelativeLayout
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
            Android:orientation="horizontal"
            Android:layout_toLeftOf="@id/time_selector_hours_radio"
            Android:layout_alignParentLeft="true">            
            <EditText
                Android:id="@+id/time_selector_starting_time"
                Android:layout_width="@dimen/advanced_time_selector_edit_texts_width"
                Android:layout_height="wrap_content"
                Android:textSize="14sp"
                Android:paddingRight="10dip"
                Android:paddingLeft="10dip"
                Android:gravity="center"
                Android:singleLine="true"
                Android:maxWidth="@dimen/advanced_time_selector_edit_texts_width"
                Android:background="@drawable/text_field_bg"
                Android:layout_alignParentRight="true"
                Android:layout_alignBaseline="@id/time_selector_hours_radio"
                Android:inputType="datetime"
                />
            <TextView
                Android:id="@+id/time_selector_ending_time_Prompt"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:layout_marginRight="2dip"
                Android:layout_marginLeft="2dip"
                Android:text="@string/ending_date_Prompt"
                Android:layout_alignBaseline="@id/time_selector_hours_radio"
                Android:layout_toLeftOf="@id/time_selector_starting_time"
                />
            <EditText
                Android:id="@+id/time_selector_ending_time"
                Android:layout_width="@dimen/advanced_time_selector_edit_texts_width"
                Android:layout_height="wrap_content"
                Android:textSize="14sp"
                Android:paddingRight="10dip"
                Android:paddingLeft="10dip"
                Android:gravity="center"
                Android:singleLine="true"
                Android:maxWidth="@dimen/advanced_time_selector_edit_texts_width"
                Android:layout_toLeftOf="@id/time_selector_ending_time_Prompt"
                Android:layout_alignBaseline="@id/time_selector_hours_radio"
                Android:background="@drawable/text_field_bg"
                Android:inputType="datetime"
                />
        </RelativeLayout>
    </RelativeLayout>

</RadioGroup>

それはまだ完全ではなく、もちろん、RadioGroupとして認識されません。

RadioButtonを拡張する方向に進みたかったのですが、そこでレイアウトを変更する方法がわかりません。

Answer 1

RadioGroupと呼ばれるカスタムRadioGroupPlusを作成しました。このカスタムでは、子をトラバースし、RadioButtonがネストされている深さに関係なく、RadioButtonを見つけ、すべてをリンクします。一緒に見つかったRadioButton。

ここでリポジトリを見つけることができます： https://github.com/worker8/RadioGroupPlus

リポジトリのREADMEはそれを使用する方法をカバーしており、実際にはあなたが想像するのと同じように機能します。例：

<worker8.com.github.radiogroupplus.RadioGroupPlus
    Android:id="@+id/radio_group_plus"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:orientation="vertical">
    <LinearLayout...>
       <ImageView...>
       <TextView...>
       <RadioButton...>
    </LinearLayout>
    <LinearLayout...>
       <ImageView...>
       <TextView...>
       <RadioButton...>
    </LinearLayout>
    <LinearLayout...>
       <ImageView...>
       <TextView...>
       <RadioButton...>
    </LinearLayout>
</worker8.com.github.radiogroupplus.RadioGroupPlus>

あなたにこのようなものを与えるでしょう：

あなたの場合、すでにxmlレイアウトファイルがあるので、 ここのガイド に従ってRadioGroupPlusをダウンロードしてみてください。

これをトップレベルのbuild.gradleに追加します。

allprojects {
    repositories {
        maven { url "https://jitpack.io" }
    }
}

依存関係の下にこれを追加します：

compile 'com.github.worker8:RadioGroupPlus:v1.0.1'

次に、xmlでRadioGroupをworker8.com.github.radiogroupplus.RadioGroupPlusに変更します。これで、RadioButtonの下にあるすべてのRadioGroupPlusがすべてリンクされているはずです。

それが役に立てば幸い！

Answer 2

ラジオボタンにカスタムレイアウトを使用できるようにするには、RadioGroupを拡張するクラスを作成し、addViewおよびPassThroughHierarchyChangeListenerをオーバーライドする必要があります。 。デフォルトでは、RadioGroupはその子がラジオボタンであると想定しています。RadioGroupクラスの以下のコードを参照してください。

@Override
public void addView(View child, int index, ViewGroup.LayoutParams params) {
    if (child instanceof RadioButton) {
        final RadioButton button = (RadioButton) child;
        if (button.isChecked()) {
            mProtectFromCheckedChange = true;
            if (mCheckedId != -1) {
                setCheckedStateForView(mCheckedId, false);
            }
            mProtectFromCheckedChange = false;
            setCheckedId(button.getId());
        }
    }

    super.addView(child, index, params);
}

private class PassThroughHierarchyChangeListener implements
        ViewGroup.OnHierarchyChangeListener {
    private ViewGroup.OnHierarchyChangeListener mOnHierarchyChangeListener;

    /**
     * {@inheritDoc}
     */
    public void onChildViewAdded(View parent, View child) {
        if (parent == RadioGroup.this && child instanceof RadioButton) {
            int id = child.getId();
            // generates an id if it's missing
            if (id == View.NO_ID) {
                id = View.generateViewId();
                child.setId(id);
            }
            ((RadioButton) child).setOnCheckedChangeWidgetListener(
                    mChildOnCheckedChangeListener);
        }

        if (mOnHierarchyChangeListener != null) {
            mOnHierarchyChangeListener.onChildViewAdded(parent, child);
        }
    }

    /**
     * {@inheritDoc}
     */
    public void onChildViewRemoved(View parent, View child) {
        if (parent == RadioGroup.this && child instanceof RadioButton) {
            ((RadioButton) child).setOnCheckedChangeWidgetListener(null);
        }

        if (mOnHierarchyChangeListener != null) {
            mOnHierarchyChangeListener.onChildViewRemoved(parent, child);
        }
    }
}