在鼠标悬停的列表视图内更改堆栈面板的可见性

时间:2018-08-17 18:13:55

标签: wpf

下面是我的列表视图

 <ListView Grid.Column="0" Grid.Row="2" BorderThickness="0" ItemTemplate="{StaticResource ListViewDataTemplate}" x:Name="NewTasks" 
              SelectedItem="{Binding SelectedTask}"/>

我的列表视图的数据模板

 <DataTemplate x:Key="ListViewDataTemplate">
        <StackPanel Style="{StaticResource ListViewStackPanel}">
            <StackPanel Orientation="Horizontal" HorizontalAlignment="Right" Name="UserActions">
                <Image Source="\Images\Edit.png" Height="30" Width="30" cal:Message.Attach="[Event MouseUp] = [Action EditTask]"/>
                <Image Source="\Images\Delete.png" Height="15" Width="15" cal:Message.Attach="[Event MouseUp] = [Action DeleteTask]"/>
            </StackPanel>
            <TextBlock Text="{Binding Name}" Margin="5" FontSize="20" FontWeight="SemiBold"/>
            <TextBlock Text="{Binding Description}" Margin="5" TextWrapping="Wrap"/>
        </StackPanel>
    </DataTemplate>

在列表视图中触发我的堆栈面板

<Style TargetType="StackPanel" x:Key="ListViewStackPanel">
        <Style.Triggers>
            <DataTrigger Binding="{Binding Priority}" Value="Low">
                <Setter Property="Background" Value="#cccedb" />
                <Setter Property="TextBlock.Foreground" Value="#083045"/>
            </DataTrigger>
            <DataTrigger Binding="{Binding Priority}" Value="Medium">
                <Setter Property="Background" Value="#fbbf79" />
                <Setter Property="TextBlock.Foreground" Value="#373c3e"/>
            </DataTrigger>
            <DataTrigger Binding="{Binding Priority}" Value="High">
                <Setter Property="Background" Value="#cd5849" />
                <Setter Property="TextBlock.Foreground" Value="White"/>
            </DataTrigger>
        </Style.Triggers>
    </Style>

当鼠标悬停在列表视图中的某个项目上时,我要显示该项目的用户操作。

1 个答案:

答案 0 :(得分:0)

Trigger添加到您的DataTemplate中以达到您的要求。

<DataTemplate x:Key="ListViewDataTemplate">
    <StackPanel Style="{StaticResource ListViewStackPanel}">
        <StackPanel Orientation="Horizontal" HorizontalAlignment="Right" Name="UserActions" Visibility="Collapsed">
            <Image Source="\Images\Edit.png" Height="30" Width="30" cal:Message.Attach="[Event MouseUp] = [Action EditTask]"/>
            <Image Source="\Images\Delete.png" Height="15" Width="15" cal:Message.Attach="[Event MouseUp] = [Action DeleteTask]"/>
        </StackPanel>
        <TextBlock Text="{Binding Name}" Margin="5" FontSize="20" FontWeight="SemiBold"/>
        <TextBlock Text="{Binding Description}" Margin="5" TextWrapping="Wrap"/>
    </StackPanel>
    <DataTemplate.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter TargetName="UserActions" Property="Visibility" Value="Visible" />
        </Trigger>
    </DataTemplate.Triggers>
</DataTemplate>

我的代码

<Window x:Class="WpfApp1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        mc:Ignorable="d"
        Title="MainWindow" Height="600" Width="600">
    <Window.Resources>
        <Style TargetType="StackPanel" x:Key="ListViewStackPanel">
            <Style.Triggers>
                <DataTrigger Binding="{Binding Priority}" Value="Low">
                    <Setter Property="Background" Value="#cccedb" />
                    <Setter Property="TextBlock.Foreground" Value="#083045"/>
                </DataTrigger>
                <DataTrigger Binding="{Binding Priority}" Value="Medium">
                    <Setter Property="Background" Value="#fbbf79" />
                    <Setter Property="TextBlock.Foreground" Value="#373c3e"/>
                </DataTrigger>
                <DataTrigger Binding="{Binding Priority}" Value="High">
                    <Setter Property="Background" Value="#cd5849" />
                    <Setter Property="TextBlock.Foreground" Value="White"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>

        <DataTemplate x:Key="ListViewDataTemplate">
            <StackPanel Style="{StaticResource ListViewStackPanel}">
                <StackPanel Orientation="Horizontal" HorizontalAlignment="Right" Name="UserActions" Visibility="Collapsed">
                    <Image Source="\Images\Edit.png" Height="30" Width="30"  />
                    <Image Source="\Images\Delete.png" Height="15" Width="15" />
                </StackPanel>
                <TextBlock Text="{Binding Name}" Margin="5" FontSize="20" FontWeight="SemiBold"/>
                <TextBlock Text="{Binding Description}" Margin="5" TextWrapping="Wrap"/>
            </StackPanel>
            <DataTemplate.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter TargetName="UserActions" Property="Visibility" Value="Visible" />
                </Trigger>
            </DataTemplate.Triggers>
        </DataTemplate>
    </Window.Resources>
    <ListView Grid.Column="0" Grid.Row="2" BorderThickness="0" ItemTemplate="{StaticResource ListViewDataTemplate}" x:Name="NewTasks" 
              SelectedItem="{Binding SelectedTask}"/>
</Window>