CODEWITHSUNDEEP
javaandroidxmlandroid-layout
Rohan Mishra
Rohan Mishra

Reputation: 31

How to put ripple effect on relative layout in android?

I have created my custom button for my card-view in android using Relative Layout and calling that button via <include layout functionality. Everything is working fine I just want to know put ripple effect on that click how to do that?

Here is my code:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <FrameLayout
        android:layout_width="125dp"
        android:layout_height="30dp"
        android:background="@color/colorPrimary"
        android:layout_gravity="center_horizontal"
        android:focusableInTouchMode="true">


        <TextView
            android:layout_width="125dp"
            android:layout_height="30dp"
            android:fontFamily="@font/questa"
            android:text="Know More"
            android:gravity="center"
            android:textAllCaps="false"
            android:textColor="#ffffff">
        </TextView>

    </FrameLayout>

</RelativeLayout>

Include Layout Code:

<include
                android:id="@+id/btnViewDetails"
                style="@style/CardView.Button"
                layout="@layout/button"
                android:layout_width="125dp"
                android:layout_height="30dp"
                android:layout_below="@+id/viewDivider"
                />

Upvotes: 2

Views: 2027

Answers (4)

tadev
tadev

Reputation: 224

I just use 1 line

android:background="?selectableItemBackground"

Upvotes: 1

Shoaib Khan
Shoaib Khan

Reputation: 31

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="@color/colorPrimaryDark">
    <item android:id="@android:id/mask">
        <shape android:shape="rectangle">
            <solid android:color="@color/colorPrimaryDark" />
            <corners android:radius="@dimen/_4sdp" />
        </shape>
    </item>

<item android:id="@android:id/background">
    <shape android:shape="rectangle">
        <gradient
            android:angle="90"
            android:endColor="@color/blue"
            android:startColor="@color/colorPrimary"
            android:type="linear" />
        <corners android:radius="@dimen/_4sdp" />
    </shape>
</item>

Upvotes: 0

milad salimi
milad salimi

Reputation: 1660

You have to add ripple to your background parent.

suppose that you have a ripple file like this, file name is ripple in drawable :

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="#9D9D9D">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="#9D9D9D" />
            <corners android:radius="20dp" />
        </shape>
    </item>

    <item android:drawable="@drawable/drawable_all_rows" />
</ripple>

*** The first item add effect to your component or button and the second item is state that you didnt click on button.

drawable_all_rows :

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

    <solid android:color="#ffffff" />
    <corners android:radius="20dp" />

</shape>

Then you add this to your relative layout background like this :

Upvotes: 0

milan pithadia
milan pithadia

Reputation: 870

you just add 3 line code in RelativeLayout

android:clickable="true"
android:focusable="true"
android:foreground="?selectableItemBackground"

Upvotes: 2

Related Questions