How to greyout a card in a card view? - android

I have a card view that lists a set of cards dynamically. I have used recyclerview for that. Now I want to disable a card(based on value)by greying out the card or something like that. This is the layout that contains the card view
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.v7.widget.CardView
android:layout_width="112dp"
android:layout_height="140dp"
android:layout_margin="10dp"
android:clickable="true"
android:focusable="true"
android:scaleType="fitXY">
<RelativeLayout
android:layout_width="100dp"
android:layout_height="150dp"
android:padding="8dp">
<ImageView
android:id="#+id/appIcon"
android:layout_width="match_parent"
android:layout_height="62dp"
android:padding="5dp"
tools:ignore="VectorDrawableCompat" />
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/appIcon"
android:layout_centerInParent="true"
android:gravity="center"
android:textAppearance="#style/Base.TextAppearance.AppCompat.Small"
android:textColor="#drawable/selector"
android:textSize="10dp"
android:textStyle="bold" />
<TextView
android:id="#+id/appVersion"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_marginBottom="5dp"
android:layout_marginEnd="1dp"
android:text="version 0.0"
android:textAppearance="#style/Base.TextAppearance.AppCompat.Small"
android:textSize="8dp" />
</RelativeLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
I have found some related queries and have tried out using selectors and greying out each field instead of the entire card.
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_enabled="true" android:color="#color/colorAppName" />
<item android:state_enabled="false" android:color="#color/colorPrimary" />
</selector>
and in my class(Adapter.kt)
name = itemView.findViewById(R.id.name) as TextView
if(value==true)
{
name.isEnabled=false
}
But I want to disable the entire card. Please help

You can set tint to your relative layout which is direct child of card view in your item design. You have to do this in xml:
<android.support.v7.widget.CardView
android:layout_width="112dp"
android:layout_height="140dp"
android:layout_margin="10dp"
android:clickable="true"
android:focusable="true"
android:scaleType="fitXY">
<RelativeLayout
android:id="#+id/relParent"
android:background="#fff"
android:layout_width="100dp"
android:layout_height="150dp"
android:padding="8dp">
....>
I have added two property in RelativeLayout first is id and second is background.
Now in adapter you can do this:
if(value==true)
{
itemView.relParent.background.setColorFilter(Color.parseColor("#6F6F6F"),PorterDuff.Mode.SRC_IN)
itemView.relParent.isEnabled=false
}
else
{
itemView.relParent.background.setColorFilter(Color.parseColor("#FFFFFF"),PorterDuff.Mode.SRC_IN)
itemView.relParent.isEnabled=true
}
Note: You must have to set background to RelativeLayout from xml otherwise itemView.relParent.background will return null and your app will crash.
Update
You need to set forground color to your card you in that case do this:
itemView.cardDashboard.foreground= ColorDrawable(Color.parseColor("#906F6F6F"))
Here cardDashboard is card view which you are using in your item design.
So the final code will be like this:
if(value==true)
{
itemView.cardDashboard.foreground= ColorDrawable(Color.parseColor("#906F6F6F"))
itemView.relParent.isEnabled=false
}
else
{
itemView.cardDashboard.foreground= ColorDrawable(Color.parseColor("#006F6F6F"))
itemView.relParent.isEnabled=true
}

Add android:background="#drawable/selector" to your RelativeLayout or LinearLayout. That will work for enable and disable.
Note:- This is not related to question but if you follow. It will good for you.
We compare if(booleanVariable) directly instead of comparison like
if(booleanVariable==true).

Try setting the following to all the views,
android:duplicateParentState="true"
When this attribute is set to true, the view gets its drawable state (focused, pressed, etc.) from its direct parent rather than from itself.
Then dynamically disable the layout of the item (at a particular position) resulting in disabling all its child views.
Note: Since your cardviews are in a recycler view you need to maintain the state for diffrent positions inside your adapter.
You can maintain the background states using the selectors as you did before.
I changed your layouts by adding the above mentioned attribute:-
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.v7.widget.CardView
android:layout_width="112dp"
android:layout_height="140dp"
android:layout_margin="10dp"
android:id="#+id/cd"
android:scaleType="fitXY">
<RelativeLayout
android:layout_width="100dp"
android:layout_height="150dp"
android:duplicateParentState="true"
android:padding="8dp">
<ImageView
android:id="#+id/appIcon"
android:layout_width="match_parent"
android:layout_height="62dp"
android:padding="5dp"
android:duplicateParentState="true"
tools:ignore="VectorDrawableCompat" />
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:duplicateParentState="true"
android:text="#string/app_name"
android:layout_below="#+id/appIcon"
android:layout_centerInParent="true"
android:gravity="center"
android:onClick="clickMe"
android:textAppearance="#style/Base.TextAppearance.AppCompat.Small"
android:textSize="10dp"
android:textStyle="bold" />
<TextView
android:id="#+id/appVersion"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:duplicateParentState="true"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_marginBottom="5dp"
android:layout_marginEnd="1dp"
android:text="version 0.0"
android:textAppearance="#style/Base.TextAppearance.AppCompat.Small"
android:textSize="8dp" />
</RelativeLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
And have tested with disabling the cardview state, its child views also show the change with their color fading to light grey(haven't used selector for views so it changes to default disabled state (tested for textview)) .But for any clicklistner on the views you will have to use the saved state for the position disabled and not perform task when state is disabled.

Related

Android notification custom layout XML imageview not showing

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="96dp"
android:gravity="center"
android:orientation="horizontal">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center_vertical"
android:orientation="vertical"
android:paddingStart="24dp"
android:paddingBottom="8dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="horizontal">
<ImageView
android:id="#+id/pushIcon"
android:layout_width="16dp"
android:layout_height="16dp"
app:srcCompat="#drawable/push_icon" />
<TextView
android:id="#+id/textView23"
style="#style/TextAppearance.Compat.Notification.Info.Media"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="6dp"
android:text="YOLOL"
android:textColor="#color/browser_actions_title_color" />
</LinearLayout>
<TextView
android:id="#+id/text_view_collapsed_1"
style="#style/TextAppearance.Compat.Notification.Title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:text="New Message!"
android:textColor="#color/colorPrimary" />
<TextView
android:id="#+id/text_view_collapsed_2"
style="#style/TextAppearance.Compat.Notification.Info"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Expand to show!" />
</LinearLayout>
<ImageView
android:id="#+id/notifPreviewImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
app:srcCompat="#drawable/bb" />
</LinearLayout>
The pushIcon ImageView takes the place but is invisible, any idea why?
A quick tip that always helps in the debug process - add a background color to the view in question (also helps to set a specific Width and Height as well for testing) - it will enable you to see if the view is being rendered at all or not. If you see the background color, then the view is being rendered properly, but the image is not loading correctly. Without knowing this, it could be any combination of those issues.
With that aside, if you are dynamically changing the icon at runtime, I would look at your code there. If this is a static image then I would check that your resource file is a Vector drawable as that is only allowed when using app:srcCompat="#drawable/push_icon"
If your file is a non-vector drawable, then use android:src="#drawable/push_icon"
Here's a discussion that elaborates on this in more detail.

Android Layout optimization for ListView of ArrayAdapter: is FrameLayout really useless?

I have created a color catalogue for my app and have decided to use an Array adapter to inflate this catalogue. My color layout is as follows:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:android="http://schemas.android.com/apk/res/android">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="80dp"
android:layout_marginLeft="20dp"
android:layout_marginStart="20dp"
android:layout_marginTop="20dp"
android:layout_marginBottom="20dp"
android:layout_marginRight="40dp"
android:layout_marginEnd="40dp">
<ImageView
android:id="#+id/fav_swatch"
android:layout_width="80dp"
android:layout_height="match_parent"/>
<TextView
android:id="#+id/fav_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/fav_swatch"
android:layout_toEndOf="#+id/fav_swatch"
android:paddingLeft="30dp"
android:paddingStart="30dp"
android:paddingTop="10dp"
android:textSize="20sp"
/>
<TextView
android:id="#+id/fav_coord"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/fav_swatch"
android:layout_toEndOf="#+id/fav_swatch"
android:layout_below="#+id/fav_name"
android:paddingLeft="30dp"
android:paddingStart="30dp"
android:paddingTop="10dp"
android:textSize="20sp"
/>
<ImageButton
android:id="#+id/btn_delete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:layout_marginLeft="10dp"
android:background="#drawable/ic_clear"/>
<ImageButton
android:id="#+id/btn_modify"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#+id/btn_delete"
android:layout_toStartOf="#+id/btn_delete"
android:background="#drawable/ic_edit"/>
</RelativeLayout>
</FrameLayout>
My activity layout:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent">
<android.support.design.widget.FloatingActionButton
android:id="#+id/fav_fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="#dimen/fab_margin" />
<ListView
android:id="#+id/fav_lv"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</ListView>
</FrameLayout>
So this code leads to the desired layout as this:
The problem is that Android warns me
This RelativeLayout or its parent FrameLayout is useless
It is not really useless because if I keep only the RelativeLayout as parent:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="80dp"
android:layout_marginLeft="20dp"
android:layout_marginStart="20dp"
android:layout_marginTop="20dp"
android:layout_marginBottom="20dp"
android:layout_marginRight="40dp"
android:layout_marginEnd="40dp"
xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView
android:id="#+id/fav_swatch"
android:layout_width="80dp"
android:layout_height="match_parent"/>
<TextView
android:id="#+id/fav_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/fav_swatch"
android:layout_toEndOf="#+id/fav_swatch"
android:paddingLeft="30dp"
android:paddingStart="30dp"
android:paddingTop="10dp"
android:textSize="20sp"
/>
<TextView
android:id="#+id/fav_coord"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/fav_swatch"
android:layout_toEndOf="#+id/fav_swatch"
android:layout_below="#+id/fav_name"
android:paddingLeft="30dp"
android:paddingStart="30dp"
android:paddingTop="10dp"
android:textSize="20sp"
/>
<ImageButton
android:id="#+id/btn_delete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:layout_marginLeft="10dp"
android:background="#drawable/ic_clear"/>
<ImageButton
android:id="#+id/btn_modify"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#+id/btn_delete"
android:layout_toStartOf="#+id/btn_delete"
android:background="#drawable/ic_edit"/>
</RelativeLayout>
the margins are simply ignored and I get this sort of ugly layout:
My question is: is there any way to get the right layout without having to put a 'useless' FrameLayout to get a cleaner and more optimized code?
EDIT: the interesting java code:
// Construct the data source
ArrayList<Colour> arrayOfColours = new ArrayList<>();
final ColourAdapter adapter = new ColourAdapter(this, arrayOfColours);
ListView lv = (ListView) findViewById(R.id.fav_lv);
lv.setAdapter(adapter);
final Colour[] colour = new Colour[ca.getMaxNumberOfFavColours()];
for (int i = 0; i < numberOfColours; i++) {
colour[i] = new Colour(colourPixel[i], colourName[i]);
adapter.add(colour[i]);
}
In your scenario FrameLayoutis containing one child element as RelativeLayout. Your all further elements are contained inside RelativeLayout. May be this is reason Android Studio is giving you a warning.
This RelativeLayout or its parent FrameLayout is useless.
I don't understand your point of having RelativeLayout inside FrameLayout. Instead i would also recommend to use either one of them.
Moreover, you can get the same result just by doing this in your second scenario...
removing margin from RelativeLayout.
instead of margin, add android:padding="20dp" in RelativLayout.
Let me know if you have any queries related to this.
I would recommend you to see the diff. in margin and padding and avoid giving margin to outer most container of your layout.
PS: Developers don't give much attention to warnings until they became errors. :p

How to add another ImageView over an existing ImageView dynamically?

I know similar questions have been asked before but I think my case is different.
So I'm trying to make a playlist using a RecyclerView and when a song is selected I want the circular image which holds the Image for the song to change to a tick sign while the original image can be seen faded in the background. I have my tick image ready.
How can I add this image over my existing ImageView dynamically? The putting one image in the background method is not a solution for me because the music image file is loaded dynamically from Realm and thus can't be the background.
The XML code for my RecyclerView items is below:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal" android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:paddingRight="10dp"
android:paddingLeft="30dp"
>
<de.hdodenhof.circleimageview.CircleImageView
android:layout_width="120dp"
android:layout_height="120dp"
android:layout_gravity="start"
android:transitionName="albumArt"
android:id="#+id/album_art"
android:scaleType="centerCrop"
android:src="#color/colorPrimary"/>
<LinearLayout
android:layout_width="fill_parent"
android:gravity="right"
android:paddingLeft="20dp"
android:orientation="vertical"
android:layout_marginTop="20dp"
android:layout_height="wrap_content">
<TextView
android:id="#+id/data"
android:layout_width="match_parent"
android:fontFamily="sans-serif"
android:textColor="#ffffff"
android:text="Music Name"
android:textSize="17sp"
android:layout_height="wrap_content"
/>
<TextView
android:id="#+id/data_album"
android:layout_width="match_parent"
android:fontFamily="sans-serif"
android:textColor="#bfe0e0e0"
android:textSize="14sp"
android:text="Music Artist"
android:layout_height="wrap_content"
/>
</LinearLayout>
How can I do this dynamically from java code? Can this be done using set visibility somehow? If yes, please explain new ways to do this are appreciated as well.
You can make use of FrameLayout here and place both ImageViews inside the FrameLayout and based on condition you can make one of them visible and other invisible
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal" android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:paddingRight="10dp"
android:paddingLeft="30dp"
>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<de.hdodenhof.circleimageview.CircleImageView
android:layout_width="120dp"
android:layout_height="120dp"
android:layout_gravity="start"
android:transitionName="albumArt"
android:id="#+id/album_art"
android:scaleType="centerCrop"
android:src="#color/colorPrimary"/>
<ImageView
android:id="#+id/imageView"
android:layout_width="120dp"
android:layout_height="120dp">
</ImageView>
</FrameLayout>
<LinearLayout
android:layout_width="fill_parent"
android:gravity="right"
android:paddingLeft="20dp"
android:orientation="vertical"
android:layout_marginTop="20dp"
android:layout_height="wrap_content">
<TextView
android:id="#+id/data"
android:layout_width="match_parent"
android:fontFamily="sans-serif"
android:textColor="#ffffff"
android:text="Music Name"
android:textSize="17sp"
android:layout_height="wrap_content"
/>
<TextView
android:id="#+id/data_album"
android:layout_width="match_parent"
android:fontFamily="sans-serif"
android:textColor="#bfe0e0e0"
android:textSize="14sp"
android:text="Music Artist"
android:layout_height="wrap_content"
/>
</LinearLayout>
Yes, it can be done by using set visibility. In your layout file, you will most likely need to use a Relative Layout so you can anchor both image views exactly the same. Then on the view you do not want to initially display, you make it invisible by adding the following:
android:visibility="invisible"
Then later on when you want to toggle the visibility on/off, you can use:
myImageView.setVisibility(View.VISIBLE);
myImageView.setVisibility(View.INVISIBLE);

Compound Drawable as Action in RecyclerView

I have a RecyclerView that implements a linear list of string items.
I want the list item to have a secondary action, 'share', to the right of each item. I created a compound drawable like Google suggested, in XML, but how do I access the drawable and set a OnClickListener() on it? Am I better off just having two elements?
Compound Drawable TextView in my list item layout:
<TextView
android:id="#+id/item"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="#dimen/text_margin"
android:textSize="17sp"
android:layout_marginTop="1dp"
android:background="#101010"
android:drawableRight="#drawable/ic_share_white_24dp"
android:textColor="#fff"
android:textAppearance="?attr/textAppearanceListItem" />
Got some good tips but for my project in particular I found it better management to have two elements. Check out #Vishnuvathsan's answer for this StackOverflow post for the compound drawable.
<TextView
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="#dimen/text_margin"
android:textSize="17sp"
android:layout_marginTop="1dp"
android:background="#101010"
android:textColor="#fff"
android:textAppearance="?attr/textAppearanceListItem" />
<ImageView
android:id="#+id/shareBtn"
android:contentDescription="#string/action_share"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="6dp"
android:src="#drawable/ic_share_white_24dp"
android:background="#101010"
android:layout_centerVertical="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />

RecyclerView item touch to highlight

I am using a RecyclerView and I am not able to see any feedback when I touch on the item of the RecyclerView. How do I achieve it?
I am trying to show a feedback to the user when they are touching the row of RecyclerView. Something like a ripple effect.
I want to know how to achieve it in a specific row of the RecyclerView.
This is the recycler view's custom row layout.
<?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="50dp"
android:id="#+id/drawer_row"
android:background="?android:attr/selectableItemBackground"
android:clickable="true">
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="30dp"
android:layout_marginStart="30dp"
android:layout_toEndOf="#+id/navigation_image"
android:layout_toRightOf="#+id/navigation_image"
android:textSize="17sp" />
<ImageView
android:id="#+id/navigation_image"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:layout_marginLeft="30dp"
android:layout_marginStart="30dp" />
<TextView
android:id="#+id/horizontal_line"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_alignParentBottom="true"
android:background="#F1F1F1" />
</RelativeLayout>
This is the layout of the Activity having the RecyclerView
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/windowBackground">
<RelativeLayout
android:id="#+id/nav_header_container"
android:layout_width="match_parent"
android:layout_height="150dp"
android:layout_alignParentTop="true"
android:background="#drawable/ic_drawer_header">
<ImageView
android:id="#+id/circle_imageview"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:background="#drawable/profile_pic"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp" />
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="John Doe"
android:textSize="20sp"
android:textColor="#ffffff"
android:layout_below="#+id/circle_imageview"
android:layout_alignLeft="#+id/circle_imageview"
android:layout_alignStart="#+id/circle_imageview"
android:layout_marginTop="5dp" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Transaction Technologies"
android:layout_below="#+id/textView"
android:layout_alignLeft="#+id/textView"
android:layout_alignStart="#+id/textView"
android:textColor="#ffffff"
android:layout_marginTop="5dp" />
</RelativeLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/drawerList"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/nav_header_container" />
</RelativeLayout>
I just need to highlight/give feedback of the row which is being touched by the user. How do I achieve it?
Thanks in advance.
You need to add android:focusable="true" in your custom row item for RecyclerView
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="#+id/drawer_row"
android:background="?android:selectableItemBackground"
android:focusable="true"
android:clickable="true" >
</RelativeLayout>
You can add a Ripple effect by using THIS LIBRARY.Include it in your Gradle files using.
compile 'com.thomsonreuters:rippledecoratorview:+'
Simply put your row layout in a RippleDecoratorView.For eg:
<com.thomsonreuters.rippledecoratorview.RippleDecoratorView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_margin="4dp"
rdv:rdv_rippleColor="#android:color/holo_blue_dark"
rdv:rdv_rippleAnimationFrames="60"
rdv:rdv_rippleAnimationPeakFrame="15"
rdv:rdv_rippleMaxAlpha="0.8"
rdv:rdv_rippleAnimationDuration="600"
rdv:rdv_rippleRadius="50dp">
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="#+id/drawer_row"
android:background="?android:attr/selectableItemBackground"
android:clickable="true">
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="30dp"
android:layout_marginStart="30dp"
android:layout_toEndOf="#+id/navigation_image"
android:layout_toRightOf="#+id/navigation_image"
android:textSize="17sp" />
<ImageView
android:id="#+id/navigation_image"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:layout_marginLeft="30dp"
android:layout_marginStart="30dp" />
<TextView
android:id="#+id/horizontal_line"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_alignParentBottom="true"
android:background="#F1F1F1" />
</RelativeLayout>
</com.thomsonreuters.rippledecoratorview.RippleDecoratorView>
Or you can use any of these libs acc to your requirement:
1>https://github.com/balysv/material-ripple
2>https://github.com/siriscac/RippleView
3>https://github.com/traex/RippleEffect
I can help you but I will need some feedback from you as well. In the onCreateVIewHolder inside your recycler View adapter you must have defined textViews and assigned it to the elements inside the sample recycler view. Add this. Make sure you define the layout outside the function so its accessible throughout the class
RelativeLayout layout;
layout=(RelativeLayout)view.findViewById.(R.layout.drawer_row)
Then go to you recycler view adapter and in the onBindViewHolder define
holder.layout.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
// Handle onClick event
}
});
In the onClick event you can add any kind of feedback you want to the user to experience such as starting a new activity, toasts, messages or in this case a ripple effect. You can use a custom library for ripples such as these
Ripple effect for lollipop views
https://android-arsenal.com/details/1/980
https://github.com/balysv/material-ripple
Ripple effects are not supported in pre-Lollipop devices.
Still use this material-ripple
compile 'com.balysv:material-ripple:1.0.2'
Apply ripple on holder.drawView
MaterialRippleLayout.on(holder.drawerView)
.rippleColor(Color.RED)
.create();
Or you can apply from xml
<com.balysv.materialripple.MaterialRippleLayout
android:id="#+id/ripple"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Button inside a ripple"/>
</com.balysv.materialripple.MaterialRippleLayout>

Categories

Resources