Home > OS >  How to hide hover and click event of uniformGrid in WPF?
How to hide hover and click event of uniformGrid in WPF?

Time:11-30

enter image description here

I try to create a list of button with two column using the listBox & uniformGrid, everything seem okay until I faced with this issue. The margin space of the button was show with lightblue color when click or hover. Please answer me if is there anyway to remove these effect.

Here is my code

        <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>

CodePudding user response:

The problem here is that the ListBox has a selection, and selected items get highlighted. You need to disable this highlighting to get the desired result, for example by setting ListBox.ItemContainerStyle as described in this answer. This will remove the (lightblue) selection color.

CodePudding user response:

Each item in the ItemsSource is wrapped in a ListBoxItem inside the ListBox. A ListBox is a control derived from Selector, which is a base type for items controls that allow selection of items.

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

Consequently, what you specified as DataTemplate will be placed in a ListBoxItem at runtime, which is the container for the content. This container has a 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 for ListBoxItem and adapting it or by writing your own.

However, it seems that your intention is different. What you probably wanted was to simply display buttons in a UniformGrid depending on a bound collection, without any selection. You can achieve this by using an ItemsControl instead. It does not offer any selection capabilities, but lets you bind a collection with the UniformGrid as items panel.

<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>

Please note that I have removed one of two Name="uniformGrid1" as duplicate names lead to a compilation error.

  • Related