.netwpfxamlpathgeometry

WPF Path Geometry; drawing a box with a centred arrow on the top


I am trying to draw a simple box with an "arrow head" centred at the top, but I do not seem to be able to get that arrow head to centre (as shown in the following example, the arrow heads are always offset to the left)...

An example of what I have so far

Here is my XAML (this is actually inside a template but I do not think that is the problem)...

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="16" />
        <RowDefinition />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>
    <Rectangle Grid.Row="2"
                Fill="{TemplateBinding Background}" />
    <ContentPresenter Grid.Row="2"
                        Content="{TemplateBinding Content}"
                        ContentTemplate="{TemplateBinding ContentTemplate}"
                        ContentTemplateSelector="{TemplateBinding ContentTemplateSelector}"
                        Margin="{TemplateBinding Padding}"
                        HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                        VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
    <Path HorizontalAlignment="Center"
            Grid.Row="1"
            Fill="{TemplateBinding Background}"
            Data="M -8,0 L 0,-16 8,0" />
</Grid>

The "Content" for the ContentPresenter is a StackPanel that may or may not have TextBlock children.

What am I doing wrong?


Solution

  • As long as Stretch is None, the Path's ActualWidth and ActualHeight (and hence its alignment) doesn't take into account the parts of its geometry that are drawn at negative coordinates.

    Change it to

    <Path HorizontalAlignment="Center" Data="M 0,0 L 8,-16 16,0" ... />
    

    or

    <Path HorizontalAlignment="Center" Data="M -8,0 L 0,-16 8,0"
          Stretch="Uniform" Width="16" Height="16" ... />