Jason D
Jason D

Reputation: 2664

WPF Remove mouseover / hover border on Menuitems and ListView

I have looked all over for an answer to this and haven't found a way to achieve what I need to do, so I figured I'd ask a question of my own.

I have 2 Menus in my UserControl as well as a ListView. Whenever the mouse hovers over any of the menuitems (the "End Day" button in the picture below, in this case) or the listview, a thin border appears around the control and then goes away when the mouse moves elsewhere. I don't know what this is called or how to locate it (in XAML or Blend), but I would love to learn how to disable it both for menuitems and the listview (and other controls as well if there is a univeral way of doing it), preferably in XAML. I find it to be very annoying. Please help me out here if you can.

enter image description here

Update: My ListView:

<ListView ItemsSource="{Binding Adventurers}"
              Name="AdvListView"
              ScrollViewer.CanContentScroll="False"
              Background="Gray"
              BorderBrush="Transparent"
              Grid.Column="1"
              Grid.ColumnSpan="3"
              Grid.Row="2">

        <i:Interaction.Triggers>
            <i:EventTrigger EventName="SelectionChanged">
                <cmd:EventToCommand Command="{Binding Mode=OneWay, Path=ShowAdvCommand}"
                                    CommandParameter="{Binding ElementName=AdvListView, Path=SelectedItem}"
                                    PassEventArgsToCommand="True" />
            </i:EventTrigger>
        </i:Interaction.Triggers>
        <ListView.View>
            <GridView>
                <GridViewColumn Width="Auto" Header="Name" DisplayMemberBinding="{Binding Name}" />
                <GridViewColumn Width="Auto" Header="Level" DisplayMemberBinding="{Binding Level}"/>
            </GridView>
        </ListView.View>
    </ListView>

My Menu:

<Menu Background="#FFA9D1F4"
          Grid.ColumnSpan="5" 
          IsMainMenu="False">
        <Menu.ItemsPanel>
            <ItemsPanelTemplate>
                <DockPanel HorizontalAlignment="Stretch" />
            </ItemsPanelTemplate>
        </Menu.ItemsPanel>
        <MenuItem Header="File"
                  Focusable="False"
                  FontFamily="Pericles"
                  FontSize="16"
                  VerticalAlignment="Center"
                  HorizontalAlignment="Left">


            <MenuItem Header="Save" 
                      Command="{Binding SaveGame}" />

            <MenuItem Header="Load" 
                      Command="{Binding LoadGame}" />

            <MenuItem Header="Quit" />
        </MenuItem>

        <Button Content="End Day" 
                Command="{Binding EndDayCommand}" 
                Focusable="False"
                FontFamily="Pericles"
                FontSize="16"
                VerticalAlignment="Center"
                HorizontalAlignment="Left" />

        <Button Content="Load" 
                Command="{Binding LoadGame}" 
                Focusable="False"
                FontFamily="Pericles"
                FontSize="16"
                VerticalAlignment="Center"
                HorizontalAlignment="Left" />

        <Button Content="Save" 
                Command="{Binding SaveGame}" 
                Focusable="False"
                FontFamily="Pericles"
                FontSize="16"
                VerticalAlignment="Center"
                HorizontalAlignment="Left" />

        <Label Content="{Binding GameDate}"
               Focusable="False"
               ContentStringFormat="{}{0:d\/M\/y}"
               FontFamily="Pericles"
               FontSize="16"
               VerticalAlignment="Center"
               HorizontalAlignment="Right" />
    </Menu>

Upvotes: 3

Views: 5559

Answers (3)

Alexander Pacha
Alexander Pacha

Reputation: 9750

What worked for me was to use the IsHitTestVisible-tag like this:

<Menu IsHitTestVisible="False" > ... </Menu>

you might also try it in combination with Focusable="False"

Basically I used it to completely disable that the user can click on the menu (which was exactly what I wanted for my use-case).

Upvotes: 0

Ron.B.I
Ron.B.I

Reputation: 2766

The problem is that you've had your buttons inside the menu definition, this is not common use of the menu as it should contain menu items. I believe you needed a "menu" that has some buttons and also a menu, I've provided you with a simple solution for this, which you should adapt for your specific code:

another, not recommended solution is to dive in the menuItem and menu default control templates and write them 'from scratch', as you cannot override a default style in a partial matter, here is an example of how this can be not (again - highly not recommended in this case):

http://msdn.microsoft.com/en-us/library/ms747082(v=vs.85).aspx

<Window x:Class="WpfApplication4.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Grid>

        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <StackPanel Grid.Row="0" Orientation="Horizontal">
            <Menu Background="#FFA9D1F4"

              BorderBrush="{x:Null}"
          IsMainMenu="False">
                <Menu.ItemsPanel>
                    <ItemsPanelTemplate>
                        <DockPanel HorizontalAlignment="Stretch" />
                    </ItemsPanelTemplate>
                </Menu.ItemsPanel>
                <MenuItem Header="File"
                  Focusable="False"
                  FontFamily="Pericles"
                  FontSize="16"
                  VerticalAlignment="Center"
                  HorizontalAlignment="Left">


                    <MenuItem Header="Save" 
                      Command="{Binding SaveGame}" />

                    <MenuItem Header="Load" 
                      Command="{Binding LoadGame}" />

                    <MenuItem Header="Quit" />
                </MenuItem>
            </Menu>

            <Button Content="End Day" 
                Command="{Binding EndDayCommand}" 
                Focusable="False"
                FontFamily="Pericles"
                FontSize="16"
                VerticalAlignment="Center"
                HorizontalAlignment="Left" />


                <Label Content="GameDate"
               Focusable="False"
               ContentStringFormat="{}{0:d\/M\/y}"
               FontFamily="Pericles"
               FontSize="16"
               VerticalAlignment="Center"
               HorizontalAlignment="Right" />
            <Button Content="Load" 
                Command="{Binding LoadGame}" 
                Focusable="False"
                FontFamily="Pericles"
                FontSize="16"
                VerticalAlignment="Center"
                HorizontalAlignment="Left" />

                <Button Content="Save" 
                Command="{Binding SaveGame}" 
                Focusable="False"
                FontFamily="Pericles"
                FontSize="16"
                VerticalAlignment="Center"
                HorizontalAlignment="Left" />
        </StackPanel>

    </Grid>
</Window>

edit:

I did some Refactoring so it would look like a 'good looking' menu bar for a complete solution,please try it.

for your list view I believe the problem is resolved in a very similar manner.

Menu outcome

    <Window x:Class="WpfApplication4.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Grid.Resources>
            <Style TargetType="{x:Type Button}">
                <Setter Property="Margin" Value="5"></Setter>
            </Style>
        </Grid.Resources>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="Auto"/>
        </Grid.ColumnDefinitions>
        <StackPanel Background="#FFA9D1F4" Grid.Row="0" Grid.ColumnSpan="2" Orientation="Horizontal">
            <Menu 
         Background="#FFA9D1F4"
              BorderBrush="{x:Null}"
          IsMainMenu="False">
                <Menu.ItemsPanel>
                    <ItemsPanelTemplate>
                        <DockPanel HorizontalAlignment="Stretch" />
                    </ItemsPanelTemplate>
                </Menu.ItemsPanel>
                <Menu.Resources>
                    <Style TargetType="{x:Type MenuItem}">
                        <Setter Property="Background" Value="#FFA9D1F4"></Setter>
                    </Style>
                </Menu.Resources>
                <MenuItem Header="File"
                  Focusable="False"
                  FontFamily="Pericles"
                  FontSize="16"
                  VerticalAlignment="Center"
                  HorizontalAlignment="Left">


                    <MenuItem Header="Save" 
                              Background="#FFA9D1F4"
                      Command="{Binding SaveGame}" />

                    <MenuItem Header="Load" 
                              Background="#FFA9D1F4"
                      Command="{Binding LoadGame}" />

                    <MenuItem Header="Quit" />
                </MenuItem>
            </Menu>

            <Button Content="End Day" 
                Command="{Binding EndDayCommand}" 
                Focusable="False"
                FontFamily="Pericles"
                FontSize="16"
                VerticalAlignment="Center"
                HorizontalAlignment="Left" />



            <Button Content="Load" 
                Command="{Binding LoadGame}" 
                Focusable="False"
                FontFamily="Pericles"
                FontSize="16"
                VerticalAlignment="Center"
                HorizontalAlignment="Left" />

                <Button Content="Save" 
                Command="{Binding SaveGame}" 
                Focusable="False"
                FontFamily="Pericles"
                FontSize="16"
                VerticalAlignment="Center"
                HorizontalAlignment="Left" />

        </StackPanel>
        <Label Margin="0" Grid.Row="0" Grid.Column="1" Content="1/1/13"
               Focusable="False"
               ContentStringFormat="{}{0:d\/M\/y}"
               FontFamily="Pericles"
               FontSize="16"
               VerticalAlignment="Center"
               HorizontalAlignment="Right" />

    </Grid>
</Window>

Upvotes: 1

Smeegs
Smeegs

Reputation: 9224

In blend you can right click on the button and click on "edit copy of template" or something like that (not verbatim).

It will open the actual template for the button, there you can edit the visual states. Here you can completely remove or edit the hover effects.

Sorry I couldn't give you more detail.

Upvotes: 1

Related Questions