边框不显示在按钮上

Question

我是WPF 的新手，可能很简单。我不知道为什么BorderBrush 没有显示在删除Button 上。 Button 默认情况下不可见，但当鼠标悬停在 Button 上时会显示。当鼠标悬停在Button 上时，底层TextBlock 会正常显示，但没有Border。

有人对我如何查看按钮的Border 有建议吗？

以下是我的XAML：

<Window x:Class="WpfApplication1.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="150" Width="325">
<Window.Resources>
    <Storyboard x:Key="MakeToolbarVisible">
        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)">
            <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="0.5"/>
        </DoubleAnimationUsingKeyFrames>
    </Storyboard>
    <Storyboard x:Key="MakeToobarHidden">
        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)">
            <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0"/>
        </DoubleAnimationUsingKeyFrames>
    </Storyboard>
    <Style x:Key="Toolbar">
        <Style.Triggers>
            <Trigger Property="UIElement.IsMouseOver" Value="True">
                <Trigger.ExitActions>
                    <BeginStoryboard Storyboard="{StaticResource MakeToobarHidden}"/>
                </Trigger.ExitActions>
                <Trigger.EnterActions>
                    <BeginStoryboard Storyboard="{StaticResource MakeToolbarVisible}"/>
                </Trigger.EnterActions>
            </Trigger>
        </Style.Triggers>
    </Style>
</Window.Resources>
<Grid>
    <Border>
        <Grid Margin="0">
            <Grid.RowDefinitions>
                <RowDefinition/>
                <RowDefinition Height="30"/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition/>
                <ColumnDefinition Width="30" />
            </Grid.ColumnDefinitions>

            <TextBlock Text="enter some text here!" Margin="8,19.058,8,0" VerticalAlignment="Top" Foreground="#B43C1C26" HorizontalAlignment="Right"/>
            <TextBox TextWrapping="WrapWithOverflow" Margin="8,19.058,0,2.463" FontSize="11" AcceptsReturn="True" AcceptsTab="True" Visibility="Visible" BorderThickness="0" Background="{x:Null}"/>
            <WrapPanel Grid.Row="1" Margin="8,8,8,8">
                <TextBlock Text="29.8.1995" Foreground="#B43C1C26" FontSize="10" />
            </WrapPanel>

            <StackPanel Grid.Column="1" Margin="5,5,5,8" Grid.RowSpan="2" Opacity="0" Style="{StaticResource Toolbar}">
                <Button x:Name="Remove" BorderBrush="DarkRed" BorderThickness="1" Cursor="Hand">
                    <Button.Template>
                        <ControlTemplate>
                            <TextBlock Text="r" FontFamily="Marlett" FontSize="12"/>
                        </ControlTemplate>
                    </Button.Template>
                </Button>
            </StackPanel>
        </Grid>
    </Border>
</Grid>

Answer 1

您已经覆盖了Button 的ControlTemplate，因此您将失去按钮的默认模板。

根据您的代码，我可以看到您想为按钮中的文本设置 FontFamily 和 FontSize，您可以在不覆盖这样的模板的情况下实现 -

       <StackPanel Grid.Column="1" Margin="5,5,5,8" Grid.RowSpan="2" Opacity="0"
                   Style="{StaticResource Toolbar}">
            <Button x:Name="Remove" BorderBrush="DarkRed"
                    BorderThickness="1" Cursor="Hand" Content="r"
                    FontFamily="Marlett" FontSize="12"/>
        </StackPanel>

Answer 2

如果你想让按钮看起来像一个普通按钮，你不应该重新设计它 只需像这样设置要更改的属性：

  <StackPanel Grid.Column="1" Margin="5,5,5,8" Grid.RowSpan="2" Opacity="0" Style="{StaticResource Toolbar}">
     <Button x:Name="Remove" BorderBrush="DarkRed" BorderThickness="1" Cursor="Hand"
                            FontSize="12" FontFamily="Marlett" Content="r"/>

   </StackPanel>

Answer 3

您可以通过设置 Buttons ControlTemplate 将 Buttons 默认模板替换为没有边框的模板。

要显示边框，请将其添加到您的 ControlTemplate 中，如下所示：

        <StackPanel Grid.Column="1" Margin="5,5,5,8" Grid.RowSpan="2" Opacity="0" Style="{StaticResource Toolbar}">
            <Button x:Name="Remove" BorderBrush="DarkRed" BorderThickness="1" Cursor="Hand">
                <Button.Template>
                    <ControlTemplate>
                        <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
                             <TextBlock Text="r" FontFamily="Marlett" FontSize="12"/>
                        </Border>
                    </ControlTemplate>
                </Button.Template>
            </Button>
        </StackPanel>

通过 TemplateBinding，您可以绑定到模板化控件的属性，在本例中为按钮的属性。