Android实现RadioGroup之间的互斥

关于

  因为一个页面需求，需要有两个radio group共六个radio button来实现单选互斥（为什么不用一个radio group来包裹是因为需要两行展示）

效果图

实现

准备工作，附上布局代码

  首先修改activity_radio_group.xml文件：

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".RadioGroupActivity">

    <RadioGroup
        android:id="@+id/rgFlowSwitch"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:foreground="?android:attr/selectableItemBackground"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        android:orientation="horizontal">

        <RadioButton
            android:id="@+id/tvSwitchFace"
            android:layout_width="64dp"
            android:layout_height="68dp"
            android:background="@drawable/selector_air_flow"
            android:gravity="center"
            android:layout_weight="1"
            android:layout_marginStart="48dp"
            android:button="@null"
            />

        <RadioButton
            android:id="@+id/tvSwitchFaceFeet"
            android:layout_width="64dp"
            android:layout_height="68dp"
            android:background="@drawable/selector_air_flow"
            android:checked="false"
            android:layout_marginStart="48dp"
            android:button="@null"
            android:layout_weight="1"
            android:gravity="center"
            />
        <RadioButton
            android:id="@+id/tvSwitchBalance"
            android:layout_width="64dp"
            android:layout_height="68dp"
            android:layout_marginStart="48dp"
            android:background="@drawable/selector_air_flow"
            android:checked="false"
            android:layout_marginEnd="39dp"
            android:layout_weight="1"
            android:button="@null"
            android:gravity="center"
            />
    </RadioGroup>

    <RadioGroup
        android:id="@+id/rgFlowTwoSwitch"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:foreground="?android:attr/selectableItemBackground"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/rgFlowSwitch"
        android:orientation="horizontal">

        <RadioButton
            android:id="@+id/tvSwitchFeet"
            android:layout_width="64dp"
            android:layout_height="68dp"
            android:background="@drawable/selector_air_flow"
            android:checked="false"
            android:layout_marginStart="48dp"
            android:button="@null"
            android:layout_weight="1"
            android:gravity="center"
            />

        <RadioButton
            android:id="@+id/tvSwitchFeetWindow"
            android:layout_width="64dp"
            android:layout_height="68dp"
            android:background="@drawable/selector_air_flow"
            android:checked="false"
            android:layout_marginStart="48dp"
            android:button="@null"
            android:layout_weight="1"
            android:gravity="center"
            />
        <RadioButton
            android:id="@+id/tvSwitchWindow"
            android:layout_width="64dp"
            android:layout_height="68dp"
            android:background="@drawable/selector_air_flow"
            android:checked="false"
            android:layout_marginStart="48dp"
            android:layout_marginEnd="39dp"
            android:button="@null"
            android:layout_weight="1"
            android:gravity="center"
            />
    </RadioGroup>

</androidx.constraintlayout.widget.ConstraintLayout>

  贴一下对应radio button的背景selector_air_flow.xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/bg_air_flow_circle_blue_full" android:state_checked="true" />
    <item android:drawable="@drawable/bg_radio_circle_gray_03" android:state_checked="false" />
</selector>

  再贴一下对应bg_air_flow_circle_blue_full.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape android:shape="oval"
    xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#0099ff" />

    <corners android:radius="3dp" />

    <size
        android:width="40dp"
        android:height="40dp" />

    <padding
        android:bottom="7dp"
        android:left="7dp"
        android:right="7dp"
        android:top="7dp" />
</shape>

  最后贴一下bg_radio_circle_gray_03.xml：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <corners android:radius="3dp" />
    <solid
        android:color="@color/transparent"/>
    <size
        android:width="40dp"
        android:height="40dp" />

    <padding
        android:bottom="7dp"
        android:left="7dp"
        android:right="7dp"
        android:top="7dp" />
    <stroke
        android:width="0.6dp"
        android:color="@color/black"/>
</shape>

  好了，准备工作完成

解决需求，附上类代码

 private lateinit var viewBinding: ActivityRadioGroupBinding

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        viewBinding = ActivityRadioGroupBinding.inflate(layoutInflater)
        setContentView(viewBinding.root)
        viewBinding.rgFlowSwitch.setOnCheckedChangeListener { group, checkedId ->
           when(checkedId){
                //check(-1)表示选择null，方法等价.clearCheck()
                    R.id.tvSwitchFace -> viewBinding.rgFlowTwoSwitch.check(-1)
                    R.id.tvSwitchFaceFeet -> viewBinding.rgFlowTwoSwitch.check(-1)
                    R.id.tvSwitchBalance -> viewBinding.rgFlowTwoSwitch.check(-1)
                }
        }
        viewBinding.tvSwitchFeet.setOnCheckedChangeListener { _, isChecked ->
            if (isChecked) viewBinding.rgFlowSwitch.check(-1)
        }
        viewBinding.tvSwitchFeetWindow.setOnCheckedChangeListener { _, isChecked ->
            if (isChecked) viewBinding.rgFlowSwitch.check(-1)
        }
        viewBinding.tvSwitchWindow.setOnCheckedChangeListener { _, isChecked ->
            if (isChecked) viewBinding.rgFlowSwitch.check(-1)
        }
        //因为group的OnCheckedChange会监听子button的状态变化，所以也会服用导致死循环，所以两个group的checked监听不可，超过两个以上的radiogroup就要采用group的onchecked监听+其余group的radiobutton的onchecked监听
        /* viewBinding.rgFlowTwoSwitch.setOnCheckedChangeListener { group, checkedId ->
             if (group.checkedRadioButtonId !=-1){
                 when(checkedId){
                     R.id.tvSwitchFeet -> viewBinding.rgFlowSwitch.check(-1)
                     R.id.tvSwitchWindow -> viewBinding.rgFlowSwitch.check(-1)
                     R.id.tvSwitchFeetWindow -> viewBinding.rgFlowSwitch.check(-1)
                 }
             }

         }*/
    }

  本篇用来记录解决问题的过程，很多测试探索的步骤就不在这里展示，有问题欢迎批评指正，觉得不错的也请点个赞，多谢
  进阶篇《Android实现RadioGroup之间的互斥且radioButton可以选择或取消》