为WPF用户控件添加一个有角度的徽章

时间:2016-10-28 13:51:46

标签: wpf wpf-controls

我正在创建一个包含徽章的wpf控件,如下图所示: enter image description here

这是我尝试的代码,但不能用窗口大小调整

<Border BorderBrush="Black" BorderThickness="2" HorizontalAlignment="Left" Height="261" Margin="49,23,0,0" VerticalAlignment="Top" Width="359" Background="#FFF7EDED">
            <Grid>
                <TextBlock Text="Hi there" Margin="5" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                <Rectangle Fill="#FFA42828"  Stroke="Black" RenderTransformOrigin="0.5,0.5" Opacity="0.8" StrokeThickness="0" Margin="-42.14,117.204,-16.176,101.754">
                <Rectangle.RenderTransform>
                    <TransformGroup>
                        <ScaleTransform/>
                        <SkewTransform AngleX="-30.771"/>
                        <RotateTransform Angle="-31.015"/>
                        <TranslateTransform X="13.961" Y="-8.394"/>
                    </TransformGroup>
                </Rectangle.RenderTransform>
            </Rectangle>
            </Grid>
        </Border>

我尝试使用Rectangle控制来改变它的X和Y轴,但它不能工作,因为我需要一些可调节控件大小的东西。请帮忙。

1 个答案:

答案 0 :(得分:0)

基本上它是边框,对角线和居中文本。唯一的技巧是为行设置正确的坐标,我为此目的使用绑定到ActualHeightActualWidth

<Border Height="50" Name="brd" BorderBrush="Black" BorderThickness="2">
    <Grid Name="bounds">
        <Line Stroke="Green" StrokeThickness="2" 
          X1="0" Y1="{Binding Path=ActualHeight, ElementName=bounds}" 
          X2="{Binding Path=ActualWidth, ElementName=bounds}" Y2="0">
        </Line>

        <TextBlock Text="Hello World" FontSize="24"
                   VerticalAlignment="Center"
                   HorizontalAlignment="Center"
                   Foreground="Black"/>
    </Grid>
</Border>

result