Come posso sostituire completamente il contenuto di un pulsante WPF con un percorso grafico?

Question

Ho decostruito un pulsante WPF standard usando Blend e sono riuscito a creare un pulsante ben disegnato, ma non riesco a capire come far riempire il percorso all'interno dello spazio del pulsante (la larghezza e l'altezza del pulsante). Inoltre, non sono sicuro se devo specificare ContentPresenter o anche se è corretto. Sto cercando il testo al centro del pulsante (come di consueto) ma con il mio percorso grafico dietro di esso.

Qualcuno può darmi un feedback su come realizzare questo? Lo stile è definito come;

    <ControlTemplate x:Key="CurvedButton" TargetType="{x:Type Button}">
        <Grid>
            <Path Fill="#ff951c1f" Data="F1 M 64,16 C 64,24 56,31 48,31 L 15,31 C 7,31 0,24 0,16 C 0,7 7,0 15,0 L 48,0 C 56,0 64,7 64,16 Z" />
            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Width="Auto" />
        </Grid>
    </ControlTemplate>

L'uso di questo pulsante è;

<StackPanel>
    <Button Template="{StaticResource CurvedButton}" FontFamily="MS Trebuchet" FontSize="40" Width="200" Height="120" Foreground="Black">XXXXXXXXXXX</Button>
</StackPanel>

Al termine, dovrebbe apparire come un pulsante rosso sinuoso.

Grazie in anticipo

Ryan

Answer 1

Ci sono un paio di cose che puoi fare per ottenere i risultati che stai cercando.

Posiziona il percorso in un riquadro di visualizzazione e allungalo per riempirlo:

<ControlTemplate x:Key="CurvedButton" TargetType="{x:Type Button}">
    <Grid>
        <Viewbox Stretch="Fill">
            <Path Fill="#ff951c1f" Data="F1 M 64,16 C 64,24 56,31 48,31 L 15,31 C 7,31 0,24 0,16 C 0,7 7,0 15,0 L 48,0 C 56,0 64,7 64,16 Z" />
        </Viewbox>
        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Width="Auto" />
    </Grid>
</ControlTemplate>

Usa un bordo invece di un percorso:

<ControlTemplate x:Key="CurvedButton" TargetType="{x:Type Button}">
    <Grid>
        <Border CornerRadius="40" Background="#ff951c1f">
            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Width="Auto" />
        </Border>
    </Grid>
</ControlTemplate>