C# WPF 按钮样式模板不显示背景图像
C# WPF Button Style Template Not Showing Background Image
我正在整理一个非常简单的 WPF Window 来演示最终用户要求的样式的外观。由于有许多重复的按钮类型对象，我想让它们在 window 中有一个样式，然后可以在进行调整后转移到实际应用程序中。
我面临的问题是用户希望他们的按钮有图像，当我在按钮本身内设置背景图像时，它会完美显示并按我想要的方式运行（鼠标悬停时更改图像等）。当我将该格式移动到样式中时，一切正常，但背景图像不显示。我确信我遗漏了一些非常简单的东西，但我看不到它。
我生成的代码如下：-
<Window x:Class="SkinningDemo.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:SkinnigDemo"
mc:Ignorable="d"
Title="DemoWindow" Height="450" Width="800">
<Window.Resources>
<Style x:Key="MainButtonStyle" TargetType="Button">
<Setter Property="OverridesDefaultStyle" Value="True"/>
<Setter Property="Background">
<Setter.Value>
<ImageBrush ImageSource="/Images/Button1.png" />
</Setter.Value>
</Setter>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Border Name="border"
BorderThickness="0">
<ContentPresenter HorizontalAlignment="Center"
VerticalAlignment="Center" />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="False">
<Setter Property="Background">
<Setter.Value>
<ImageBrush ImageSource="/Images/Button1.png"/>
</Setter.Value>
</Setter>
<Setter Property="Foreground" Value="#FF266C38"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background">
<Setter.Value>
<ImageBrush ImageSource="/Images/Button2.png"/>
</Setter.Value>
</Setter>
<Setter Property="Foreground" Value="#220A88"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<Grid x:Name="Home">
<Grid.Background>
<SolidColorBrush Color="#FF220A88" Opacity="0.15"/>
</Grid.Background>
<Image HorizontalAlignment="Left" Height="68" Margin="10,10,0,0" VerticalAlignment="Top" Width="737" Source="images/Master Logo transparent.png"/>
<TextBlock HorizontalAlignment="Left" Height="62" TextAlignment="Center" TextWrapping="Wrap" VerticalAlignment="Top" Width="750" Margin="36,96,0,0" Foreground="#FF266C38" FontSize="14" FontWeight="Bold"><Run Language="en-gb" Text="Sample Welcome Text will be placed here once agreed..."/></TextBlock>
<Rectangle HorizontalAlignment="Left" Height="111" Margin="36,0,0,0" Stroke="#220A88" VerticalAlignment="Center" Width="348" RadiusX="10" RadiusY="10">
<Rectangle.Fill>
<SolidColorBrush Color="#FF266C38" Opacity="0.25"/>
</Rectangle.Fill>
</Rectangle>
<Rectangle HorizontalAlignment="Left" Height="111" Margin="427,0,0,0" Stroke="#220A88" VerticalAlignment="Center" Width="348" RadiusX="10" RadiusY="10">
<Rectangle.Fill>
<SolidColorBrush Color="#FF266C38" Opacity="0.25"/>
</Rectangle.Fill>
</Rectangle>
<Rectangle HorizontalAlignment="Left" Height="111" Margin="36,295,0,0" Stroke="#220A88" VerticalAlignment="Top" Width="348" RadiusX="10" RadiusY="10">
<Rectangle.Fill>
<SolidColorBrush Color="#FF266C38" Opacity="0.25"/>
</Rectangle.Fill>
</Rectangle>
<Rectangle HorizontalAlignment="Left" Height="111" Margin="427,295,0,0" Stroke="#220A88" VerticalAlignment="Top" Width="348" RadiusX="10" RadiusY="10">
<Rectangle.Fill>
<SolidColorBrush Color="#FF266C38" Opacity="0.25"/>
</Rectangle.Fill>
</Rectangle>
<TextBlock HorizontalAlignment="Left" Height="56" TextWrapping="Wrap" TextAlignment="Center" VerticalAlignment="Top" Width="311" Margin="54,163,0,0" Foreground="#FF220A88"><Run Language="en-gb" Text="First functional text will go here..."/></TextBlock>
<Button x:Name="Button1" Style="{StaticResource MainButtonStyle}" Content="View Function 1" HorizontalAlignment="Left" Height="50" Margin="82,205,0,0" VerticalAlignment="Top" Width="258" FontSize="18">
</Button>
<TextBlock HorizontalAlignment="Left" Height="56" TextWrapping="Wrap" TextAlignment="Center" VerticalAlignment="Top" Width="311" Margin="446,163,0,0" Foreground="#FF220A88"><Run Language="en-gb" Text="Second Functional Text will go here..."/></TextBlock>
<Button x:Name="Button2" Style="{StaticResource MainButtonStyle}" Content="View Function 2" HorizontalAlignment="Left" Height="50" Margin="472,205,0,0" VerticalAlignment="Top" Width="258" FontSize="18"/>
<TextBlock HorizontalAlignment="Left" Height="56" TextWrapping="Wrap" TextAlignment="Center" VerticalAlignment="Top" Width="311" Margin="56,294,0,0" Foreground="#FF220A88"><Run Language="en-gb" Text="Third Functional Text will go here"/></TextBlock>
<TextBlock HorizontalAlignment="Left" Height="56" TextWrapping="Wrap" TextAlignment="Center" VerticalAlignment="Top" Width="311" Margin="446,295,0,0" Foreground="#FF220A88"><Run Language="en-gb" Text="Fourth functional text will go here..."/></TextBlock>
<Button x:Name="Button3" Style="{StaticResource MainButtonStyle}" Content="View Function 3" HorizontalAlignment="Left" Height="50" Margin="472,343,0,0" VerticalAlignment="Top" Width="258" FontSize="18"/>
<Button x:Name="Button4" Style="{StaticResource MainButtonStyle}" Content="View Function 4" HorizontalAlignment="Left" Height="50" Margin="80,343,0,0" VerticalAlignment="Top" Width="258" FontSize="18"/>
</Grid>
</Window>
正如我所说，背景图像不会显示在屏幕上，但如果我删除样式并在本地将其全部设置为完全相同的值，它就可以完美运行:-
<Button x:Name="Button1" Content="View Function 1" HorizontalAlignment="Left" Height="50" Margin="82,205,0,0" VerticalAlignment="Top" Width="258" FontSize="18">
<Button.Background>
<ImageBrush ImageSource="/Images/Button1.png"/>
</Button.Background>
</Button>
感谢期待帮助。
玩弄你漂亮的外观 XAML 我注意到你需要将背景画笔“绑定”到控件模板的根元素（边框），才能显示背景图像。
如果你只是在 <Border Name="border" 行下插入 Background="{TemplateBinding Background}" 基本上就可以了，比如：
<Border Name="border"
Background="{TemplateBinding Background}"
BorderThickness="0">
我正在整理一个非常简单的 WPF Window 来演示最终用户要求的样式的外观。由于有许多重复的按钮类型对象，我想让它们在 window 中有一个样式，然后可以在进行调整后转移到实际应用程序中。
我面临的问题是用户希望他们的按钮有图像，当我在按钮本身内设置背景图像时，它会完美显示并按我想要的方式运行（鼠标悬停时更改图像等）。当我将该格式移动到样式中时，一切正常，但背景图像不显示。我确信我遗漏了一些非常简单的东西，但我看不到它。
我生成的代码如下：-
<Window x:Class="SkinningDemo.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:SkinnigDemo"
mc:Ignorable="d"
Title="DemoWindow" Height="450" Width="800">
<Window.Resources>
<Style x:Key="MainButtonStyle" TargetType="Button">
<Setter Property="OverridesDefaultStyle" Value="True"/>
<Setter Property="Background">
<Setter.Value>
<ImageBrush ImageSource="/Images/Button1.png" />
</Setter.Value>
</Setter>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Border Name="border"
BorderThickness="0">
<ContentPresenter HorizontalAlignment="Center"
VerticalAlignment="Center" />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="False">
<Setter Property="Background">
<Setter.Value>
<ImageBrush ImageSource="/Images/Button1.png"/>
</Setter.Value>
</Setter>
<Setter Property="Foreground" Value="#FF266C38"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background">
<Setter.Value>
<ImageBrush ImageSource="/Images/Button2.png"/>
</Setter.Value>
</Setter>
<Setter Property="Foreground" Value="#220A88"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<Grid x:Name="Home">
<Grid.Background>
<SolidColorBrush Color="#FF220A88" Opacity="0.15"/>
</Grid.Background>
<Image HorizontalAlignment="Left" Height="68" Margin="10,10,0,0" VerticalAlignment="Top" Width="737" Source="images/Master Logo transparent.png"/>
<TextBlock HorizontalAlignment="Left" Height="62" TextAlignment="Center" TextWrapping="Wrap" VerticalAlignment="Top" Width="750" Margin="36,96,0,0" Foreground="#FF266C38" FontSize="14" FontWeight="Bold"><Run Language="en-gb" Text="Sample Welcome Text will be placed here once agreed..."/></TextBlock>
<Rectangle HorizontalAlignment="Left" Height="111" Margin="36,0,0,0" Stroke="#220A88" VerticalAlignment="Center" Width="348" RadiusX="10" RadiusY="10">
<Rectangle.Fill>
<SolidColorBrush Color="#FF266C38" Opacity="0.25"/>
</Rectangle.Fill>
</Rectangle>
<Rectangle HorizontalAlignment="Left" Height="111" Margin="427,0,0,0" Stroke="#220A88" VerticalAlignment="Center" Width="348" RadiusX="10" RadiusY="10">
<Rectangle.Fill>
<SolidColorBrush Color="#FF266C38" Opacity="0.25"/>
</Rectangle.Fill>
</Rectangle>
<Rectangle HorizontalAlignment="Left" Height="111" Margin="36,295,0,0" Stroke="#220A88" VerticalAlignment="Top" Width="348" RadiusX="10" RadiusY="10">
<Rectangle.Fill>
<SolidColorBrush Color="#FF266C38" Opacity="0.25"/>
</Rectangle.Fill>
</Rectangle>
<Rectangle HorizontalAlignment="Left" Height="111" Margin="427,295,0,0" Stroke="#220A88" VerticalAlignment="Top" Width="348" RadiusX="10" RadiusY="10">
<Rectangle.Fill>
<SolidColorBrush Color="#FF266C38" Opacity="0.25"/>
</Rectangle.Fill>
</Rectangle>
<TextBlock HorizontalAlignment="Left" Height="56" TextWrapping="Wrap" TextAlignment="Center" VerticalAlignment="Top" Width="311" Margin="54,163,0,0" Foreground="#FF220A88"><Run Language="en-gb" Text="First functional text will go here..."/></TextBlock>
<Button x:Name="Button1" Style="{StaticResource MainButtonStyle}" Content="View Function 1" HorizontalAlignment="Left" Height="50" Margin="82,205,0,0" VerticalAlignment="Top" Width="258" FontSize="18">
</Button>
<TextBlock HorizontalAlignment="Left" Height="56" TextWrapping="Wrap" TextAlignment="Center" VerticalAlignment="Top" Width="311" Margin="446,163,0,0" Foreground="#FF220A88"><Run Language="en-gb" Text="Second Functional Text will go here..."/></TextBlock>
<Button x:Name="Button2" Style="{StaticResource MainButtonStyle}" Content="View Function 2" HorizontalAlignment="Left" Height="50" Margin="472,205,0,0" VerticalAlignment="Top" Width="258" FontSize="18"/>
<TextBlock HorizontalAlignment="Left" Height="56" TextWrapping="Wrap" TextAlignment="Center" VerticalAlignment="Top" Width="311" Margin="56,294,0,0" Foreground="#FF220A88"><Run Language="en-gb" Text="Third Functional Text will go here"/></TextBlock>
<TextBlock HorizontalAlignment="Left" Height="56" TextWrapping="Wrap" TextAlignment="Center" VerticalAlignment="Top" Width="311" Margin="446,295,0,0" Foreground="#FF220A88"><Run Language="en-gb" Text="Fourth functional text will go here..."/></TextBlock>
<Button x:Name="Button3" Style="{StaticResource MainButtonStyle}" Content="View Function 3" HorizontalAlignment="Left" Height="50" Margin="472,343,0,0" VerticalAlignment="Top" Width="258" FontSize="18"/>
<Button x:Name="Button4" Style="{StaticResource MainButtonStyle}" Content="View Function 4" HorizontalAlignment="Left" Height="50" Margin="80,343,0,0" VerticalAlignment="Top" Width="258" FontSize="18"/>
</Grid>
</Window>
正如我所说，背景图像不会显示在屏幕上，但如果我删除样式并在本地将其全部设置为完全相同的值，它就可以完美运行:-
<Button x:Name="Button1" Content="View Function 1" HorizontalAlignment="Left" Height="50" Margin="82,205,0,0" VerticalAlignment="Top" Width="258" FontSize="18">
<Button.Background>
<ImageBrush ImageSource="/Images/Button1.png"/>
</Button.Background>
</Button>
感谢期待帮助。
玩弄你漂亮的外观 XAML 我注意到你需要将背景画笔“绑定”到控件模板的根元素（边框），才能显示背景图像。
如果你只是在 <Border Name="border" 行下插入 Background="{TemplateBinding Background}" 基本上就可以了，比如：
<Border Name="border"
Background="{TemplateBinding Background}"
BorderThickness="0">