0

How to clip path stroke? With ClipToBounds="True" there are unwanted pieces at rigth and bottom side.

alt

<Grid  Background="Yellow" ClipToBounds="True">
    <Viewbox Stretch="Fill">
        <Path Data="M30,0 L0,10 L0,40 L30,50 L30,0" Stroke="Red" StrokeThickness="5" />
    </Viewbox>
</Grid>

EDIT

I figured out that I just need not to scale border thickness, so solution will be:

enter image description here

<Grid x:Name="grid" Grid.Row="2" Background="Yellow" >
    <Grid.Resources>
        <ScaleTransform x:Key="transform"
                ScaleX="{Binding ActualWidth, ElementName=grid}"
                ScaleY="{Binding ActualHeight, ElementName=grid}" />
    </Grid.Resources>
    <Path Stroke="Red" StrokeThickness="15" Stretch="Fill">
        <Path.Data>
            <PathGeometry Transform="{StaticResource transform}">
                <PathGeometry.Figures>
                    <PathFigureCollection>
                        <PathFigure IsClosed="True" StartPoint="0,0.7">
                            <PathFigure.Segments>
                                <PathSegmentCollection>
                                    <LineSegment Point="1,1" />
                                    <LineSegment Point="1,0" />
                                    <LineSegment Point="0,0.3" />
                                </PathSegmentCollection>
                            </PathFigure.Segments>
                        </PathFigure>
                    </PathFigureCollection>
                </PathGeometry.Figures>
            </PathGeometry>
        </Path.Data>
    </Path>
</Grid>
smg
  • 1,096
  • 2
  • 11
  • 27

1 Answers1

0

If it's ok not to scale the stroke thickness, you might drop the Viewbox and set Stretch="Fill" directly at the Path:

<Grid Background="Yellow" ClipToBounds="True" Margin="20">
    <Path Stretch="Fill" Data="M30,0 L0,10 L0,40 L30,50 L30,0 Z"
          Stroke="Red" StrokeThickness="20" />
</Grid>

Otherwise you might use the Path in a VisualBrush in e.g. a Rectangle (which needs to have some size set explicitly):

<Grid Background="Yellow" ClipToBounds="True" Margin="20">
    <Viewbox Stretch="Fill">
        <Rectangle Width="1" Height="1">
            <Rectangle.Fill>
                <VisualBrush>
                    <VisualBrush.Visual>
                        <Path Data="M30,0 L0,10 L0,40 L30,50 L30,0 Z"
                              Stroke="R*emphasized text*ed" StrokeThickness="5" />
                    </VisualBrush.Visual>
                </VisualBrush>
            </Rectangle.Fill>
        </Rectangle>
    </Viewbox>
</Grid>

Please also note that the path geometry is closed by a trailing Z.

Clemens
  • 123,504
  • 12
  • 155
  • 268
  • Not what I want, but I found solution [here](http://stackoverflow.com/a/15323221/3009578) – smg Oct 14 '14 at 18:10