如何隐藏 UniformGrid 的 hover 和 click 事件？

Question

我尝试使用 ListBox 和 UniformGrid 创建一个包含两列的按钮列表。一切似乎都很好，直到我遇到以下问题。当我单击按钮或将鼠标悬停在按钮上时，按钮的边距 space 显示为浅蓝色。如何消除这种影响？

这是我的代码：

<ListBox Width="1000" Grid.Row="1" VerticalAlignment="Top" VerticalContentAlignment="Top" Name="uniformGrid1" Margin="50" ItemsSource="{Binding SomeItemsList}">
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <UniformGrid Columns="2" Background="Transparent"   Name="uniformGrid1"></UniformGrid>
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
    <ListBox.ItemTemplate>
        <DataTemplate>
            <Button Margin="50" Height="70" Click="keyword_Click" Width="250"
         Foreground="Black" FontSize="16" FontFamily="Helvetica Neue" FontWeight="Bold"
        BorderBrush="SlateGray" Content="{Binding Name}">
                <Button.Background>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="White" Offset="0.073" />
                        <GradientStop Color="White" Offset="1" />
                        <GradientStop Color="#FFE9E9F9" Offset="0.571" />
                        <GradientStop Color="#FFD7D7EC" Offset="0.243" />
                    </LinearGradientBrush>
                </Button.Background>
            </Button>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

Answer 1

这里的问题是 ListBox 有一个选择，并且选择的项目被突出显示。您需要禁用此突出显示以获得所需的结果，例如通过设置 ListBox.ItemContainerStyle 如 in this answer 所述。这将删除（浅蓝色）选择颜色。

Answer 2

ItemsSource 中的每个项目都包含在 ListBoxItem inside the ListBox. A ListBox is a control derived from Selector 中，这是允许选择项目的项目控件的基本类型。

Represents a control that allows a user to select items from among its child elements.

您指定为 DataTemplate 的内容将在运行时放置在 ListBoxItem 中，这是内容的容器。这个容器有一个 default style and control template that defines its appearance and visual states. What you see is the MouseOver state and the Selected state. You can change this by extracting the default style 用于 ListBoxItem 并调整它或编写你自己的。

How to create a template for a control (WPF.NET)

不过，你的本意好像不一样。您可能想要的是根据绑定集合简单地在 UniformGrid 中显示按钮，而不进行任何选择。您可以通过使用 ItemsControl 来实现这一点。它不提供任何选择功能，但允许您将集合与 UniformGrid as items 面板绑定。

<ItemsControl Width="1000" Grid.Row="1" VerticalAlignment="Top" VerticalContentAlignment="Top" Margin="50" ItemsSource="{Binding SomeItemsList}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <UniformGrid Columns="2" Background="Transparent" Name="uniformGrid1"></UniformGrid>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Button Margin="50" Height="70" Click="keyword_Click" Width="250"
         Foreground="Black" FontSize="16" FontFamily="Helvetica Neue" FontWeight="Bold"
        BorderBrush="SlateGray" Content="{Binding Name}">
                <Button.Background>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="White" Offset="0.073" />
                        <GradientStop Color="White" Offset="1" />
                        <GradientStop Color="#FFE9E9F9" Offset="0.571" />
                        <GradientStop Color="#FFD7D7EC" Offset="0.243" />
                    </LinearGradientBrush>
                </Button.Background>
            </Button>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

请注意，我已经删除了两个 Name="uniformGrid1" 中的一个，因为重名会导致编译错误。如果您的内容超出视口并且您需要滚动条，则必须添加一个 ScrollViewer，因为它内置于 ListBox，而不是 ItemsControl.

<ScrollViewer HorizontalScrollBarVisibility="Auto"
              VerticalScrollBarVisibility="Auto">
   <ItemsControl  Width="1000" Grid.Row="1" VerticalAlignment="Top" VerticalContentAlignment="Top" Margin="50" ItemsSource="{Binding SomeItemsList}">
      <!-- ...other code. -->
   </ItemsControl>
</ScrollViewer>

如何隐藏 UniformGrid 的 hover 和 click 事件？

How to hide hover and click event of UniformGrid?

c#

data-binding

wpf

xaml

listboxitem