Question

我想在MouseOver上将我的按钮的BorderThickness属性设置为5，一切都很好，除了当BorderThickness增加按钮内的内容被填充时，这是我不想发生的事情。有没有办法绕过/禁用它？

这是我的代码

<ControlTemplate TargetType="{x:Type Button}">
    <ControlTemplate.Resources>
        <Storyboard x:Key="MouseOverAnimation">
            <ThicknessAnimation Storyboard.TargetName="ButtonBorder" Storyboard.TargetProperty="BorderThickness" To="3" Duration="0:0:0.2" />
        </Storyboard>
        <Storyboard x:Key="MouseOutAnimation">
            <ThicknessAnimation Storyboard.TargetName="ButtonBorder" Storyboard.TargetProperty="BorderThickness" To="1" Duration="0:0:0.2" />
        </Storyboard>
    </ControlTemplate.Resources>


  <Border x:Name="ButtonBorder" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}">
      <VirtualizingStackPanel   VirtualizingPanel.IsVirtualizing="True" VirtualizingPanel.VirtualizationMode="Recycling" Background="{TemplateBinding Background}">
          <ContentPresenter  Width="{TemplateBinding Width}" Height="{TemplateBinding Height}"/>
      </VirtualizingStackPanel>
  </Border>

  <ControlTemplate.Triggers>
      <Trigger Property="IsMouseOver" Value="True">
          <Trigger.EnterActions>
              <BeginStoryboard Storyboard="{StaticResource MouseOverAnimation}"></BeginStoryboard>
          </Trigger.EnterActions>
      </Trigger>
  </ControlTemplate.Triggers>

这是XAML中的按钮

<Button Style="{StaticResource SoulsButton}" Width="150" >
    <TextBlock FontFamily="Resources/Fonts/#Univers UltraCondensed" FontSize="20"  Foreground="{StaticResource DarkSoulsYellow}" Width="50" Height="20">INSTALL</TextBlock>
</Button>

Answer 1

你可以摆脱那些烦人的跟随XAML。当边界变化时，文本将不会被填充：

<Button Width="150" >
    <Button.Template>
        <ControlTemplate TargetType="{x:Type Button}">
            <ControlTemplate.Resources>
                <Storyboard x:Key="MouseOverAnimation">
                    <ThicknessAnimation Storyboard.TargetName="ButtonBorder" Storyboard.TargetProperty="BorderThickness" To="3" Duration="0:0:0.2" />
                </Storyboard>
                <Storyboard x:Key="MouseOutAnimation">
                    <ThicknessAnimation Storyboard.TargetName="ButtonBorder" Storyboard.TargetProperty="BorderThickness" To="1" Duration="0:0:0.2" />
                </Storyboard>
            </ControlTemplate.Resources>

            <Grid>
                <Border x:Name="ButtonBorder" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}">
                    <VirtualizingStackPanel   VirtualizingPanel.IsVirtualizing="True" VirtualizingPanel.VirtualizationMode="Recycling" Background="{TemplateBinding Background}">
                    </VirtualizingStackPanel>
                </Border>
                <ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Center"/>
            </Grid>

            <ControlTemplate.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Trigger.EnterActions>
                        <BeginStoryboard Storyboard="{StaticResource MouseOverAnimation}"></BeginStoryboard>
                    </Trigger.EnterActions>
                    <Trigger.ExitActions>
                        <BeginStoryboard Storyboard="{StaticResource MouseOutAnimation}"></BeginStoryboard>
                    </Trigger.ExitActions>
                </Trigger>
            </ControlTemplate.Triggers>
        </ControlTemplate>
    </Button.Template>
    <TextBlock FontSize="20" Foreground="Green">INSTALL</TextBlock>
</Button>

WPF BorderThickness禁用子元素填充

1 个答案: