RadioGroup+RadioButton嵌套其他布局实现多行单选布局、自定义RadioButton选中和非选中样式、文字颜色

来源:互联网 发布:遗传算法解决线路优化 编辑:程序博客网 时间:2024/05/01 20:29




上面两个图的需求都是要实现在多行中实现单选,本次以第二张图片的实现为例:
考虑到使用RadioGroup和RadioButton来做到单选的效果,为了实现上面的布局,在RadioGroup中嵌套了LinearLayout,然后在LinearLayout中分别加入相应的RadioButton。
运行起来看看效果,发现这样写就让RadioButton本身的“选择互斥性”丧失了。也就无法满足我们的需求。
所以,我们自定义RadioGroup(此RadioGroup来源在文末,由于使用中有些小问题,这里修改了一下), 解决RadioGroup嵌套其他布局后 RadioButton不再互斥的问题

public class MyRadioGroup extends LinearLayout {    // holds the checked id; the selection is empty by default    private int mCheckedId = -1;    // tracks children radio buttons checked state    private CompoundButton.OnCheckedChangeListener mChildOnCheckedChangeListener;    // when true, mOnCheckedChangeListener discards events    private boolean mProtectFromCheckedChange = false;    private OnCheckedChangeListener mOnCheckedChangeListener;    private PassThroughHierarchyChangeListener mPassThroughListener;    /**     * {@inheritDoc}     */    public MyRadioGroup(Context context) {        super(context);        setOrientation(VERTICAL);        init();    }    /**     * {@inheritDoc}     */    public MyRadioGroup(Context context, AttributeSet attrs) {        super(context, attrs);        mCheckedId = View.NO_ID;        final int index = VERTICAL;        setOrientation(index);        init();    }    private void init() {        mChildOnCheckedChangeListener = new CheckedStateTracker();        mPassThroughListener = new PassThroughHierarchyChangeListener();        super.setOnHierarchyChangeListener(mPassThroughListener);    }    /**     * {@inheritDoc}     */    @Override    public void setOnHierarchyChangeListener(OnHierarchyChangeListener listener) {        // the user listener is delegated to our pass-through listener        mPassThroughListener.mOnHierarchyChangeListener = listener;    }    /**     * {@inheritDoc}     */    @Override    protected void onFinishInflate() {        super.onFinishInflate();        // checks the appropriate radio button as requested in the XML file        if (mCheckedId != -1) {            mProtectFromCheckedChange = true;            setCheckedStateForView(mCheckedId, true);            mProtectFromCheckedChange = false;            setCheckedId(mCheckedId);        }    }    @Override    public void addView(final View child, int index, ViewGroup.LayoutParams params) {        if (child instanceof RadioButton) {            child.setOnTouchListener(new OnTouchListener() {                @Override                public boolean onTouch(View v, MotionEvent event) {                    if (event.getAction() == MotionEvent.ACTION_DOWN && !((RadioButton) child).isChecked()) {                        ((RadioButton) child).setChecked(true);                        checkRadioButton((RadioButton) child);                        if (mOnCheckedChangeListener != null) {                            mOnCheckedChangeListener.onCheckedChanged(MyRadioGroup.this, child.getId());                        }                    }                    return true;                }            });        } else if (child instanceof LinearLayout) {            int childCount = ((LinearLayout) child).getChildCount();            for (int i = 0; i < childCount; i++) {                View view = ((LinearLayout) child).getChildAt(i);                if (view instanceof RadioButton) {                    final RadioButton button = (RadioButton) view;                    button.setOnTouchListener(new OnTouchListener() {                        @Override                        public boolean onTouch(View v, MotionEvent event) {                            if (event.getAction() == MotionEvent.ACTION_DOWN && !button.isChecked()) {                                button.setChecked(true);                                checkRadioButton(button);                                if (mOnCheckedChangeListener != null) {                                    mOnCheckedChangeListener.onCheckedChanged(MyRadioGroup.this, button.getId());                                }                            }                            return true;                        }                    });                }            }        }        super.addView(child, index, params);    }    private void checkRadioButton(RadioButton radioButton) {        View child;        int radioCount = getChildCount();        for (int i = 0; i < radioCount; i++) {            child = getChildAt(i);            if (child instanceof RadioButton) {                if (child == radioButton) {                    // do nothing                } else {                    ((RadioButton) child).setChecked(false);                }            } else if (child instanceof LinearLayout) {                int childCount = ((LinearLayout) child).getChildCount();                for (int j = 0; j < childCount; j++) {                    View view = ((LinearLayout) child).getChildAt(j);                    if (view instanceof RadioButton) {                        final RadioButton button = (RadioButton) view;                        if (button == radioButton) {                            // do nothing                        } else {                            ((RadioButton) button).setChecked(false);                        }                    }                }            }        }    }    /**     * <p>Sets the selection to the radio button whose identifier is passed in     * parameter. Using -1 as the selection identifier clears the selection;     * such an operation is equivalent to invoking {@link #clearCheck()}.</p>     *     * @param id the unique id of the radio button to select in this group     * @see #getCheckedRadioButtonId()     * @see #clearCheck()     */    public void check(int id) {        // don't even bother        if (id != -1 && (id == mCheckedId)) {            return;        }        if (mCheckedId != -1) {            setCheckedStateForView(mCheckedId, false);        }        if (id != -1) {            setCheckedStateForView(id, true);        }        setCheckedId(id);    }    private void setCheckedId(int id) {        mCheckedId = id;    }    private void setCheckedStateForView(int viewId, boolean checked) {        View checkedView = findViewById(viewId);        if (checkedView != null && checkedView instanceof RadioButton) {            ((RadioButton) checkedView).setChecked(checked);        }    }    /**     * <p>Returns the identifier of the selected radio button in this group.     * Upon empty selection, the returned value is -1.</p>     *     * @return the unique id of the selected radio button in this group     * @attr ref android.R.styleable#RadioGroup_checkedButton     * @see #check(int)     * @see #clearCheck()     */    public int getCheckedRadioButtonId() {        return mCheckedId;    }    /**     * <p>Clears the selection. When the selection is cleared, no radio button     * in this group is selected and {@link #getCheckedRadioButtonId()} returns     * null.</p>     *     * @see #check(int)     * @see #getCheckedRadioButtonId()     */    public void clearCheck() {        check(-1);    }    /**     * <p>Register a callback to be invoked when the checked radio button     * changes in this group.</p>     *     * @param listener the callback to call on checked state change     */    public void setOnCheckedChangeListener(OnCheckedChangeListener listener) {        mOnCheckedChangeListener = listener;    }    /**     * {@inheritDoc}     */    @Override    public LayoutParams generateLayoutParams(AttributeSet attrs) {        return new MyRadioGroup.LayoutParams(getContext(), attrs);    }    /**     * {@inheritDoc}     */    @Override    protected boolean checkLayoutParams(ViewGroup.LayoutParams p) {        return p instanceof RadioGroup.LayoutParams;    }    @Override    protected LinearLayout.LayoutParams generateDefaultLayoutParams() {        return new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);    }    @Override    public void onInitializeAccessibilityEvent(AccessibilityEvent event) {        super.onInitializeAccessibilityEvent(event);        event.setClassName(RadioGroup.class.getName());    }    @Override    public void onInitializeAccessibilityNodeInfo(AccessibilityNodeInfo info) {        super.onInitializeAccessibilityNodeInfo(info);        info.setClassName(RadioGroup.class.getName());    }    /**     * <p>This set of layout parameters defaults the width and the height of     * the children to {@link #WRAP_CONTENT} when they are not specified in the     * XML file. Otherwise, this class ussed the value read from the XML file.</p>     * <p>     * <p>See     * for a list of all child view attributes that this class supports.</p>     */    public static class LayoutParams extends LinearLayout.LayoutParams {        /**         * {@inheritDoc}         */        public LayoutParams(Context c, AttributeSet attrs) {            super(c, attrs);        }        /**         * {@inheritDoc}         */        public LayoutParams(int w, int h) {            super(w, h);        }        /**         * {@inheritDoc}         */        public LayoutParams(int w, int h, float initWeight) {            super(w, h, initWeight);        }        /**         * {@inheritDoc}         */        public LayoutParams(ViewGroup.LayoutParams p) {            super(p);        }        /**         * {@inheritDoc}         */        public LayoutParams(MarginLayoutParams source) {            super(source);        }        /**         * <p>Fixes the child's width to         * {@link android.view.ViewGroup.LayoutParams#WRAP_CONTENT} and the child's         * height to  {@link android.view.ViewGroup.LayoutParams#WRAP_CONTENT}         * when not specified in the XML file.</p>         *         * @param a          the styled attributes set         * @param widthAttr  the width attribute to fetch         * @param heightAttr the height attribute to fetch         */        @Override        protected void setBaseAttributes(TypedArray a,                                         int widthAttr, int heightAttr) {            if (a.hasValue(widthAttr)) {                width = a.getLayoutDimension(widthAttr, "layout_width");            } else {                width = WRAP_CONTENT;            }            if (a.hasValue(heightAttr)) {                height = a.getLayoutDimension(heightAttr, "layout_height");            } else {                height = WRAP_CONTENT;            }        }    }    /**     * <p>Interface definition for a callback to be invoked when the checked     * radio button changed in this group.</p>     */    public interface OnCheckedChangeListener {        /**         * <p>Called when the checked radio button has changed. When the         * selection is cleared, checkedId is -1.</p>         *         * @param group     the group in which the checked radio button has changed         * @param checkedId the unique identifier of the newly checked radio button         */        public void onCheckedChanged(MyRadioGroup group, int checkedId);    }    private class CheckedStateTracker implements CompoundButton.OnCheckedChangeListener {        public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {            // prevents from infinite recursion            if (mProtectFromCheckedChange) {                return;            }            mProtectFromCheckedChange = true;            if (mCheckedId != -1) {                setCheckedStateForView(mCheckedId, false);            }            mProtectFromCheckedChange = false;            int id = buttonView.getId();            setCheckedId(id);        }    }    /**     * <p>A pass-through listener acts upon the events and dispatches them     * to another listener. This allows the table layout to set its own internal     * hierarchy change listener without preventing the user to setup his.</p>     */    private class PassThroughHierarchyChangeListener implements            ViewGroup.OnHierarchyChangeListener {        private ViewGroup.OnHierarchyChangeListener mOnHierarchyChangeListener;        /**         * {@inheritDoc}         */        public void onChildViewAdded(View parent, View child) {            if (parent == MyRadioGroup.this && child instanceof RadioButton) {                int id = child.getId();                // generates an id if it's missing                if (id == View.NO_ID) {                    id = child.hashCode();                    child.setId(id);                }                ((RadioButton) child).setOnCheckedChangeListener(                        mChildOnCheckedChangeListener);            }            if (mOnHierarchyChangeListener != null) {                mOnHierarchyChangeListener.onChildViewAdded(parent, child);            }        }        /**         * {@inheritDoc}         */        public void onChildViewRemoved(View parent, View child) {            if (parent == MyRadioGroup.this && child instanceof RadioButton) {                ((RadioButton) child).setOnCheckedChangeListener(null);            }            if (mOnHierarchyChangeListener != null) {                mOnHierarchyChangeListener.onChildViewRemoved(parent, child);            }        }    }}



布局文件中使用:

            <com.roboocean.robosea.view.MyRadioGroup                android:layout_width="match_parent"                android:layout_height="wrap_content">                <LinearLayout style="@style/linearLayout_device_setting_nomal">                    <TextView                        style="@style/textview_fps"                        android:text="1440P" />                    <RadioButton                        android:id="@+id/mFPS_1440_30"                        style="@style/radiobutton_fps"                        android:layout_marginRight="@dimen/x60"                        android:text="@string/fps_30" />                </LinearLayout>                <View                    android:layout_width="match_parent"                    android:layout_height="@dimen/y1"                    android:background="@color/bottom_line" />                <LinearLayout style="@style/linearLayout_device_setting_nomal">                    <TextView                        style="@style/textview_fps"                        android:text="1080P" />                    <RadioButton                        android:checked="true"                        android:id="@+id/mFPS_1080_30"                        style="@style/radiobutton_fps"                        android:layout_marginRight="@dimen/x40"                        android:text="@string/fps_30" />                    <RadioButton                        android:id="@+id/mFPS_1080_60"                        style="@style/radiobutton_fps"                        android:layout_marginRight="@dimen/x60"                        android:text="@string/fps_60" />                </LinearLayout>                <View                    android:layout_width="match_parent"                    android:layout_height="@dimen/y1"                    android:background="@color/bottom_line" />                <LinearLayout style="@style/linearLayout_device_setting_nomal">                    <TextView                        style="@style/textview_fps"                        android:text="720P" />                    <RadioButton                        android:id="@+id/mFPS_720_30"                        style="@style/radiobutton_fps"                        android:layout_marginRight="@dimen/x40"                        android:text="@string/fps_30" />                    <RadioButton                        android:id="@+id/mFPS_720_60"                        style="@style/radiobutton_fps"                        android:layout_marginRight="@dimen/x60"                        android:text="@string/fps_60" />                </LinearLayout>            </com.roboocean.robosea.view.MyRadioGroup>

相关样式

<style name="linearLayout_device_setting_nomal">        <item name="android:layout_width">match_parent</item>        <item name="android:layout_height">@dimen/y90</item>        <item name="android:gravity">center_vertical</item>        <item name="android:background">@color/white</item>    </style>


    <style name="textview_fps">        <item name="android:layout_width">wrap_content</item>        <item name="android:layout_height">wrap_content</item>        <item name="android:layout_marginLeft">@dimen/x50</item>        <item name="android:layout_weight">1</item>        <item name="android:textColor">@color/empty_tip_text</item>        <item name="android:textSize">@dimen/x29</item>    </style>


    <style name="radiobutton_fps">        <item name="android:button">@null</item>        <item name="android:background">@drawable/selector_fps</item>        <item name="android:layout_width">@dimen/x118</item>        <item name="android:layout_height">@dimen/y58</item>        <item name="android:textColor">@drawable/selector_fps_text</item>        <item name="android:textSize">@dimen/x25</item>        <item name="android:gravity">center</item>    </style>


自定义RadioButton的Selector

selector_fps.xml

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


两个状态的shape:
shape_fps_normal.xml

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android" >    <corners android:radius="10px" />    <solid android:color="@color/white" />    <stroke        android:width="1dp"        android:color="#b7b7b7" /></shape>

shape_fps_checked.xml

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android" >    <corners android:radius="10px" />    <solid android:color="@color/pressed_text" />    <stroke        android:width="1dp"        android:color="@color/pressed_text" /></shape>

自定义RadioButton字体颜色的Selector:

selector_fps_text.xml

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



上文中自定义RadioGroup源自:http://blog.csdn.net/yuanzihui/article/details/50462496,感谢分享

0 0
原创粉丝点击