如何使用wrappanel处理选择事件

Question

我目前正在使用C#WPF项目,我在几行中显示图像(蓝头)

问题是我无法选择任何这些项目,我使用MVVM模式,因此后面的代码必须尽可能轻,我必须在xaml文件中执行操作.

所以我希望能够通过点击它们来选择图像,我试图使用像"IsMouseOver"这样的事件,但我只能改变整个包装而不是单个项目.

这是我使用的代码:

<Grid Grid.Row="1" Height="Auto">
        <Grid.Background>
            <LinearGradientBrush>
                <LinearGradientBrush.GradientStops>
                    <GradientStop Color="#252525" />
                </LinearGradientBrush.GradientStops>
            </LinearGradientBrush>
        </Grid.Background>
        <ItemsControl Background="Transparent" Foreground="AntiqueWhite" BorderBrush="Transparent"
                 HorizontalContentAlignment="Stretch" ItemsSource="{Binding Source={x:Static Context:Session.CurrentSession}, Path=CurrentProject.Models}">
            <ItemsControl.ContextMenu>
                <ContextMenu>
                    <MenuItem Header="Delete" Command="{Binding DeleteModel3DCommand}" CommandParameter="{Binding RelativeSource={RelativeSource AncestorType=ContextMenu}, Path=PlacementTarget.SelectedItem}"/>
                </ContextMenu>                    
            </ItemsControl.ContextMenu>
            <i:Interaction.Triggers>
                <i:EventTrigger EventName="SelectionChanged">
                    <i:InvokeCommandAction Command="{Binding SelectModel3DCommand}" CommandParameter="{Binding Path=SelectedItem, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ListBox}}"/>
                </i:EventTrigger>
            </i:Interaction.Triggers>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Image Source="/McKineap;component/Resources/Images/logo-mckineap.png" Height="100"/>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapPanel/>   
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
        </ItemsControl>
    </Grid>

我会就你在我的报道中定义选择事件的正确方法提出任何建议,谢谢你的时间!

Answer 1

ItemsControl这些项目并不是可选择的,这就是为什么选择事件和选择功能缺失的原因,更具体地说ItemsControl,不是从Selector允许这样做的类继承,另一方面ListBox也是ListView如此.

ItemsControl将a 更改为a ListView,您应该能够实现选择:

 <ListView SelectionMode="Single" Background="Transparent" Foreground="AntiqueWhite" BorderBrush="Transparent"
             HorizontalContentAlignment="Stretch" ItemsSource="{Binding Items}">

编辑时 不要忘记ListView在顺序中禁用Horizo​​ntalScrollBar以WrapPanel使其工作

<Grid Grid.Row="1" Height="Auto">
    <Grid.Background>
        <LinearGradientBrush>
            <LinearGradientBrush.GradientStops>
                <GradientStop Color="#252525" />
            </LinearGradientBrush.GradientStops>
        </LinearGradientBrush>
    </Grid.Background>
    <ListView SelectionMode="Single" ScrollViewer.HorizontalScrollBarVisibility="Disabled" Background="Transparent" Foreground="AntiqueWhite" BorderBrush="Transparent"
             HorizontalContentAlignment="Stretch" ItemsSource="{Binding Items}">
        <ListView.ContextMenu>
            <ContextMenu>
                <MenuItem Header="Delete" Command="{Binding DeleteModel3DCommand}" CommandParameter="{Binding RelativeSource={RelativeSource AncestorType=ContextMenu}, Path=PlacementTarget.SelectedItem}"/>
            </ContextMenu>
        </ListView.ContextMenu>
        <i:Interaction.Triggers>
            <i:EventTrigger EventName="SelectionChanged">
                <i:InvokeCommandAction Command="{Binding SelectModel3DCommand}" CommandParameter="{Binding Path=SelectedItem, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ListBox}}"/>
            </i:EventTrigger>
        </i:Interaction.Triggers>
        <ListView.ItemTemplate>
            <DataTemplate>
                <Image Source="refresh.png" Height="100"/>
            </DataTemplate>
        </ListView.ItemTemplate>
        <ListView.ItemsPanel>
            <ItemsPanelTemplate>
                <WrapPanel/>
            </ItemsPanelTemplate>
        </ListView.ItemsPanel>
    </ListView>
</Grid>