【WPF】图片按钮的单击与双击事件

需求：ListBox中的Item是按钮图片，要求单击和双击时触发不同的事件。

 

XAML中需要引入System.Windows.Interactivity.dll

xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"

该ListBox的关键代码如下。

<ListBox ItemsSource="{Binding YourList}">
    <ListBox.Template>
        <!-- 流式布局 左对齐 -->
        <ControlTemplate TargetType="ListBox">
            <WrapPanel Width="{Binding RelativeSource={RelativeSource AncestorType=UserControl},Path=DataContext.YourWidth}" Orientation="Horizontal" IsItemsHost="True"/>
        </ControlTemplate>
    </ListBox.Template>
    <ListBox.ItemTemplate>
        <DataTemplate>
            <Grid>
                <!-- 单击事件，传参Button自身 -->
                <Button Width="160" Height="120" Background="Transparent" BorderBrush="#E12080" BorderThickness="1"
                        Command="{Binding RelativeSource={RelativeSource AncestorType=UserControl},Path=DataContext.YourClickCommand}"
                        CommandParameter="{Binding RelativeSource={x:Static RelativeSource.Self}}" BorderBrush="#E12080" BorderThickness="1">
                    <!-- 双击事件，传参父节点的Button -->
                    <i:Interaction.Triggers>
                        <i:EventTrigger EventName="MouseDoubleClick">
                            <i:InvokeCommandAction 
                                Command="{Binding RelativeSource={RelativeSource AncestorType=UserControl},Path=DataContext.YourDoubleClickCommand}"
                                CommandParameter="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorLevel=1, AncestorType={x:Type Button}}}"/>
                        </i:EventTrigger>
                    </i:Interaction.Triggers>
                    <Grid>
                        <!-- ListBoxItem的内容 -->
                        
                    </Grid>
                </Button>
            </Grid>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>