C# WPF-内置文本的菱形按钮样式

C# WPF-内置文本的菱形按钮样式,c#,wpf,C#,Wpf,如何使用水平显示的文本制作菱形按钮样式 我这样做了,但不知道下一步该怎么办: <Style x:Key="Button"> <Setter Property="Button.Height" Value="40"/> <Setter Property="Button.Width" Value="40"/> <Setter Property="Button.RenderTransform

如何使用水平显示的文本制作菱形按钮样式

我这样做了,但不知道下一步该怎么办:

<Style x:Key="Button">
        <Setter Property="Button.Height" Value="40"/>
        <Setter Property="Button.Width" Value="40"/>           

        <Setter Property="Button.RenderTransform">
            <Setter.Value>
                <RotateTransform Angle="45"/>
            </Setter.Value>
        </Setter>            
</Style>

最简单的选择是不要使用
按钮
控件
内容
依赖属性定义文本内容,而是在单独的控件中定义
文本,例如明显的
文本块
,因为内容也将由于渲染变换而旋转45度

在您的样式中,如果希望按钮与您提供的链接中的按钮完全相同,还应设置以下依赖项属性:
BorderThickness
BorderBrush
(黑色)和
Background
(白色)

实际上,您可以使用
CLR属性
根据
按钮
尺寸计算这两个距离,并对这两个附加属性执行
绑定
。对于这种情况,我将按钮尺寸的偏移设置为(宽度:100,高度:100)


另外,提供的代码适用于UWP(我更习惯于它:p),因此我不是特别100%确定该解决方案适用于WPF的bat

您可以尝试像以前一样将按钮旋转45度,然后添加一个旋转-45度的文本块以保持水平。我相信有更好的方法,但这应该行得通

<Button>
    <TextBlock Text="Testing">
        <TextBlock.RenderTransform>
        <TransformGroup>
            <ScaleTransform/>
            <SkewTransform/>
            <RotateTransform Angle="-45"/>
            <TranslateTransform/>
        </TransformGroup>
    </TextBlock.RenderTransform>
    </TextBlock>
    <Button.RenderTransform>
        <TransformGroup>
            <ScaleTransform/>
            <SkewTransform/>
            <RotateTransform Angle="45"/>
            <TranslateTransform/>
        </TransformGroup>
    </Button.RenderTransform>
</Button>


出于许多原因(性能、布局、剪裁),转换不是解决此问题的好方法。特别是因为您不希望文本旋转,这意味着您将需要重新创建按钮。您可能想查看一些有关如何执行此操作的视频教程。我的WPF已经生锈了,但在不弄乱页面其余部分的情况下更改按钮的基本形状实际上有点棘手,目前来看,您的问题可能太广泛。是否可以在样式中设置文本坡度?
<Canvas Margin="100,0,0,0">
    <Button x:Name="myButton"/>
    <TextBlock Text="TextTextText" Canvas.Left="-40" Canvas.Top="60"/>
</Canvas>
<Button>
    <TextBlock Text="Testing">
        <TextBlock.RenderTransform>
        <TransformGroup>
            <ScaleTransform/>
            <SkewTransform/>
            <RotateTransform Angle="-45"/>
            <TranslateTransform/>
        </TransformGroup>
    </TextBlock.RenderTransform>
    </TextBlock>
    <Button.RenderTransform>
        <TransformGroup>
            <ScaleTransform/>
            <SkewTransform/>
            <RotateTransform Angle="45"/>
            <TranslateTransform/>
        </TransformGroup>
    </Button.RenderTransform>
</Button>