WPF listview 使用 ListView Item 中的按钮更改可观察的集合属性

WPF listview change observable collection properties with button inside ListView Item

我正在使用 XAML 中绑定到 Observable 集合的 WPF 列表视图。下面是我的列表视图项目模板,它生成的视图类似于

ListView Item looks like this

<DataTemplate x:Key="ImageOverlayAlbumDataTemplate">
  <Grid>
      <Grid Margin="5,5,5,5">
        <Border BorderBrush="LightGray" BorderThickness="1">
        <StackPanel  Orientation="Vertical" Background="White" Height="50" Width="240" VerticalAlignment="Center">
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="Auto" />
                                    <ColumnDefinition  />
                                    <ColumnDefinition Width="Auto" />
                                </Grid.ColumnDefinitions>
                                <Grid.RowDefinitions>
                                    <RowDefinition />
                                    <RowDefinition  />
                                    <RowDefinition  />
                                </Grid.RowDefinitions>

                            <Border Name="ActionStatusIndicator" Height="50" Width="7" Margin="0" Grid.RowSpan="2">
                                <Border.Style>
                                    <Style TargetType="{x:Type Border}">
                                        <Style.Triggers>
                                            <DataTrigger Binding="{Binding Path=statusid}" Value="3">
                                                <Setter Property="Background" Value="SteelBlue"/>
                                            </DataTrigger>
                                                <DataTrigger Binding="{Binding Path=statusid}" Value="4">
                                                <Setter Property="Background" Value="LightGray"/>
                                            </DataTrigger>
                                                <DataTrigger Binding="{Binding Path=statusid}" Value="5">
                                                <Setter Property="Background" Value="Orange"/>
                                            </DataTrigger>
                                                <DataTrigger Binding="{Binding Path=statusid}" Value="6">
                                                <Setter Property="Background" Value="Red"/>
                                            </DataTrigger>
                                        </Style.Triggers>
                                    </Style>
                                </Border.Style>

                            </Border>
                            <!--</StackPanel>-->
                                <TextBlock  Text="{Binding subject}" Margin="10,0,0,0" Width="230" Height="20" FontSize="13"
                                    TextTrimming="CharacterEllipsis"  HorizontalAlignment="Left" TextAlignment="Left"
                                            Grid.Row="0" Grid.Column="1"/>

                                <TextBlock Text="{Binding Path=displayname}" FontSize="10" Margin="10,3,0,0" Width="110" Height="20" 
                                TextTrimming="CharacterEllipsis"  HorizontalAlignment="Left" TextAlignment="Left"
                                           Grid.Row="1" Grid.Column="1"/>

                                <Image x:Name="sideButton" Source="/Icons/action.png" Width="20" Height="20"  Grid.Row="1" Grid.Column="1" HorizontalAlignment="Right" >
                                    <Image.Style>
                                        <Style TargetType="{x:Type Image}">
                                            <Setter Property="Visibility" Value="Hidden" />
                                            <Style.Triggers>
                                                <DataTrigger Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type ListViewItem}},Path=IsMouseOver}" Value="True">
                                                     <Setter Property="Visibility" Value="Visible" />
                                                </DataTrigger>

                                                <MultiDataTrigger>
                                                    <MultiDataTrigger.Conditions>
                                                        <Condition Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type ListViewItem}},Path=IsMouseOver}" Value="True" />
                                                        <Condition Binding="{Binding Path=StatusID}" Value="3" />

                                                    </MultiDataTrigger.Conditions>
                                                    <Setter Property="Visibility" Value="Visible" />
                                                </MultiDataTrigger>

                                            </Style.Triggers>
                                        </Style>
                                    </Image.Style>
                                </Image>

                            </Grid>

                    </StackPanel>
                    </Border>

              </Grid>
            </Grid>
        </DataTemplate>

我想在用户单击鼠标悬停时出现的图像(打勾)时将 'StatusId' 更改为其他数字。

StatusID 存在于 ActionView Class 中,因为 int 和上面的列表绑定到

将您的图像元素更改为您重新模板化以显示为图像的按钮:

   <Button Width="20" Height="20" Grid.Row="1" Grid.Column="1" HorizontalAlignment="Right" 
Command={Binding Path=ChangeStatusCommand}>
        <Button.Template>
            <ControlTemplate>
                <Image x:Name="sideButton" Source="/Icons/action.png"    >
...

您可能想将触发器移到模板或按钮中...

并且您需要在拥有 StatusID 的同一个对象中创建一个 ICommand(或实现它的东西)(或者您也可以在其他地方创建它,但是在那个地方您需要有一个引用具有 StatusID 的对象) 现在您可以编写 C# 代码来在推送图像时更改 StatusID。 您还需要确保 StatusID 属性 使用 INotifyPropertyChange 事件来提醒 XAML 进行更新。