Question

Here’s my custom buttons template:

<Button.Template>
    <ControlTemplate TargetType="{x:Type Button}">
        <Grid>
            <Path x:Name="Inner" Stretch="Fill" Fill="{TemplateBinding Background}" Data="F1 M 249.989,59.8321L 399.989,59.8321L 429.989,88.1654L 399.989,120.165L 249.989,120.165L 279.989,88.1654L 249.989,59.8321 Z ">
                <Path.Effect>
                    <DropShadowEffect BlurRadius="10" Opacity="0.5" ShadowDepth="4" />
                </Path.Effect>
            </Path>
            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
            <Path x:Name="Border" Stretch="Fill" Stroke="{TemplateBinding BorderBrush}" Data="F1 M 249.989,59.8321L 399.989,59.8321L 429.989,88.1654L 399.989,120.165L 249.989,120.165L 279.989,88.1654L 249.989,59.8321 Z " />
        </Grid>
    </ControlTemplate>
</Button.Template>

And here’s how it displays:

What I’d like it to do is to size the 2 Path’s so that it fits the content. This is part of a breadcrumb custom control, and I’d like each breadcrumb to only take up as much space as is needed. I can’t figure out how to get the Path’s to size to the ContentPresenter.

I’ve tried binding the width and height of the path’s to the ContentPresenters width and height but no dice :/

Note that in the image above, the text fits in the width and height of the Path, however, when I add text or remove text from the ContentPresenter, it does not resize.

Answer 1

I’d suggest binding the Path property to the ActualWidth/ActualHeight of the ContentPresenter, using a Converter to calculate the Path.Data

Since two properties are needed (Height and Width), you’ll need an IMultiValueConverter, or you’ll need to pass the entire ContentPresenter into your binding, like this:

Path Data="{Binding ElementName=MyContentPresenter, 
                    Converter={StaticResource Path1Converter}}" />

Also, don’t forget you can use lowercase letters in your Path.Data to specify relative points instead of always having to use absolute points.