Android布局:RadioGroup中的中心RadioButton

时间:2020-07-31 07:41:52

标签: android android-layout layout alignment

我正在尝试将Radiobuttons放在Radiogroup中。我有一个解决方案

<RadioGroup [...]>
    <RelativeLayout [...]>
        <RadioButton [...]/>
    </RelativLaoyout>
    <RelativeLayout [...]>
        <RadioButton [...]/>
    </RelativLaoyout>
    <RelativeLayout [...]>
        <RadioButton [...]/>
    </RelativLaoyout>
</RadioGroup>

但是,如果执行此操作,则可以同时检查RadioButtons,这是我想防止Radiogroup获得单选。 为了自动获得单选逻辑,RadioButton必须是RadioGroup的直接子元素,而不能包装在布局中。

这是我当前的代码:

 <RadioGroup
      android:id="@+id/radioGroup"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:orientation="horizontal"
      android:weightSum="4">

      <androidx.appcompat.widget.AppCompatRadioButton
          android:layout_width="0dp"
         android:layout_height="wrap_content"
         android:layout_weight="1"
         android:layout_gravity="center"
         android:gravity="center" />

     <androidx.appcompat.widget.AppCompatRadioButton
         android:layout_width="0dp"
         android:layout_height="wrap_content"
         android:layout_weight="1"
         android:layout_gravity="center"
         android:gravity="center" />

     <androidx.appcompat.widget.AppCompatRadioButton
         android:layout_width="0dp"
         android:layout_height="wrap_content"
         android:layout_weight="1"
         android:layout_gravity="center"
         android:gravity="center" />

     <androidx.appcompat.widget.AppCompatRadioButton
         android:layout_width="0dp"
         android:layout_height="wrap_content"
         android:layout_weight="1"
         android:layout_gravity="center"
         android:gravity="center" />
</RadioGroup>

结果: link to the image

1 个答案:

答案 0 :(得分:0)

步骤1:启用数据绑定

首先,您必须启用数据绑定。

android {
    ...
    buildFeatures.dataBinding = true
}

您可以通过两种方式熟悉数据绑定:

步骤2:定义枚举并单击侦听器

我建议您使用Java,因此代码将使用Java。如果需要,可以在Android Studio IDE中将其自动转换为Kotlin。

我们需要使用4个值定义一个enum类。顺其自然:

public enum Value {
    FIRST, SECOND, THIRD, FOURTH;
}

点击监听器实际上不是View.OnClickListener类型的。 View.OnClickListener将使用数据绑定来调用它。非常简单,您将在步骤3中看到它。

interface OnValueSelectListener {
    public void onValueSelected(Value value);
}

步骤3:使用数据绑定实现布局

我想在这一步您已经熟悉数据绑定以及如何使用它。在此布局中,我们将定义。

<?xml version="1.0" encoding="utf-8"?>
<layout>

    <!-- Data declaration -->
    <data>

        <import type="com.example.app.Value" />
        <!-- Architecture component whose updates are rendered live as soon as it changed -->
        <!-- Nothing to do special. All is done by the data binding library -->
        <variable
            name="observableSelectedValue"
            type="androidx.databinding.ObservableField" />

        <variable
            name="onValueSelectListener"
            type="com.example.app.OnValueSelectListener" />
    </data>

    <!--  Layout declaration -->
    <RadioGroup xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/radioGroup"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:weightSum="4">

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

            <androidx.appcompat.widget.AppCompatRadioButton
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:layout_weight="1"
                android:checked="@{observableSelectedValue == Value.FIRST}"
                android:gravity="center"
                android:onClick="@{() -> onValueSelectListener.onValueSelected(Value.FIRST)}" />
        </LinearLayout>

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

            <androidx.appcompat.widget.AppCompatRadioButton
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:layout_weight="1"
                android:checked="@{observableSelectedValue == Value.SECOND}"
                android:gravity="center"
                android:onClick="@{() -> onValueSelectListener.onValueSelected(Value.SECOND)}" />
        </LinearLayout>

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

            <androidx.appcompat.widget.AppCompatRadioButton
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:layout_weight="1"
                android:checked="@{observableSelectedValue == Value.THIRD}"
                android:gravity="center"
                android:onClick="@{() -> onValueSelectListener.onValueSelected(Value.THIRD)}" />
        </LinearLayout>

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

            <androidx.appcompat.widget.AppCompatRadioButton
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:layout_weight="1"
                android:checked="@{observableSelectedValue == Value.FOURTH}"
                android:gravity="center"
                android:onClick="@{() -> onValueSelectListener.onValueSelected(Value.FOURTH)}" />
        </LinearLayout>
    </RadioGroup>
</layout>

步骤4:更新活动/片段

在更新布局之后,重新构建项目,并将下一个更改应用于活动或片段中布局的创建:

活动更新

private ObservableField<Value> observableSelectedValue = new ObservableField<>(Value.FIRST);
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    YourLayoutNameBinding viewBinding = YourLayoutNameBinding.inflate(LayoutInflater.from(this), null, false);
    setContentView(viewBinding.getRoot());
    
    viewBinding.setObservableSelectedValue(observableSelectedValue);
    viewBinding.setOnValueSelectListener(new OnValueSelectListener() {
        @Override
        public void onValueSelected(Value value) {
            observableSelectedValue.set(value);
        }
    });
}

片段更新

private ObservableField<Value> observableSelectedValue = new ObservableField<>(Value.FIRST);
@Nullable
@Override
public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
    YourLayoutNameBinding viewBinding = YourLayoutNameBinding.inflate(inflater, container, false);
    viewBinding.setObservableSelectedValue(observableSelectedValue);
    viewBinding.setOnValueSelectListener(new OnValueSelectListener() {
        @Override
        public void onValueSelected(Value value) {
            observableSelectedValue.set(value);
        }
    });
    return viewBinding.getRoot();
}

第5步:运行并测试

它现在必须工作。要获取当前选择的值,您需要调用observableSelectedValue.get()