WPF中当鼠标移到按钮上时，按钮的背景图片消失的问题

时间：2022-02-21 04:28:54

如果给按钮设置了背景图片，当鼠标移到按钮上的时候，按钮就好变成一个浅蓝色的按钮，背景图片就消失了，对于这个问题有很多解决方法，我只分享一下我的解决方法。

我第一次用的方式是在按钮中添加一个图片，不用背景来设置。

<Button  HorizontalAlignment="Left" Margin="179,56.506,0,0" Click="Button_Click" VerticalAlignment="Top" Width="90" Height="74" BorderBrush="#FF1344EC" Grid.Row="1" Padding="2">

            <Image Source="image/dzsp.png" Name="btn1Image" Stretch="Fill"></Image>

        </Button>

　　用这种方式设置的按钮确实不会再出现之前说的问题了，但是也暴露了另一个问题，那就是鼠标移到按钮上后，按钮不会有任何的反应。我希望的是鼠标移到按钮后，按钮的颜色能有所改变。所以我又使用了下面的方式。

<Button Width="100" Margin="0,0,0,4" Name="my" MouseEnter="my_MouseEnter" MouseLeave="my_MouseLeave" BorderBrush="{x:Null}">

                    <Button.Template>

                        <ControlTemplate TargetType="Button">

                            <ContentControl>

                                <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">

                                <StackPanel>

                                        <StackPanel Height="20">

                                            <StackPanel.Background>

                                                <ImageBrush ImageSource="image/ico_01.png" Stretch="None"/>

                                            </StackPanel.Background>

                                        </StackPanel>

                                    <Label BorderThickness="0" Padding="5" FontSize="17" FontWeight="SemiBold" Foreground="White" HorizontalContentAlignment="Center">XXXX</Label>

                                </StackPanel></Border>

                            </ContentControl>

                        </ControlTemplate>

                    </Button.Template>

                </Button>

　　这种方式中，将原来用于做背景的图片给分离了，本来的图片是一个图标加上一段文字，现在是将图标单独制作为一张图片ico_01.png，然后原来背景图片中的文字放到了标签中。

定义按钮的两个事件MouseEnter和MouseLeave，分别用于处理鼠标移到按钮和移出按钮

private void my_MouseEnter(object sender, MouseEventArgs e)

        {

            my.BorderBrush = Brushes.Red;

            my.BorderThickness = new Thickness(2.0);

            my.Opacity = 0.5;

            ss++;

        }

        private void my_MouseLeave(object sender, MouseEventArgs e)

        {

            my.BorderBrush = null;

            my.BorderThickness = new Thickness(0.0);

            my.Opacity = ;

        }

就这样，运行程序，当鼠标进入按钮的时候，按钮就会变成半透明，且出现红色边框

相关文章