Listbox datatemplate - 只能通过单击子元素来选择项目,而不仅仅是项目上的任何位置

时间:2010-08-22 22:59:03

标签: wpf listbox hover selection

我有一个列表框,其中包含项目的datatemplate。 问题是只需单击项目的任何位置即可选择项目。我必须点击一个特定的子元素才能实际工作。

我的项目有图像和文本块。 如果我将鼠标悬停在图像或文本块上,我实际上会看到悬停效果。 如果我将鼠标悬停在项目的任何“空”空间上,则没有悬停效果(当我点击那里时没有选择)。

示例图片:http://i33.tinypic.com/wvtleg.png

如果我点击(或悬停)实际文字或图片,它可以正常工作, 但如果我将鼠标悬停在空白区域(我在它周围画了一条红线:))列表框没有响应。

如何让列表框悬停/点击以响应在项目空间中点击任何位置

为了完整性,这里是我的列表框+模板:

<ListBox Grid.Row="1"
  ItemsSource="{Binding Path=CreatableOutputWindows, Mode=OneWay}" Height="Auto"
  HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
  Margin="8,8,8,8"
  Name="listBox1" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch">
  <ListBox.ItemTemplate>
    <DataTemplate>
      <Grid>
        <Grid.ColumnDefinitions>
          <ColumnDefinition Width="84"/>
          <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Border Margin="5" BorderBrush="Black" BorderThickness="2">
          <Image Source="{Binding Path=Image}" Stretch="Fill" Width="80" Height="50" />
        </Border>
        <StackPanel Grid.Column="1" Margin="5">
          <StackPanel Orientation="Horizontal" TextBlock.FontWeight="Bold">
            <TextBlock Text="{Binding Path=Name}" />
          </StackPanel>
        </StackPanel>
      </Grid>
    </DataTemplate>
  </ListBox.ItemTemplate>
</ListBox>

2 个答案:

答案 0 :(得分:13)

听起来你的ListBoxItem没有响应hit testing。尝试将网格背景设置为透明:

<Grid Background="Transparent">

默认值为null,这将使元素不可见以进行测试。将背景设置为透明不会影响显示,但会允许元素被点击。 ListBoxItem的默认样式将具有透明背景,但您可能已重新设置它。

答案 1 :(得分:8)

正如Quartermeister指出的那样 - 您需要设置网格的背景 - 但您还需要在资源中设置以下样式,因为ListBoxItems的Horizo​​ntalContentAlignment默认设置为Left。 (仅在ListBox上设置它是不够的)

<ListBox.Resources>
    <Style TargetType="{x:Type ListBoxItem}">
        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
    </Style>
</ListBox.Resources>