使用selectableItemBackground作为背景形状drawable

时间:2017-04-07 17:53:40

标签: android android-layout android-view android-drawable android-selector

我有几个按钮需要椭圆形边框。

所以我在capsule_border.xml中有这个

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

我会在需要的地方使用android:background="@drawable/capsule_border.xml

现在,我希望有一个按钮来设置这个椭圆形边框,还有一个android:background="?selectableItemBackground"用于视觉反馈。

我尝试使用带有selectableItembackground的父布局和带有capsule_border的按钮。但似乎突出显示的可点击区域是整个方块。而不仅仅是胶囊边界内的区域。

enter image description here

有没有我可以做到这一点,以便selectableItemBackground不高于视图的整个矩形,但只在我绘制的边框内?

3 个答案:

答案 0 :(得分:15)

拥有 round_corners.xml

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

my_ripple.xml

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
        android:color="?android:attr/colorControlHighlight">
    <item android:id="@android:id/mask">
        <shape android:shape="rectangle">
            <solid android:color="#000000" />
            <corners android:radius="15dp" />
        </shape>
    </item>
    <item android:drawable="@drawable/round_corners" />
</ripple>

按钮:

<Button
    android:background="@drawable/my_ripple"
    ... />

会导致这个:

enter image description here

请参阅this文章。

答案 1 :(得分:5)

我对第一个答案有一个简单的版本:

<ripple
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="?colorControlHighlight"> <!-- default ripple color -->

    <item>
        <!-- the background shape when it's not being clicked -->
        <shape android:shape="rectangle">
            <solid android:color="@color/colorPrimary" />
            <corners android:radius="32dp" />
        </shape>
    </item>
</ripple>

仅将其用作背景,但请记住删除阴影(如果它适用于Button

style="?borderlessButtonStyle"

祝你好运!


enter image description here

答案 2 :(得分:2)

现在是2020年更简单的解决方案(API> = 21,因为我们使用的是?attr语法):

<ripple
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="?colorControlHighlight">
    <!-- ? the ripple's color (1) -->

    <!-- ? no `id` so our <shape> will be drawn and not just used as mask -->
    <item>
        <shape>
            <corners android:radius="9dp" />
            <solid android:color="@color/white" />
        </shape>
    </item>

</ripple>

(1)如果您没有在主题中覆盖colorControlHighlight,则涟漪的颜色将是Android的默认颜色。如果您覆盖它,但仍想使用Android的默认设置,请改用?android:colorControlHighlight