为什么在 WPF 中设置用户按钮控件内容时我的样式消失了？

Question

请为我的英语弱点向我道歉。 我是 WPF 的新手，我在这里有一个问题作为问题标题。 我试图将 WPF 用户控件实现为按钮。但是当我想使用我的应用程序上的按钮时。我有错误。这是我的代码和错误。

用户控制 XAML 代码：

    <UserControl x:Class="AADControls.Buttons.Warning"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:AADControls.Buttons"
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300">
    <UserControl.Resources>
        <LinearGradientBrush x:Key="aad-warning-back-brush" StartPoint="0.5,0" EndPoint="0.5,1">
            <GradientStop Offset="0" Color="#FFF0F200"/>
            <GradientStop Offset="1" Color="#FFFF8800"/>
        </LinearGradientBrush>
        <LinearGradientBrush x:Key="aad-warning-border-brush" StartPoint="0.5,0" EndPoint="0.5,1">
            <GradientStop Offset="0" Color="#FFF0F200"/>
            <GradientStop Offset="1" Color="#FFFF8800"/>
        </LinearGradientBrush>
    </UserControl.Resources>
    <Button Name="BtnWarning" Width="250" Height="50" 
            Content="AAD Button">
        <Button.Template>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border Name="AADBorder" 
                                CornerRadius="10" 
                                BorderThickness="4" 
                                BorderBrush="{StaticResource aad-warning-border-brush}" 
                                Background="{StaticResource aad-warning-back-brush}">
                    <ContentPresenter Content="{TemplateBinding Content}" 
                                      HorizontalAlignment="Center" 
                                      VerticalAlignment="Center"/>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="RenderTransform">
                            <Setter.Value>
                                <ScaleTransform ScaleX="1.1" ScaleY="1.1"/>
                            </Setter.Value>
                        </Setter>
                    </Trigger>
                    <Trigger Property="IsPressed" Value="True">
                        <Setter Property="RenderTransform">
                            <Setter.Value>
                                <ScaleTransform ScaleX="1.0" ScaleY="1.0"/>
                            </Setter.Value>
                        </Setter>
                    </Trigger>
                    <Trigger Property="IsMouseCaptured" Value="true">
                        <Setter Property="Effect">
                            <Setter.Value>
                                <DropShadowEffect Opacity="0.8" Direction="135"  
                             ShadowDepth="3" BlurRadius="1" />
                            </Setter.Value>
                        </Setter>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Button.Template>
    </Button>
</UserControl>

我对用户控制的使用：

<Window x:Class="DepaSOS.Pages.wndInitialize"
    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:AAD="clr-namespace:AADControls.Buttons;assembly=AADControls"
    xmlns:local="clr-namespace:DepaSOS.Pages"
    mc:Ignorable="d"
    Title="launch-n-Initialization"

    WindowStartupLocation="{StaticResource WSL}">



    <AAD:Warning Grid.Row="11" Grid.ColumnSpan="3"/>

现在的问题是直到我使用

<AAD:Warning Grid.Row="11" Grid.ColumnSpan="3"/>

一切正常，显示的内容是默认内容，在用户控件中设置。我的控件的外观是这样的图像：

但是，如果我只是像这样将内容属性添加到我的按钮

<AAD:Warning Grid.Row="11" Grid.ColumnSpan="3" Content="Bla Bla Bla"/>

，关于风格的每一件事都像这样的图片：

Answer 1

<UserControl>...</UserControl> 元素内的 XAML 是 UserControl 的内容。默认情况下，它包含一个按钮。您正在用文本替换按钮，因此您看到的是文本而不是按钮。你不会失去按钮的风格。你失去了整个按钮。

您没有做任何可能将用户控件的内容放在按钮中的操作。如果您想这样做，您需要设置 UserControl 的模板：该模板决定了内容的呈现方式（您自己的按钮模板就演示了这一点）。像这样：

<UserControl 
    x:Class="AADControls.Buttons.Warning"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:local="clr-namespace:AADControls.Buttons"
    mc:Ignorable="d" 
    d:DesignHeight="300" d:DesignWidth="300"
    Content="AAD Button"
    >
    <UserControl.Resources>
        <LinearGradientBrush x:Key="aad-warning-back-brush" StartPoint="0.5,0" EndPoint="0.5,1">
            <GradientStop Offset="0" Color="#FFF0F200"/>
            <GradientStop Offset="1" Color="#FFFF8800"/>
        </LinearGradientBrush>
        <LinearGradientBrush x:Key="aad-warning-border-brush" StartPoint="0.5,0" EndPoint="0.5,1">
            <GradientStop Offset="0" Color="#FFF0F200"/>
            <GradientStop Offset="1" Color="#FFFF8800"/>
        </LinearGradientBrush>
    </UserControl.Resources>

    <!-- This template contains the XAML you had for the Content. -->
    <UserControl.Template>
        <ControlTemplate TargetType="UserControl">
            <Button 
                Name="BtnWarning" 
                Width="250" 
                Height="50" 
                Content="{TemplateBinding Content}"
                >
                <Button.Template>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Border 
                            Name="AADBorder" 
                            CornerRadius="10" 
                            BorderThickness="4" 
                            BorderBrush="{StaticResource aad-warning-border-brush}" 
                            Background="{StaticResource aad-warning-back-brush}"
                            >
                            <ContentPresenter 
                                Content="{TemplateBinding Content}" 
                                HorizontalAlignment="Center" 
                                VerticalAlignment="Center"
                                />
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="RenderTransform">
                                    <Setter.Value>
                                        <ScaleTransform ScaleX="1.1" ScaleY="1.1"/>
                                    </Setter.Value>
                                </Setter>
                            </Trigger>
                            <Trigger Property="IsPressed" Value="True">
                                <Setter Property="RenderTransform">
                                    <Setter.Value>
                                        <ScaleTransform ScaleX="1.0" ScaleY="1.0"/>
                                    </Setter.Value>
                                </Setter>
                            </Trigger>
                            <Trigger Property="IsMouseCaptured" Value="true">
                                <Setter Property="Effect">
                                    <Setter.Value>
                                        <DropShadowEffect 
                                            Opacity="0.8" 
                                            Direction="135"  
                                            ShadowDepth="3" 
                                            BlurRadius="1" />
                                    </Setter.Value>
                                </Setter>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Button.Template>
            </Button>
        </ControlTemplate>
    </UserControl.Template>
</UserControl>

注意几点：

1. 您为内容拥有的 XAML 现在都在 UserControl 的 ControlTemplate 中
2. Button 的 Content 现在是 Content="{TemplateBinding Content}"。这意味着，“找到应用模板的控件的 Content 属性，并在此处使用它的值。”

3. 我们现在将 UserControl 的 Content 属性设置为“AAD Button”——您之前分配给按钮内容的文本。

   Content="AAD Button"
   

   这将是用户控件的默认内容，除非你给它一些不同的内容，否则它将显示在按钮中。例如，在这里，您要为其提供内容“Bla Bla Bla”，该内容将显示在按钮中。

   <AAD:Warning Grid.Row="11" Grid.ColumnSpan="3" Content="Bla Bla Bla"/>