美文网首页
类似 RadioGroup 的选中管理布局

类似 RadioGroup 的选中管理布局

作者: starryCaptain | 来源:发表于2018-09-04 19:53 被阅读0次

    按照惯例,先上图:

    Screenshot_2018-09-04-19-42-51-171_中国移动.png

    类似这样的n选一的需求是很常见的,用原生的 RadioGroup 几乎无法实现,那么就需要一个类似功能 RadioGroup ,可以帮我们管理选中项状态(并且支持设置单选和多选),同时能方便的自定义里面子项的UI布局,要是还能像 list 一样支持用优雅的 adapter 模式设置内容和 layout 就更好了。
    于是:

    引入

    compile 'com.yinzihao:YinLayout:{latest-version}'

    使用指南

    CommonCheckableGroup

    多选或单选项的父布局,类似于{@link android.widget.RadioGroup}
    直接子 view 需要实现{@link Checkable}接口或利用框架中的{@link CheckableTag}(事实上是一个实现了{@link Checkable}接口的{@link FrameLayout})包裹才能被监听选中状态。

    • 在 xml 中使用
    <com.source.yin.yinlayout.checkable.CommonCheckableGroup
        android:id="@+id/common_checkable_group"
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        app:multiple="true"
        android:orientation="vertical">
    
        <CheckedTextView
            android:background="@drawable/background_selector"
            android:layout_height="wrap_content"
            android:layout_width="match_parent"
            android:padding="10dp"
            android:text="选项1"
            android:textColor="@android:color/white" />
    
        <com.source.yin.yinlayout.checkable.CheckableTag
            android:background="@drawable/background_selector"
            android:layout_height="wrap_content"
            android:layout_marginTop="5dp"
            android:layout_width="match_parent">
    
            <TextView
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:padding="10dp"
                android:text="选项2"
                android:textColor="@android:color/white" />
    
        </com.source.yin.yinlayout.checkable.CheckableTag>
    </com.source.yin.yinlayout.checkable.CommonCheckableGroup>
    

    将选项作为 CommonCheckableGroup 的子 view 即可实现所需效果。
    xml 中设置 multiple 属性为 ture 则表示可多选。

    • 在代码中使用
            commonCheckableGroup.setLayoutAdapter(new BaseLayoutAdapter<String>(getApplicationContext(), stringList, R.layout.checkable_group_layout_item) {
                @Override
                public void dataBind(View itemView, int position, String data) {
                    TextView textView = (TextView) itemView.findViewById(R.id.tv_item);
                    textView.setText(data);
                }
            });
    

    在代码中通过 adapter 的方式可以更灵活的设置多个选项,BaseLayoutAdapter 构造函数中的第3个参数中的 xml 即每个选项的布局文件,会在 dataBind() 回调中解析为 view 返回。使用者在此方法中将数据源与布局文件绑定显示。

            commonCheckableGroup.setCheckedListener(new CommonCheckableGroup.CheckedListener() {
                @Override
                public void onCheckChange(Checkable checkable) {
                    List<Checkable> checkedItemList = commonCheckableGroup.getCheckedItemList();
                }
            });
    

    通过 setCheckedListener() 设置选中事件监听。通过 getCheckedItemList() 得到当前选中的对象列表。

    如果你需要在 CheckableGroup 的子项被点击,框架中的选中逻辑被触发之前根据情况拦截此次事件,可以设置拦截器

       commonCheckableGroup.setItemClickInterceptor(new CheckableGroupManager.ItemClickInterceptor() {
           @Override
           public boolean onInterceptorItemClick(Checkable checkable) {
               if (...) {
                 //拦截
                 return true;
               }
               //不拦截
               return false;
           }
       });
    
    common_check_layout.gif

    相关文章

      网友评论

          本文标题:类似 RadioGroup 的选中管理布局

          本文链接:https://www.haomeiwen.com/subject/aaynwftx.html