多行单选组合控件 MultiLineRadioGroup

  • Post author:
  • Post category:其他



需求

这里写图片描述

实现方法

如果是单行或者单列直接使用RadioGroup+RadioButton来实现

但是往往就是计划赶不上变化,ui给出的图是这种多行单选

想到的方法之一就是gridview

这里使用RecyclerView进行封装

把该处理的都处理完,这样在调用时就会方便很多

step1

创建一个类继承RecyclerView

实现其构造

在内部进行初始化和设置GridLayoutManager进行适配处理

讲数据通过set方法传递进来

public class MultiLineRadioGroup extends RecyclerView {
    private int mChosePosition;
    private List<String> mList = new ArrayList<>();
    private MultilLineRadioButtonAdapter mAdapter;

    public MultiLineRadioGroup(Context context) {
        this(context, null);
    }

    public MultiLineRadioGroup(Context context, @Nullable AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public MultiLineRadioGroup(Context context, @Nullable AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        initView(context);
    }

    @Override
    public boolean canScrollVertically(int direction) {
        return false;
    }

    /**
 * 外部实现接口 监听点击位置
 */
    private OnChoseListener mOnChoseListener;

    public interface OnChoseListener {
        void onChose(int position);

    }

    public void setOnChoseListener(OnChoseListener onChoseListener) {
        mOnChoseListener = onChoseListener;
    }

    private void initView(Context context) {
        Log.d("tag", "initView");
        setLayoutManager(new GridLayoutManager(context, 3));
        setAdapter(mAdapter = new MultilLineRadioButtonAdapter(R.layout.item_radio, mList, 0));
        mAdapter.setOnItemClickListener(new BaseQuickAdapter.OnItemClickListener() {
            @Override
            public void onItemClick(BaseQuickAdapter adapter, View view, int position) {
                mAdapter.setChosePosition(position);
                mAdapter.notifyDataSetChanged();
                if (mOnChoseListener != null) {
                    mOnChoseListener.onChose(position);
                }
            }
        });
    }

    /**
     * 外部设置数据进来
     */
    public void setData(List<String> list) {
        Log.d("tag", "setData");
        if (mList.size() == 0) {
            mList.addAll(list);
        } else {
            mList.clear();
            mList.addAll(list);
        }
        mAdapter.notifyDataSetChanged();
    }

    class MultilLineRadioButtonAdapter extends BaseQuickAdapter<String, BaseViewHolder> {

        public MultilLineRadioButtonAdapter(@LayoutRes int layoutResId, @Nullable List<String> data, int chosePosition) {
            super(layoutResId, data);
            mChosePosition = chosePosition;
        }

        @Override
        protected void convert(BaseViewHolder helper, String item) {
            helper.setText(R.id.tv, item);
            helper.getView(R.id.tv).setEnabled(helper.getPosition() == mChosePosition ? true : false);
        }

        public int getChosePosition() {
            return mChosePosition;
        }

        public void setChosePosition(int chosePosition) {
            mChosePosition = chosePosition;
        }
    }

}

注意这里的 BaseQuickAdapter 是第三方开源RecyclerView适配器

step2

将上面的自定义recyclerview设置到xml

  <chonghao.com.ch_kuaichong_driver.ui.widget.MultiLineRadioGroup
        android:id="@+id/radio_group"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/home_popup_wx_bg_mid"
        android:overScrollMode="never"
        android:paddingBottom="12dp"
        android:paddingTop="12dp"
        android:scrollbars="none"/>

step3

在代码中 查找控件 和设置 数据  及点击监听
   MultiLineRadioGroup radioGroup = view.findViewById(R.id.radio_group);

        final List<String> list = new ArrayList<>();
        list.add("故障A");
        list.add("故障B");
        list.add("故障C");
        list.add("故障D");
        list.add("故障E");
        list.add("故障F");
        radioGroup.setData(list);
           radioGroup.setOnChoseListener(new MultiLineRadioGroup.OnChoseListener() {
            @Override
            public void onChose(int position) {
                mErrorType = list.get(position);
            }
        });

step4

剩余资源

item_radio.xml

<?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="wrap_content"
              android:gravity="center_horizontal">

    <TextView
        android:id="@+id/tv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:drawableLeft="@drawable/selector_radio"
        android:drawablePadding="15dp"
        android:enabled="false"
        android:gravity="center_horizontal"
        android:paddingBottom="12dp"
        android:paddingTop="12dp"
        android:text="故障A"
        android:textSize="14dp"/>
</LinearLayout>

选择器 可以自行修改为需要的样式

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



版权声明:本文为jiushiwo12340原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。