Question

我正在尝试创建一个控件，可以在按钮事件的鼠标上执行多个动画。第一个功能是，按钮应采用padding = 2并占据整个列。我无法做到这一点;如果我试图在鼠标悬停时减小按钮的宽度，我可以这样做，但是当我试图增加宽度时，按钮正在扩展但扩展部分不可见。如何实现相同的？

我在控件模板中使用以下代码。请建议更改： -

<!--Create a control template for button-->
<ControlTemplate x:Key="buttonAnimate" TargetType="Button">
    <Grid Name="myGrid">
        <Button Name="myButton" Background="{TemplateBinding Background }" Width="{TemplateBinding Width}">
        </Button>
    <Border Name="MyBorder" BorderBrush="Orange" BorderThickness="3" CornerRadius="2"></Border>
    </Grid>
    <ControlTemplate.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="Background" Value="DarkRed" TargetName="MyBorder"/>
            <Setter Property="Width" Value="200" TargetName="myButton"/>
            <Setter Property="Cursor" Value="Hand" TargetName="myGrid"/>
            <Setter Property="Width" Value="300" TargetName="myButton"/>
            <Setter Property="Width" Value="300" TargetName="MyBorder"/>
            <Setter Property="Padding" Value="2" TargetName="myButton"/>
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>

提前致谢。

Answer 1

您的按钮被网格剪裁。尝试将ClipsToBounds属性设置为false或尝试此操作：

public class MyButton : Button
{
    protected override Geometry GetLayoutClip(Size layoutSlotSize)
    {
        return ClipToBounds ? base.GetLayoutClip(layoutSlotSize) : null;
    }
}

希望它有所帮助。

使用WPF的动态按钮宽度

1 个答案: