RadioButton点击带下划线效果

RadioButton点击带下划线效果

在开发中,我们经常会要实现一个RadioGroup中点击某个按钮,然后去实现某个操作,这个时候要一个选中状态的标示,很多时候是在下面加一个横线,效果如下:
这里写图片描述
那怎样通过xml文件来实现这个效果:
首先,我们肯定需要一个selector,关键是怎么在selector来实现下面的横线,首先我们需要给radiobutton一个固定的高度,比如48dp,然后要使用到layer-list,layer-list是用来叠加多个效果的,这里我们只有一个效果,在layer-list中,我们使用shape来实现横条,并且让他距离top44dp,这样横线的高度就是4dp,并且在下方显示。最终整个xml文件代码如下:


<selector 
    xmlns:android="http://schemas.android.com/apk/res/android" >

    <item android:state_checked="true">
        <layer-list>

            <item android:top="44dp">

                <shape android:shape="rectangle" >
                    <solid android:color="#ff0000" />
                shape>
            item>
        layer-list>
    item>

    <item android:drawable="@color/transparent">item>

selector>
最后在radiobutton中设置Android:background即可。

你可能感兴趣的:(RadioButton点击带下划线效果)