将 ListBoxItem IsSelected 触发器传播到子控件

Propagate ListBoxItem IsSelected trigger to child control(将 ListBoxItem IsSelected 触发器传播到子控件)

问题描述

我正在开发一个带有自可拆卸 ListBoxItem 的 CheckedListBox.问题是只有当用户点击 CheckBox 区域时才会检查项目，这有点尴尬.

I'm developing a CheckedListBox with self removable ListBoxItems. The problem is that an item only gets checked if the user clicks on the CheckBox area, which is kind of awkward.

如何创建 ListBoxItem 触发器 (IsSelected) 以检查DataSourced"ListBox 上的复选框?例如:

How do I create ListBoxItem triggers (IsSelected) to check the checkboxes on a "DataSourced" ListBox? Eg:

以下是我的控件(为简洁起见，所有其他代码均已省略):

Below is my control (all other code have been omitted for brevity):

<ListBox x:Name="executors" ItemsSource="{Binding Executors}" HorizontalAlignment="Left" Height="121" Margin="23,19,0,0" VerticalAlignment="Top" Width="362">
    <ListBox.ItemContainerStyle>
        <Style TargetType="ListBoxItem">
            <Setter Property="Height" Value="30" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ListBoxItem">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition />
                                <ColumnDefinition Width="30" />
                            </Grid.ColumnDefinitions>
                            <CheckBox Margin="4,8" IsChecked="{Binding Enabled}">
                                <ContentPresenter Content="{Binding Description}">

                                </ContentPresenter>
                            </CheckBox>
                            <Button Command="{Binding DataContext.RemoveExecutorCommand, ElementName=executors}" CommandParameter="{Binding}" Background="White" Height="22" Width="22" Grid.Column="1">
                                <Image Source="trash.png" Stretch="Fill" Width="14" Height="14" />
                            </Button>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </ListBox.ItemContainerStyle>
</ListBox>

Executors 是 Executor 的 ObservableCollection，其中 Enabled 和 Description 作为成员.

Executors is a ObservableCollection of Executor which has Enabled and Description as members.

推荐答案

为了给遇到同样问题的人提供进一步的参考，这里有一个我已经完成的工作片段.我在任何地方都找不到任何工作样本，所以这可能很有用.

For further reference for those who come across this same question, here's a working snippet I have done. I couldn't find any working sample anywhere, so this might be of much use.

这里的主要思想是将选择事件传播到 CheckBoxes，这听起来工作量太大，或者简单地将 CheckBox 选择区域扩展到适合 ListBoxItem.

The main idea here was to either propagate the selection event to the CheckBoxes, which sounds too much of a work, or to simple extend the CheckBox selection area to fit the ListBoxItem.

下面是如何实现第二个选项的示例:

Below is a sample on how to achieve the second option:

<ListBox x:Name="executors" ItemsSource="{Binding Executors}" HorizontalAlignment="Left" Height="121" Margin="23,19,0,0" VerticalAlignment="Top" Width="362" ScrollViewer.VerticalScrollBarVisibility="Visible">
    <ListBox.ItemContainerStyle>
        <Style TargetType="ListBoxItem">
            <Setter Property="Height" Value="30"/>
            <Setter Property="VerticalContentAlignment" Value="Stretch"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ListBoxItem">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="9*"/>
                                <ColumnDefinition Width="1*" />
                            </Grid.ColumnDefinitions>
                            <CheckBox Content="{Binding Description}" IsChecked="{Binding Enabled}" VerticalContentAlignment="Center" Margin="4,0"/>
                            <Button Command="{Binding DataContext.RemoveExecutorCommand, ElementName=executors}" CommandParameter="{Binding}" Width="21" Height="21" Background="White" Grid.Column="1">
                                <Image Source="trash.png" Stretch="Fill" Width="14" Height="14" />
                            </Button>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </ListBox.ItemContainerStyle>
</ListBox>

这应该产生以下内容:

这篇关于将 ListBoxItem IsSelected 触发器传播到子控件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！