2013-07-08 11 views
7

Ho un requisito di creazione di un pulsante che prende le forme, come nell'immagine seguente:personalizzato pulsante a forma di in WPF

enter image description here

Qualcuno può aiutarmi? Grazie in anticipo!

+2

domande devono dimostrare un minimal underst risoluzione del problema da risolvere. Dicci cosa hai cercato di fare, perché non ha funzionato e come dovrebbe funzionare. Vedi anche: [Elenco di controllo domande Stack Overflow] (http://meta.stackexchange.com/questions/156810/stack-overflow-question-checklist) – JDB

risposta

19

È possibile utilizzare un ControlTemplate per raggiungere questo:

<Style x:Key="ButtonStyle" TargetType="{x:Type Button}"> 
     <Setter Property="Background" Value="Black"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type Button}"> 
        <Path Fill="{TemplateBinding Background}" 
          Data="M 0,0 A 100,100 90 0 0 100,100 L 100,100 100,0" /> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

Che lo si applica al pulsante:

<Button Style="{StaticResource ButtonStyle}"/> 

Se avete bisogno di alcuni riferimenti per disegnare il "Percorso" check this MSDN collegamento .

Aggiornamento

Per visualizzare il contenuto è necessario utilizzare un ContentPresenter, qualcosa di simile:

<Style x:Key="ButtonStyle" TargetType="{x:Type Button}"> 
     <Setter Property="Background" Value="Black"/> 
     <Setter Property="HorizontalAlignment" Value="Center"/> 
     <Setter Property="VerticalContentAlignment" Value="Center"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type Button}"> 
        <Grid> 
         <Path Fill="{TemplateBinding Background}" 
          Data="M 0,0 A 100,100 90 0 0 100,100 L 100,100 100,0" /> 
         <ContentPresenter VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
              HorizontalAlignment="{TemplateBinding HorizontalAlignment}"/> 
        </Grid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

Nella tasto:

<Button Style="{StaticResource ButtonStyle}" Foreground="White"> 
     test 
    </Button> 

enter image description here

+0

Grazie amico! Funziona. Tuttavia, mi piacerebbe sapere come posso impostare un contenuto per questo? Quando imposto un contenuto sul pulsante non viene visualizzato. –

+0

Per mostrare il contenuto è necessario inserire un ContentPresenter – cbcol