Как создать вырезанный угол в wpf

Question

У меня есть некоторый код

                <Border BorderBrush="Black"  BorderThickness="1" CornerRadius="8" Margin="0,0,5,0">
                    <!--Background="#FDFFC1"-->
                    <Border.Background>
                        <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
                            <GradientStop Color="#FFFFFFFD" />
                            <GradientStop Color="#FEFD9A" Offset="1" />
                        </LinearGradientBrush>
                    </Border.Background>
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="*"/>
                        </Grid.RowDefinitions>
                        <Border Grid.Row="0"  CornerRadius="10,10,0,0" Height="22" VerticalAlignment="Top">
                            <Label Foreground="Black" FontSize="10"  Margin="5,0,0,0" HorizontalAlignment="Left" 
                                   VerticalAlignment="Center" Content="Text" />
                        </Border>
                        <Grid Grid.Row="1">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="5*"/>
                            </Grid.ColumnDefinitions>
                            <Border Grid.Column="0" Margin="5,2,0,2">
                                <Image x:Name="tooltipImage" Width="18" Height="18"                                       
                                   Source=""
                                   HorizontalAlignment="Center" VerticalAlignment="Center"/>
                            </Border>
                            <Border Grid.Column="1" Margin="5,5,5,5">
                                <TextBlock
                                   Foreground="Black"
                                   Text="Test" FontSize="10"
                                   VerticalAlignment="Center" xml:space="preserve"
                                   HorizontalAlignment="Center"
                                   TextAlignment="Justify" MaxWidth="200"
                                   TextWrapping="Wrap"/>
                            </Border>

Для этой границы я хочу, чтобы правый нижний угол был таким, как он был вырезан ножницами, или как лист бумаги, который был разрезан.Я думаю, что мне нужно использовать Path или некоторую геометрию, но я не знаю точно, как.

Заранее спасибо!

Answer 1

Вы можете использовать свойство Clip Границы следующим образом:

<Border BorderBrush="Black"
        BorderThickness="1"
        CornerRadius="8"
        Margin="0,0,5,0">
    <Border.Clip>
        <PathGeometry>
            <PathFigure StartPoint="0,0">
                <LineSegment Point="70,0" />
                <LineSegment Point="70,20" />
                <LineSegment Point="50,50" />
                <LineSegment Point="0,70" />
            </PathFigure>
        </PathGeometry>
    </Border.Clip>

К сожалению, координаты точек должны быть заданы, и они не будут соответствовать размеру Границы.Чтобы преодолеть это, вы можете добавить обработчик события SizeChanged к границе следующим образом:

<Border BorderBrush="Black"
        BorderThickness="1"
        CornerRadius="8"
        Margin="0,0,5,0" SizeChanged="Border_SizeChanged" >
    <Border.Clip>
        <PathGeometry>
            <PathFigure x:Name="BorderClipFigure" StartPoint="0,0">
                <LineSegment Point="70,0" />
                <LineSegment Point="70,20" />
                <LineSegment Point="50,50" />
                <LineSegment Point="0,70" />
            </PathFigure>
        </PathGeometry>
    </Border.Clip>

и написать код в обработчике, который использует размер границы для изменения точек PathFigure:

private void Border_SizeChanged(object sender, SizeChangedEventArgs e)
{
    double cutOff = 20;
    var line = BorderClipFigure.Segments[0] as LineSegment;
    line.Point = new Point(e.NewSize.Width, 0);

    line = BorderClipFigure.Segments[1] as LineSegment;
    line.Point = new Point(e.NewSize.Width, e.NewSize.Height - cutOff);

    line = BorderClipFigure.Segments[2] as LineSegment;
    line.Point = new Point(e.NewSize.Width - cutOff, e.NewSize.Height);

    line = BorderClipFigure.Segments[3] as LineSegment;
    line.Point = new Point(0, e.NewSize.Height);
}