Search code examples
androidxml-drawablerippledrawable

Ripple Effect with custom drawable xml?


I need to add ripple effect for all controls to add the liveliness to the Application. Since my minimum api level 18, so i can't able to use <ripple> in drawable xml. Also all my controls have custom drawable as XML.

My Custom Drawable for Controls

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape>
            <padding
                android:bottom="2dp"
                android:left="2dp"
                android:right="2dp"
                android:top="2dp"/>
            <solid android:color="@color/border1"/>
        </shape>
    </item>
    <item>
        <shape>
            <padding
                android:bottom="1dp"
                android:left="1dp"
                android:right="1dp"
                android:top="1dp"/>
            <corners android:radius="15dp"/>
            <solid android:color="@color/border2"/>
        </shape>
    </item>
    <item>
        <shape>
            <padding
                android:bottom="1dp"
                android:left="1dp"
                android:right="1dp"
                android:top="1dp"/>
            <corners android:radius="15dp"/>
            <solid android:color="@color/border3"/>
        </shape>
    </item>
    <item>
        <shape>
            <padding
                android:bottom="2dp"
                android:left="2dp"
                android:right="2dp"
                android:top="2dp"/>
            <corners android:radius="15dp"/>
            <solid android:color="@color/border4"/>
        </shape>
    </item>
    <item>
        <shape>
            <padding
                android:bottom="2dp"
                android:left="2dp"
                android:right="2dp"
                android:top="2dp"/>
            <corners android:radius="15dp"/>
            <solid android:color="@color/border5"/>
        </shape>
    </item>

    <!-- Background -->
    <item>
        <shape>
            <solid android:color="@color/menu_bg"/>
            <corners android:radius="15dp"/>
        </shape>
    </item>
</layer-list>

If i use android:background="?attr/selectableItemBackgroundBorderless" for control ripple effect works well. but the problem is, i am having custom background for all my controls, so i can't able to use attr/selectableItemBackgroundBorderless.

How to use attr/selectableItemBackgroundBorderless with custom drawable background ? i don't want wrap the controls with frame layouts or any other layouts.. Is there any other way ?

Awaiting Responses, Thanks in advance


Solution

  • Use foreground function, make clickable and focusable true.

    <Button
       android:layout_width="match_parent"
       android:layout_height="wrap_content"                             
       android:background="@drawable/custom_button_disable_fill"
       android:foreground="?android:attr/selectableItemBackground"
       android:text="Login"
       android:saveEnabled="true"
       android:focusable="true"
       android:textAllCaps="false"
       android:textColor="@color/black_bold_medium"
       android:textSize="@dimen/text_large"
       app:font_name="@string/sourcesanspro_semi_bold"/>