Question

我有一些包含一些项目的列表视图。我还有两个按钮，添加和删除。我已经实现了拖放功能，以便将单个listviewitem从listview拖到删除按钮，然后在删除按钮下拉，删除listview项。

当列表视图项从列表视图拖动到删除按钮并且鼠标在按钮上时（在拖放操作期间和按下按钮之前）我想要更改按钮图像。如果我在IsMouseOver属性上的按钮上创建数据触发器，它正在工作，但我只想在拖放操作（放弃之前）鼠标悬停在删除按钮上时更改按钮图像。我怎么能这样做？

<Button  AllowDrop="True" Drop="btnDrop_Drop" Height="64" Width="64" Margin="10" Click="Button_Click_Delete" Content="Delete">
    <Button.Template>
        <ControlTemplate>
            <StackPanel>
                <Image x:Name="image1" Visibility="Visible" Height="36" Width="36" Stretch="UniformToFill" Source="Resources/icons8-Trash Can-48.png"/>
                <Image x:Name="image2" Visibility="Collapsed" Height="36" Width="36" Stretch="UniformToFill" Source="Resources/icons8-Trash Can-48-3.png"/>
                <Label HorizontalAlignment="Center">Delete</Label>
            </StackPanel>

            <ControlTemplate.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter TargetName="image1" Property="Visibility" Value="Collapsed" />
                    <Setter TargetName="image2" Property="Visibility" Value="Visible" />
                </Trigger>
            </ControlTemplate.Triggers>
        </ControlTemplate>
    </Button.Template>
</Button>

Answer 1

您可以使用EventTriggers来处理Drop Target Events。

<ControlTemplate>
    <StackPanel>
        <Image x:Name="image1" Opacity="1" ... />
        <Image x:Name="image2" Opacity="0" ... />
        ...
    </StackPanel>
    <ControlTemplate.Resources>

        <Style TargetType="{x:Type Image}">
            <Style.Triggers>
                <Trigger Property="Opacity" Value="0">
                    <Setter Property="Visibility" Value="Collapsed"/>
                </Trigger>
            </Style.Triggers>
        </Style>

        <Storyboard x:Key="swapImages" TargetProperty="Opacity">
            <DoubleAnimation Storyboard.TargetName="image1" To="0" Duration="0" />
            <DoubleAnimation Storyboard.TargetName="image2" To="1" Duration="0"/>
        </Storyboard>

        <Storyboard x:Key="resetImages" TargetProperty="Opacity">
            <DoubleAnimation Storyboard.TargetName="image1" To="1" Duration="0" />
            <DoubleAnimation Storyboard.TargetName="image2" To="0" Duration="0"/>
        </Storyboard>

    </ControlTemplate.Resources>
    <ControlTemplate.Triggers>

        <EventTrigger RoutedEvent="DragOver">
            <BeginStoryboard Storyboard="{StaticResource swapImages}"/>
        </EventTrigger>

        <EventTrigger RoutedEvent="DragLeave">
            <BeginStoryboard Storyboard="{StaticResource resetImages}"/>
        </EventTrigger>

        <EventTrigger RoutedEvent="Drop">
            <BeginStoryboard Storyboard="{StaticResource resetImages}"/>
        </EventTrigger>

    </ControlTemplate.Triggers>
</ControlTemplate>

通过Opacity代替Visibility。
在Storyboard中定义Resources时，它们在xaml文件中的位置非常重要。应首先定义Resources（在使用Triggers之前），否则初始化将失败。

拖放操作期间鼠标悬停时更改按钮图像

1 个答案: