Android 多选按钮Button

一、先上效果图

二、准备阶段:资源文件(可根据项目需要调整样式、大小和颜色等)

在res文件夹下创建以下资源文件,根据根标签选择Root Element

1.

bg_btn_no_select.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <size
        android:width="100dp"
        android:height="30dp" />
    <solid android:color="#002196F3" />
    <corners android:radius="15dp" />

</shape>

2.

bg_btn_select.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <size
        android:width="100dp"
        android:height="30dp" />
    <solid android:color="#2196F3" />
    <corners android:radius="15dp" />

</shape>

3.

bg_button_selector.xml

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

4.

bg_select_button.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <size
        android:width="200dp"
        android:height="30dp" />
    <corners android:radius="15dp" />
    <solid android:color="#66757575" />

</shape>

三、布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <LinearLayout
        android:layout_margin="10dp"
        android:layout_width="200dp"
        android:layout_height="30dp"
        android:background="@drawable/bg_select_button"
        android:orientation="horizontal">

        <Button
            android:id="@+id/_2_btn1"
            android:layout_width="100dp"
            android:layout_height="30dp"
            android:background="@drawable/bg_button_selector" />

        <Button
            android:id="@+id/_2_btn2"
            android:layout_width="100dp"
            android:layout_height="30dp"
            android:background="@drawable/bg_button_selector" />
    </LinearLayout>

    <LinearLayout
        android:layout_margin="10dp"
        android:layout_width="300dp"
        android:layout_height="30dp"
        android:background="@drawable/bg_select_button"
        android:orientation="horizontal">

        <Button
            android:id="@+id/_3_btn1"
            android:layout_width="100dp"
            android:layout_height="30dp"
            android:background="@drawable/bg_button_selector" />

        <Button
            android:id="@+id/_3_btn2"
            android:layout_width="100dp"
            android:layout_height="30dp"
            android:background="@drawable/bg_button_selector" />

        <Button
            android:id="@+id/_3_btn3"
            android:layout_width="100dp"
            android:layout_height="30dp"
            android:background="@drawable/bg_button_selector" />
    </LinearLayout>

    <LinearLayout
        android:layout_margin="10dp"
        android:layout_width="400dp"
        android:layout_height="30dp"
        android:background="@drawable/bg_select_button"
        android:orientation="horizontal">

        <Button
            android:id="@+id/_4_btn1"
            android:layout_width="100dp"
            android:layout_height="30dp"
            android:background="@drawable/bg_button_selector" />

        <Button
            android:id="@+id/_4_btn2"
            android:layout_width="100dp"
            android:layout_height="30dp"
            android:background="@drawable/bg_button_selector" />

        <Button
            android:id="@+id/_4_btn3"
            android:layout_width="100dp"
            android:layout_height="30dp"
            android:background="@drawable/bg_button_selector" />

        <Button
            android:id="@+id/_4_btn4"
            android:layout_width="100dp"
            android:layout_height="30dp"
            android:background="@drawable/bg_button_selector" />
    </LinearLayout>


</LinearLayout>

四、Java代码

1.MainActivity.java

package com.rivotek.selectbutton;

import androidx.appcompat.app.AppCompatActivity;

import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.Button;

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    private static final String TAG = "LXP_MainActivity";

    //声明按钮控件和对应id,一定要放入数组,方便操作,有几个按钮,Button数组初始化大小就为多少
    private Button[] twoSelectButton = new Button[2];
    private int[] twoSelectButtonIds = new int[]{R.id._2_btn1, R.id._2_btn2};


    private Button[] threeSelectButton = new Button[3];
    private int[] threeSelectButtonIds = new int[]{R.id._3_btn1, R.id._3_btn2, R.id._3_btn3};

    private Button[] fourSelectButton = new Button[4];
    private int[] fourSelectButtonIds = new int[]{R.id._4_btn1, R.id._4_btn2, R.id._4_btn3, R.id._4_btn4};

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        findView();

        initData();

        setListener();

    }

    private void findView() {
        SelectButtonUtil.findButton(this, twoSelectButton, twoSelectButtonIds);
        SelectButtonUtil.findButton(this, threeSelectButton, threeSelectButtonIds);
        SelectButtonUtil.findButton(this, fourSelectButton, fourSelectButtonIds);
    }

    private void initData() {
        setButtonState(this, twoSelectButton, twoSelectButtonIds, 0);
        setButtonState(this, threeSelectButton, threeSelectButtonIds, 0);
        setButtonState(this, fourSelectButton, fourSelectButtonIds, 0);
    }

    private void setListener() {
        SelectButtonUtil.setListener(this, twoSelectButton, twoSelectButtonIds, this);
        SelectButtonUtil.setListener(this, threeSelectButton, threeSelectButtonIds, this);
        SelectButtonUtil.setListener(this, fourSelectButton, fourSelectButtonIds, this);
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id._2_btn1:
                setButtonState(this, twoSelectButton, twoSelectButtonIds, 0);
                break;
            case R.id._2_btn2:
                setButtonState(this, twoSelectButton, twoSelectButtonIds, 1);
                break;
            case R.id._3_btn1:
                setButtonState(this, threeSelectButton, threeSelectButtonIds, 0);
                break;
            case R.id._3_btn2:
                setButtonState(this, threeSelectButton, threeSelectButtonIds, 1);
                break;
            case R.id._3_btn3:
                setButtonState(this, threeSelectButton, threeSelectButtonIds, 2);
                break;
            case R.id._4_btn1:
                setButtonState(this, fourSelectButton, fourSelectButtonIds, 0);
                break;
            case R.id._4_btn2:
                setButtonState(this, fourSelectButton, fourSelectButtonIds, 1);
                break;
            case R.id._4_btn3:
                setButtonState(this, fourSelectButton, fourSelectButtonIds, 2);
                break;
            case R.id._4_btn4:
                setButtonState(this, fourSelectButton, fourSelectButtonIds, 3);
                break;
            default:
                break;
        }
    }

    private void setButtonState(Activity activity, Button[] btnArr, int[] idArr, int index) {
        Log.i(TAG, "isSelect = " + SelectButtonUtil.isSelected(btnArr, index));
        if (!SelectButtonUtil.isSelected(btnArr, index)) {
            Log.i(TAG, "into if~");
            SelectButtonUtil.setState(index, activity, btnArr, idArr);
        }
    }
}

2.SelectButtonUtil.java

package com.rivotek.selectbutton;

import android.app.Activity;
import android.view.View;
import android.widget.Button;

/**
 * 多选按钮操作工具类 用于定位控件(findView)、设置按钮选中状态、设置监听(setListener)
 */
public class SelectButtonUtil {
    /**
     * findView
     *
     * @param activity view对应的Activity对象
     * @param btnArr   多选按钮数组
     * @param idArr    多选按钮数组button对应的id数组
     */
    public static void findButton(Activity activity, Button[] btnArr, int[] idArr) {
        for (int i = 0; i < btnArr.length; i++) {
            btnArr[i] = activity.findViewById(idArr[i]);
        }
    }

    /**
     * 设置按钮状态
     *
     * @param index    选中按钮对应的数组角标
     * @param activity view对应的Activity对象
     * @param btnArr   多选按钮数组
     * @param idArr    多选按钮数组button对应的id数组
     */
    public static void setState(int index, Activity activity, Button[] btnArr, int[] idArr) {
        for (int i = 0; i < btnArr.length; i++) {
            if (i == index) {
                btnArr[i].setSelected(true);
            } else {
                btnArr[i].setSelected(false);
            }
        }
    }

    /**
     * 设置按钮监听
     *
     * @param activity view对应的Activity对象
     * @param btnArr   多选按钮数组
     * @param idArr    多选按钮数组button对应的id数组
     * @param listener 监听实现类,一般放到Activity里实现,传入Activity对象
     */
    public static void setListener(Activity activity, Button[] btnArr, int[] idArr, View.OnClickListener listener) {
        for (int i = 0; i < btnArr.length; i++) {
            btnArr[i].setOnClickListener(listener);
        }
    }

    /**
     * 判断多选按钮的一个按钮是否被选中
     *
     * @param btnArr 多选按钮数组
     * @param index  选中按钮对应的数组角标
     * @return true 被选中 / false 未选中
     */
    public static boolean isSelected(Button[] btnArr, int index) {
        return btnArr[index].isSelected();
    }

}无

结语:

如果需要多个按钮,继续再添加到布局文件即可,再到MainActivity初始化就可以使用啦!

一般情况二选一、三选一和四选一按钮够日常使用,如果需要五选一或更多,可以按照布局和代码的方式继续添加。

希望对大家有帮助。

猜你喜欢

转载自blog.csdn.net/Benlve/article/details/126544488