在xaml的按钮mouseover事件的图象背景变动

时间:2014-10-04 09:01:15

标签: c# wpf

我是WPF的新手。我尝试用按钮创建一个菜单。我将图像设置为Button的背景。但图像背景改变鼠标悬停事件。

我的xaml文件代码,

  <Menu x:Name="MainMenu" HorizontalAlignment="Left" Height="100" VerticalAlignment="Top"  Foreground="White" Background="Black" IsTabStop="True" IsTextSearchEnabled="True" Focusable="False" >
            <Button x:Name="Menu_btnAdd" Cursor="Arrow"  ToolTip="Add" Height="100" Width="100" TabIndex="1" IsEnabled="true" IsDefault="True" IsHitTestVisible="true" 
                    Click="Menu_btnAdd_Click"   MouseDown="Menu_btnAdd_MouseDown" >
                <Button.OpacityMask>
                    <ImageBrush ImageSource="Images/Menu_Drawings.png">

                    </ImageBrush>
                </Button.OpacityMask>
                <Button.Foreground>
                    <ImageBrush ImageSource="Images/Menu_Drawings.png"/>
                </Button.Foreground>
                <Button.BorderBrush>
                    <ImageBrush ImageSource="Images/Menu_Drawings.png"/>
                </Button.BorderBrush>
                <Button.Background>
                    <ImageBrush ImageSource="Images/Menu_Drawings.png"/>
                </Button.Background>

            </Button>
            <Button x:Name="Menu_btnView" Cursor="Arrow"  ToolTip="View" Height="100" Width="100" TabIndex="1" IsEnabled="true" IsDefault="True" 
                    >
                <Button.OpacityMask>
                    <ImageBrush ImageSource="Images/Menu_Components.png">

                    </ImageBrush>
                </Button.OpacityMask>
                <Button.Foreground>
                    <ImageBrush ImageSource="Images/Menu_Components.png"/>
                </Button.Foreground>
                <Button.BorderBrush>
                    <ImageBrush ImageSource="Images/Menu_Components.png"/>
                </Button.BorderBrush>
                <Button.Background>
                    <ImageBrush ImageSource="Images/Menu_Components.png"/>
                </Button.Background>

            </Button>
        </Menu>

鼠标悬停按钮背景结果: enter image description here 请指导我需要设置哪些属性,以便我的背景图像不会改变?

1 个答案:

答案 0 :(得分:0)

鼠标悬停是 按钮的默认可视状态 ,它已启用。要解决这个问题,你必须 覆盖按钮的默认模板 并摆脱它。

但是,我可以建议一个解决方法,看看它是否适合你。不要将图片设置为背景,而是将其添加为 按钮内容

<Button>
    <Image Source="Images/Menu_Drawings.png" Stretch="Fill"/>
</Button>

其他选项是 覆盖Button 的默认模板,并摆脱鼠标悬停的触发器。 (在删除这些触发器后添加以下示例)在资源下声明模板并应用于您想要具有该外观的按钮。

<Menu>
    <Menu.Resources>
        <ControlTemplate x:Key="ModifiedTemplate" TargetType="ButtonBase">
            <Border BorderThickness="{TemplateBinding Border.BorderThickness}"
                    BorderBrush="{TemplateBinding Border.BorderBrush}"
                    Background="{TemplateBinding Panel.Background}"
                    Name="border"
                    SnapsToDevicePixels="True">
                <ContentPresenter RecognizesAccessKey="True"
                                    Content="{TemplateBinding ContentControl.Content}"
                                    ContentTemplate="{TemplateBinding ContentControl.ContentTemplate}"
                                    ContentStringFormat="{TemplateBinding ContentControl.ContentStringFormat}"
                                    Name="contentPresenter"
                                    Margin="{TemplateBinding Control.Padding}"
                                    HorizontalAlignment="{TemplateBinding Control.HorizontalContentAlignment}"
                                    VerticalAlignment="{TemplateBinding Control.VerticalContentAlignment}"
                                    SnapsToDevicePixels="{TemplateBinding UIElement.SnapsToDevicePixels}"
                                    Focusable="False" />
            </Border>
            <ControlTemplate.Triggers>
                <Trigger Property="Button.IsDefaulted" Value="True">
                    <Setter Property="Border.BorderBrush" TargetName="border">
                        <Setter.Value>
                            <DynamicResource ResourceKey="{x:Static SystemColors.HighlightBrushKey}" />
                        </Setter.Value>
                    </Setter>
                </Trigger>
                <Trigger Property="ToggleButton.IsChecked" Value="True">
                    <Setter Property="Panel.Background" TargetName="border">
                        <Setter.Value>
                            <SolidColorBrush>#FFBCDDEE</SolidColorBrush>
                        </Setter.Value>
                    </Setter>
                    <Setter Property="Border.BorderBrush" TargetName="border">
                        <Setter.Value>
                            <SolidColorBrush>#FF245A83</SolidColorBrush>
                        </Setter.Value>
                    </Setter>
                </Trigger>
                <Trigger Property="UIElement.IsEnabled" Value="False">
                    <Setter Property="Panel.Background" TargetName="border">
                        <Setter.Value>
                            <SolidColorBrush>#FFF4F4F4</SolidColorBrush>
                        </Setter.Value>
                    </Setter>
                    <Setter Property="Border.BorderBrush" TargetName="border">
                        <Setter.Value>
                            <SolidColorBrush>#FFADB2B5</SolidColorBrush>
                        </Setter.Value>
                    </Setter>
                    <Setter Property="TextElement.Foreground" TargetName="contentPresenter">
                        <Setter.Value>
                            <SolidColorBrush>#FF838383</SolidColorBrush>
                        </Setter.Value>
                    </Setter>
                </Trigger>
            </ControlTemplate.Triggers>
        </ControlTemplate>
    </Menu.Resources>
    <Button Template="{StaticResource ModifiedTemplate}">
        <Button.Background>
            <ImageBrush ImageSource="Images/Menu_Drawings.png"/>
        </Button.Background>
    </Button>
</Menu>