Remove Ripple Effect from CollectionView

Question

How to remove ripple effect from CollectionView selecting item ? Automatically adds a ripple effect when I click on an item This is my code                   

 protected override void OnAppearing()
    {
        base.OnAppearing();
        var t = new List<Test>
        {
            new Test
            {
                Title="Test"
            },
            ...
        };
        testCollection.ItemsSource = t;
    }


           <CollectionViewx:Name="testCollection" SelectionMode="Single" HeightRequest="75"  >
                 <CollectionView.ItemsLayout>
                   <LinearItemsLayout Orientation="Horizontal"  />
                 </CollectionView.ItemsLayout>
                 <CollectionView.ItemTemplate >
                   <DataTemplate  >
                      <Frame >
                        <Frame  CornerRadius="20" WidthRequest="60"  BorderColor="#f1f1f1" Padding="11,0,11,0"   Margin="9,10,0,0" >
                             <StackLayout Orientation="Horizontal" >
                               <Label Margin="5,2,0,0"   Text="{Binding Title}"/>
                              </StackLayout>
                            </Frame>
                         </Frame>
                     </DataTemplate>

                            </CollectionView.ItemTemplate>
                        </CollectionView>

Answer 1

You could implement it by using Custom Renderer

in Forms

Create a cubclass of StackLayout(or Grid, Frame, it's up to you)

public class MyStackLayout:StackLayout
{
}

in Android

Creat a xml file in the folder Resource->drawable my_cell_style.xml

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

using Android.Content;

using Xamarin.Forms.Platform.Android;
using Xamarin.Forms;

using App32;
using App32.Droid;
using Android.Support.V4.Content.Res;

[assembly:ExportRenderer(typeof(MyStackLayout),typeof(MyLayoutRenderer))]

namespace App32.Droid
{
    public class MyLayoutRenderer : ViewRenderer
    {
        public MyLayoutRenderer(Context context) : base(context)
        {
        }

        protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.View> e)
        {
            base.OnElementChanged(e);

            if(e.NewElement!=null)
            {
                this.SetBackground(ResourcesCompat.GetDrawable(Resources, Resource.Drawable.my_cell_style, null));
            }

        }

    }
}

Now in xaml you could use it like

 <CollectionView >

        <CollectionView.ItemTemplate>

            <DataTemplate>

                <local:MyStackLayout>
                    
                    //...put the element here
                    
                </local:MyStackLayout>


            </DataTemplate>

        </CollectionView.ItemTemplate>

    </CollectionView>

Update

It seems that you add a button on the cell ,right ? If so , you need to set Background of Button in Android platform .

in Forms

create a custom button

public class MyButton:Button
{
}

in Android

[assembly: ExportRenderer(typeof(MyButton), typeof(MyButtonRenderer))]
namespace App11.Droid
{
 public class MyButtonRenderer:ButtonRenderer
 {
   public MyButtonRenderer(Context context):base(context)
    {

    }

    protected override void OnElementChanged(ElementChangedEventArgs<Button> e)
    {
        base.OnElementChanged(e);

        if(Control!=null)
        {
            Control.SetBackground(ResourcesCompat.GetDrawable(Resources, Resource.Drawable.my_cell_style, null));
        }

    }
  }
}

in xaml

<local:MyButton Text="xxx" ...   />

Update 2:

Add the following line in Resources -> value ->style.xml

<item name="android:colorControlHighlight">@android:color/transparent</item>