WPF ListView 選擇和鼠標移上去行背景顏色的去除與更改

先上對比圖:

原生的ListView列表圖:
在這裏插入圖片描述
去除背景的ListView效果圖: 更換了當前選中項的字體顏色,去除了ListView自帶的背景框和背景顏色
在這裏插入圖片描述
給ListView分別添加鼠標移上去時和選中時的背景顏色和字體顏色效果圖:
在這裏插入圖片描述

下面是ListView的樣式代碼:

        <!-- 設置ListView的綁定數據源和基礎樣式-->
        <ListView ItemsSource="{Binding Data}" Name="listView"     
                              SelectedItem="{Binding SelectedData}"
                              Background="Transparent"
                              VerticalAlignment="Top"
                              BorderThickness="0" Grid.Row="1">

            <!-- 綁定命令,選中項改變時觸發的事件-->
            <i:Interaction.Triggers>
                <i:EventTrigger EventName="SelectionChanged">
                    <i:InvokeCommandAction Command="{Binding ItemChangeCommand}" CommandParameter="10" />
                </i:EventTrigger>
            </i:Interaction.Triggers>

            <ListView.Resources>
                <!-- 重寫ListViewItem樣式-->
                <Style TargetType="{x:Type ListViewItem}">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type ListViewItem}">
                                <Border Name="Bd"
                                        Background="{TemplateBinding Background}"
                                        BorderBrush="{TemplateBinding BorderBrush}"
                                        BorderThickness="{TemplateBinding BorderThickness}"
                                        Padding="{TemplateBinding Padding}"
                                        SnapsToDevicePixels="true">
                                    <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                                      VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                                      SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                                </Border>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
                    <Setter Property="Cursor" Value="Hand"/>
                    <Setter Property="BorderThickness" Value="0"/>
                    <Setter Property="Foreground" Value="Black"/>
                    <Setter Property="Background" Value="Transparent"/>
                    <Setter Property="VerticalAlignment" Value="Top"/>
                    <Setter Property="FontSize" Value="14"/>
                    <Style.Triggers>
                        <!--觸發器-->
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter Property="Background" Value="Orange"/>
                            <Setter Property="BorderBrush" Value="Red"/>
                        </Trigger>
                        <Trigger Property="IsSelected" Value="true">
                            <Setter Property="Background" Value="Blue"/>
                            <Setter Property="Foreground" Value="#096fc8"/>
                        </Trigger>
                    </Style.Triggers>
                </Style>
            </ListView.Resources>
            <ListView.ItemTemplate>
                <DataTemplate>
                    <Grid FocusVisualStyle="{x:Null}">
                        <TextBlock>
                            <TextBlock.Style>
                                <Style TargetType="{x:Type TextBlock}">
                                    <Setter Property="Margin" Value="0,8,0,0"/>
                                    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
                                    <!--綁定每項顯示的內容-->
                                    <Setter Property="Text" Value="{Binding value}"/>
                                    <Style.Triggers>
                                        <Trigger Property="IsMouseOver" Value="True">
                                            <Setter Property="Foreground" Value="#096fc8"></Setter>
                                        </Trigger>
                                    </Style.Triggers>
                                </Style>
                            </TextBlock.Style>
                        </TextBlock>
                    </Grid>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>

源碼:放在CSDN下載了
點擊這裏下載源碼

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章