【问题标题】:Android Layout: Center RadioButton in RadioGroupAndroid 布局:RadioGroup 中的中心 RadioButton
【发布时间】:2020-11-21 01:25:33
【问题描述】:

我正在尝试将 Radiobuttons 置于 Radiogroup 的中心。我有一个解决方案

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

但是,如果我这样做,则可以同时检查所有 RadioButton,我想通过 Radiogroup 来防止这种情况获得单选。 要自动获取单选逻辑,RadioButtons 必须是 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

【问题讨论】:

  • RadioGroup 不支持将其 RadioButton 子级嵌套在中间视图组中。 没有额外的工作,你不可能拥有所需示例中提到的开箱即用的结构。我有同样的情况,基本上将View.OnClickListener 连接到每个RadioButtons。我使用的是 Kotlin + data binding - 它让事情变得简单了 10 倍。如果您有兴趣,我可以发布一个示例。
  • 好的,带有 onClickListener 的解决方案无法正常工作,这就是我想使用原生解决方案的原因。如果您发布解决方案,那就太好了!谢谢。

标签: android android-layout layout alignment


【解决方案1】:

第 1 步:启用数据绑定

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

android {
    ...
    buildFeatures.dataBinding = true
}

熟悉数据绑定的两种方法:

第二步:定义枚举和点击监听

我建议您使用 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 步:更新 Activity/Fragment

随着布局的更新,重建项目并将下一个更改应用到您的 Activity 或 Fragment 中的布局创建:

活动更新

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()

【讨论】:

    猜你喜欢
    • 2013-12-25
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-01-06
    • 1970-01-01
    相关资源
    最近更新 更多