首页 > 解决方案 > 如何清除 Xamarin.WPF 中 ListView 的悬停和选择样式

问题描述

这是 XAML:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:d="http://xamarin.com/schemas/2014/forms/design"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"             
             mc:Ignorable="d"
             x:Class="App1.MainPage">

    <ListView ItemsSource="{Binding TestList}" SeparatorVisibility="None" HasUnevenRows="True">
        <ListView.ItemTemplate>
            <DataTemplate>
                <ViewCell>
                    <ViewCell.View>
                        <ContentView>
                            <Label Text="{Binding TestName}"></Label>
                        </ContentView>
                    </ViewCell.View>
                </ViewCell>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</ContentPage>

这是代码隐藏:

using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;

namespace App1
{
    // Learn more about making custom code visible in the Xamarin.Forms previewer
    // by visiting https://aka.ms/xamarinforms-previewer
    [DesignTimeVisible(false)]
    public partial class MainPage : ContentPage
    {
        public MainPage()
        {
            InitializeComponent();
            this.BindingContext = this;
            TestList.Add(new Test() { TestName = "aaa" });
            TestList.Add(new Test() { TestName = "bbb" });
            TestList.Add(new Test() { TestName = "ccc" });
            TestList.Add(new Test() { TestName = "ddd" });
        }
        public ObservableCollection<Test> TestList { get; set; } = new ObservableCollection<Test>();
        public class Test { 
            public string TestName { get; set; }
        }
    }
}

上面的项目将在 android 和 WPF 中跨平台运行。

在android中: 当项目悬停时,没有任何样式为true。 选择项目后,它会将颜色变为橙色,我可以通过更改标签的背景来更改它。
在此处输入图像描述


好吧,在WPF中: 选择或悬停在项目时,它将显示一个我不需要的蓝色矩形。
在此处输入图像描述

我不想在 WPF 中选择或悬停项目时显示蓝色矩形,这就是我问这个问题的原因。

我可能知道我应该在 WPF 程序中设置一些属性,而我不知道应该设置哪个属性。

你能帮帮我吗?谢谢你。

标签: wpfxamarinxamarin.forms

解决方案


您可以尝试使用自定义渲染器来实现此效果。

在您的 WPF 项目中定义ListViewItem样式:App.xaml

<Application.Resources>
    <Style x:Key="LvItemStyle" TargetType="ListViewItem">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ListViewItem">
                    <Border x:Name="border" Background="Transparent">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Normal" />
                                <VisualState x:Name="Disabled" />
                            </VisualStateGroup>
                            <VisualStateGroup x:Name="SelectionStates">
                                <VisualState x:Name="Unselected" />
                                <VisualState x:Name="Selected">
                                    <Storyboard>
                                        <ColorAnimationUsingKeyFrames Storyboard.TargetName="border"
                                                          Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
                                            <EasingColorKeyFrame KeyTime="0" Value="LightBlue" />
                                        </ColorAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="SelectedUnfocused">
                                    <Storyboard>
                                        <ColorAnimationUsingKeyFrames Storyboard.TargetName="border"
                                                          Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
                                            <EasingColorKeyFrame KeyTime="0" Value="SkyBlue" />
                                        </ColorAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <ContentPresenter/>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Application.Resources>

然后在 Wpf 项目中创建自定义渲染器,MyListView.cs

using System.Windows.Controls;
using WpfApp1;
using Xamarin.Forms.Platform.WPF;

[assembly: ExportRenderer(typeof(Xamarin.Forms.ListView), typeof(MyListView))]
namespace WpfApp1
{
   class MyListView:ListViewRenderer
   {
      protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.ListView> e)
      {
          base.OnElementChanged(e);
          foreach (var item in Control.Children)
           {
            if (item is ListView)
             {
                var list = item as ListView;
                list.ItemContainerStyle = App.Current.Resources["LvItemStyle"] as System.Windows.Style;
             }
           }
      }

  }
}

推荐阅读