Android 扩大CheckBox的点击范围

小灰灰 2022-05-25 05:23 509阅读 0赞

以前都是通过给checkbox设置pandding的方式来解决扩大点击范围的问题

但是现在的checkbox变为AppCompatChatBox后这种方法失效了

下面介绍一种新的方法

创建一个新的CheckBox

public class LargeTouchCheckBox extends android.support.v7.widget.AppCompatCheckBox {
        private final int TOUCH_ADDITION = 0;
        private int mTouchAdditionBottom = 0;
        private int mTouchAdditionLeft = 0;
        private int mTouchAdditionRight = 0;
        private int mTouchAdditionTop = 0;
        private int mPreviousLeft = -1;
        private int mPreviousRight = -1;
        private int mPreviousBottom = -1;
        private int mPreviousTop = -1;
    
        public LargeTouchCheckBox(Context context) {
            super(context);
        }
    
        public LargeTouchCheckBox(Context context, AttributeSet attrs) {
            super(context, attrs);
            init(context, attrs);
        }
    
        public LargeTouchCheckBox(Context context, AttributeSet attrs,
                                         int defStyle) {
            super(context, attrs, defStyle);
            init(context, attrs);
        }
    
        private void init(Context context, AttributeSet attrs) {
            TypedArray a = context.obtainStyledAttributes(attrs,
                    R.styleable.LargeTouchableAreaView);
            int addition = (int) a.getDimension(
                    R.styleable.LargeTouchableAreaView_addition, TOUCH_ADDITION);
            mTouchAdditionBottom = addition;
            mTouchAdditionLeft = addition;
            mTouchAdditionRight = addition;
            mTouchAdditionTop = addition;
            mTouchAdditionBottom = (int) a.getDimension(
                    R.styleable.LargeTouchableAreaView_additionBottom,
                    mTouchAdditionBottom);
            mTouchAdditionLeft = (int) a.getDimension(
                    R.styleable.LargeTouchableAreaView_additionLeft,
                    mTouchAdditionLeft);
            mTouchAdditionRight = (int) a.getDimension(
                    R.styleable.LargeTouchableAreaView_additionRight,
                    mTouchAdditionRight);
            mTouchAdditionTop = (int) a.getDimension(
                    R.styleable.LargeTouchableAreaView_additionTop,
                    mTouchAdditionTop);
            a.recycle();
        }
    
        @Override
        protected void onLayout(boolean changed, int left, int top, int right,
                                int bottom) {
            super.onLayout(changed, left, top, right, bottom);
            if (left != mPreviousLeft || top != mPreviousTop
                    || right != mPreviousRight || bottom != mPreviousBottom) {
                mPreviousLeft = left;
                mPreviousTop = top;
                mPreviousRight = right;
                mPreviousBottom = bottom;
                final View parent = (View) this.getParent();
                parent.setTouchDelegate(new TouchDelegate(new Rect(left
                        - mTouchAdditionLeft, top - mTouchAdditionTop, right
                        + mTouchAdditionRight, bottom + mTouchAdditionBottom), this));
            }
        }
    
    }

在Styles.xml里面加入

<declare-styleable name="LargeTouchableAreaView">
            <attr name="addition" format="dimension" />
            <attr name="additionBottom" format="dimension" />
            <attr name="additionLeft" format="dimension" />
            <attr name="additionRight" format="dimension" />
            <attr name="additionTop" format="dimension" />
        </declare-styleable>

布局文件的样子

<?xml version="1.0" encoding="utf-8"?>
    <com.sdcardcleaner.ui.views.SquareRelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        xmlns:app="http://schemas.android.com/apk/res-auto">
        <ImageView
            android:layout_width="200dp"
            android:layout_height="200dp"
            android:id="@+id/pic_iv"/>
        <FrameLayout
            android:layout_width="62dp"
            android:layout_height="62dp"
            android:layout_alignParentRight="true">
            <com.sdcardcleaner.ui.views.LargeTouchCheckBox
                android:layout_width="25dp"
                android:layout_height="25dp"
                android:id="@+id/del_cb"
                app:additionBottom="30dp"
                app:additionLeft="30dp"
                app:additionTop="7dp"
                app:additionRight="7dp"
                android:button="@drawable/selector_select"
                android:layout_gravity="right"
                />
        </FrameLayout>
    </com.sdcardcleaner.ui.views.SquareRelativeLayout>

其实总体思路还是类似于pandding的方式

这里需要注意的一点就是：

LargeTouchCheckBox需要在外层套一个layout，layout的大小就是你想要的点击范围（宽=checkbox.width+leftpadding+rightpadding，高以此类推）

# 注意一下代码： #

final View parent = (View) this.getParent();
     parent.setTouchDelegate(new TouchDelegate(new Rect(left
                        - mTouchAdditionLeft, top - mTouchAdditionTop, right
                        + mTouchAdditionRight, bottom + mTouchAdditionBottom), this));

由于setTouchDelegate，所以一个viewgroup下只能有一个控件设置TouchDelegate，其他控件如果也想设置TouchDelegate只能在控件外层嵌套一层无用的FrameLayout。