Modello di pulsante con immagine e testo nel wpf

Voglio creare pulsanti con immagini e testo all'interno. Ad esempio, utilizzerei immagini e testo diversi per pulsanti come "Sfoglia cartelle" e "Importa". Una delle opzioni sarebbe utilizzare un modello. Ho dato un'occhiata a domanda simliarModello di pulsante con immagine e testo nel wpf

Creating an image+text button with a control template?

Ma esiste un modo con cui posso legare la fonte di immagine senza l'utilizzo di una proprietà di dipendenza o di qualsiasi altra classe?

Grazie

fonte

2010-04-28 Archie

No. Cosa vorresti associare la Image.Source a? Hai bisogno di una proprietà di dipendenza per questo. Naturalmente, puoi anche definire una classe normale che contiene due proprietà: Text e ImageSource o Uri e quindi utilizzare un DataTemplate per eseguire il rendering di istanze di questa classe, ma sarebbe ancora più codice da scrivere ed è un po '"puzzolente" ".

Qual è il motivo per cui non si desidera utilizzare una proprietà di dipendenza o una classe personalizzata?

fonte

2010-04-28 07:19:31 gehho

L'unica ragione è che volevo sapere se c'è un altro modo semplice o si può dire piuttosto un modo "meno codice" per farlo. Con texblock posso usare Volevo sapere perché non posso fare lo stesso con la proprietà Source di un'immagine? – Archie

Ma ** dove ** vuoi mettere quel 'TemplateBinding'? E a ** quale proprietà ** vinceresti? – gehho

Posso usare la proprietà 'Tag' per vincolarlo? – Archie

Non deve essere così complicato. Qualcosa di semplice come mettere uno StackPanel all'interno di un tasto farà il trucco:

<Button> 
    <StackPanel> 
    <TextBlock>My text here</TextBlock> 
    <Image Source="some.jpg" Stretch="None" /> 
    </StackPanel> 
</Button>

Quindi è possibile configurare lo StackPanel per controllare dove dovrebbe comparire il testo, l'allineamento, ecc

fonte

2010-12-20 01:03:35 Marshal

Ok, ma come si imposta il carattere di sottolineatura? Se metto "_Il mio testo qui" rende la sottolineatura e alt + M non funziona più. Quindi, come lo recuperi? – BrainSlugs83

Inoltre, come si ottiene a ridurre l'immagine in modo che il pulsante non esploda alla dimensione dell'immagine (cioè se ho un'immagine che è 40x40 e un pulsante di qualsiasi dimensione pulsanti sono - Non voglio per impostare manualmente quello - come faccio a ottenere l'immagine a ridursi alla giusta dimensione invece di far esplodere il mio pulsante per essere più grande? – BrainSlugs83

Vorrei aggiungere che probabilmente vorrai impostare l'opzione "Orientamento" di "StackPanel" su "Orizzontale" per farli allineare uno accanto all'altro. Nota che se hai usato una griglia invece di uno StackPanel dovresti giocare con i margini per centrare l'immagine e il testo sul pulsante in orizzontale (quindi lo stackpanel è la strada da percorrere). –

ho aggiunto alcune cose da allinearli ben

<Button> 
    <StackPanel Orientation="Horizontal"> 
     <Image Source="/ApplicationName;component/Images/MyImage.ico"/> 
     <Label Padding="0">My Button Text</Label> 
    </StackPanel> 
</Button>

fonte

2011-04-17 21:13:42 Sean

Bene che ha funzionato per darmi una normale etichetta di pulsante (cioè con tasti di scelta rapida alt + lettera) - Ho provato a fare clic sul pulsante quando premo la combinazione corretta. - Ora ho solo bisogno di capire come ridurre la mia immagine alla dimensione del pulsante e non far sì che i pulsanti diventino tutti enormi. – BrainSlugs83

<Button> 
     <StackPanel Orientation="Horizontal"> 
      <Image Source="Resources/add.png" Stretch="None" /> 
      <TextBlock Margin="5,0,0,0">Add</TextBlock> 
     </StackPanel> 
    </Button>

fonte

2011-04-30 22:57:07 mpen

<Button x:Name="MyCoolButton"Width="200" Height="75"> 
<Grid > 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="Auto" /> 
     <ColumnDefinition Width="*" /> 
    </Grid.ColumnDefinitions> 
    <Image Source="Pete-Brown-Silverlight-in-Action.png" Margin="5" Grid.Column="0" /> 
    <StackPanel Grid.Column="1" Margin="5"> 
     <TextBlock Text="Buy My Book!" FontWeight="Bold" /> 
     <TextBlock Text="Pete is writing THE Silverlight 4 book" TextWrapping="Wrap" /> 
    </StackPanel> 
</Grid>

fonte

2012-05-23 05:04:29 daniel

Aggiunto Stretch = "Uniform" alla risposta di Sean per affrontare il caso se l'immagine è originariamente più grande della dimensione del pulsante (nel suo commento si è parlato anche di BrainSlugs83). Maggiori dettagli sulle opzioni di Stretching a MSDN.

<Button> 
    <StackPanel Orientation="Horizontal"> 
     <Image Source="/ApplicationName;component/Images/MyImage.ico" Stretch="Uniform"/> 
     <Label Padding="0">My Button Text</Label> 
    </StackPanel> 
</Button>

voluto aggiungere questo come un commento alla risposta sotto BrainSlugs83, ma può non ancora a causa della mancanza di punti ed è stata respinta di modificare la risposta di Sean.

fonte

2015-02-04 18:59:23 userN45290

Modello di pulsante con immagine e testo nel wpf

risposta

Problemi correlati