DataTemplate中Xamarin.Forms CollectionView的“项目”背后关于背景色是什么?

问题描述

我有一个带有圆角的框架作为我的DataTemplate的最外面的容器...,但是我选择的项仍突出显示框架“后面”的背景...请参阅:

Example of selected item background color

我假设我应该在visualstatemanager添加一个setter,但是我应该针对哪些元素进行更改?

以下是“视图”的摘要

public class MyView : ContentPage
{
    public MyView()
    {
        var mainStackLayout = new StackLayout();
        Content = mainStackLayout;
        
        var cv = new CollectionView
        {
            ItemSizingStrategy = ItemSizingStrategy.MeasureFirstItem,VerticalOptions = Layoutoptions.FillAndExpand,SelectionMode = SelectionMode.Multiple,ItemsLayout = new LinearItemsLayout(ItemsLayoutOrientation.Vertical) { ItemSpacing = 8 }
            
        };
        cv.SetBinding(CollectionView.ItemsSourceProperty,"MyList"); 
        cv.SetBinding(CollectionView.SelectedItemsProperty,"MySelectedItems"); 
        cv.SetBinding(CollectionView.SelectionChangedCommandProperty,"MySelectionChangedCommand"); 

        cv.ItemTemplate = new DataTemplate(() =>
        {
            BackgroundColor = Color.HotPink; //Does nothing...?

            var outterFrame = new Frame() 
            { 
                IsClippedToBounds = true,CornerRadius = 25,Padding = 0,Margin = new Thickness(3),BorderColor = Color.Gray
            };
            
            
            var vsg = new VisualStateGroup() { Name = "vsg" };
            var vsnormal = new VisualState { Name = "normal" };
            var vsSelected = new VisualState { Name = "Selected" };
            vsnormal.Setters.Add(new Setter
            {
                Property = Frame.BackgroundColorProperty,Value = Color.White
            });
            vsSelected.Setters.Add(new Setter
            {
                Property = Frame.BackgroundColorProperty,Value = Color.LightBlue
            });
            
            ////////////////////////////////////////////////////////////////////////
            ////////////////////////////////////////////////////////////////////////
            // I assume I need to add another setter here.... but what's the target?    
            //  
            //vsSelected.Setters.Add(new Setter
            //{
            //    Property = _________.BackgroundColorProperty,//    Value = Color.Transparent
            //});               
            //
            ////////////////////////////////////////////////////////////////////////
            ////////////////////////////////////////////////////////////////////////
            
            vsg.States.Add(vsnormal);
            vsg.States.Add(vsSelected);
            visualstatemanager.GetVisualStateGroups(fOutter).Add(vsg);

            var grid = new Grid
            {
                HorizontalOptions = Layoutoptions.FillAndExpand,Margin = new Thickness(0),RowSpacing = 0
            };

            grid.RowDeFinitions.Add(new RowDeFinition { blah,blah,blah...  });
            grid.RowDeFinitions.Add(new RowDeFinition { blah,blah...  });
            grid.ColumnDeFinitions.Add(new ColumnDeFinition { blah,blah...   });
            grid.ColumnDeFinitions.Add(new ColumnDeFinition { blah,blah...   });

            var icon = new Image{ blah,blah... };
            var moreStuffForTheItem = blah,blah...
            
            outterFrame.Content = grid;             
            return outterFrame;

        });  //end cv.ItemTemplate 

        mainStackLayout.Children.Add(cv);
    }
}

解决方法

您可以尝试将默认选择的高光颜色设置为透明。

对于Android,在android项目中,以主题样式(cloneDeep())添加以下代码

Resources/values/styles

对于ios,您需要创建一个自定义的viewcell渲染器。

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