Pulsante di collegamento in wpf


90

Come posso fare in modo che Button assomigli a LinkButton e non voglio usare Hyperlink ... !!

Eventuali suggerimenti


1
Se a qualcuno interessa, il problema con tutte le risposte qui è che i collegamenti nelle risposte non si comportano effettivamente come collegamenti. Non sono a conoscenza della cronologia degli URL visitati e i colori non sono i colori dell'URL di sistema. Ma se non hai questi requisiti, vanno bene.

Sto cercando di capire come utilizzare i colori di Windows corretti. stackoverflow.com/questions/5094447
Zack Peterson

Risposte:


148

Se non vuoi alcuno del normale stile Button e vuoi solo qualcosa che assomigli a un collegamento ipertestuale, potresti iniziare con questo

<Button Margin="5" Content="Test" Cursor="Hand">
    <Button.Template>
        <ControlTemplate TargetType="Button">
            <TextBlock TextDecorations="Underline">
                <ContentPresenter />
            </TextBlock>
        </ControlTemplate>
    </Button.Template>
    <Button.Style>
        <Style TargetType="Button">
            <Setter Property="Foreground" Value="Blue" />
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="true">
                    <Setter Property="Foreground" Value="Red" />
                </Trigger>
            </Style.Triggers>
        </Style>
    </Button.Style>
</Button>

È lo stesso di uno stile:

<Style
    x:Key="LinkButton"
    TargetType="Button">
    <Setter
        Property="Template">
        <Setter.Value>
            <ControlTemplate
                TargetType="Button">
                <TextBlock
                    TextDecorations="Underline">
                <ContentPresenter /></TextBlock>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Setter
        Property="Foreground"
        Value="Blue" />
    <Style.Triggers>
        <Trigger
            Property="IsMouseOver"
            Value="true">
            <Setter
                Property="Foreground"
                Value="Red" />
        </Trigger>
    </Style.Triggers>
</Style>

e puoi usarlo in questo modo:

<Button Style="{StaticResource LinkButton}" Content="Clicky" />

Si prega di notare che c'è un errore di battitura qui - LinkButon
GarethD

2
Questa risposta produce un pulsante che ha uno spazio tra la sottolineatura e il testo. La risposta di @Christians risolve questo problema.
Greg Sansom

Anche questo non ha il puntatore "mano" quando si passa con il mouse sul collegamento ipertestuale. Usa la risposta wiki della comunità per questa funzionalità.
AlbatrossCafe

Suggerisco di aggiungere <Trigger Property="IsEnabled" Value="False"><Setter Property="Foreground" Value="Gray" /> </Trigger>per gestire lo stato IsEnabled
simon

33
<Style x:Key="LinkButton" 
       TargetType="Button"
       BasedOn="{StaticResource ResourceKey={x:Type Button}}"
       >

    <Setter Property="Width" Value="Auto"/>

    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <ContentPresenter Content="{TemplateBinding Content}" 
                                  ContentTemplate="{TemplateBinding  ContentTemplate}"
                                  VerticalAlignment="Center"
                                  >
                    <ContentPresenter.Resources>
                        <Style TargetType="{x:Type TextBlock}">
                            <Setter Property="TextDecorations" Value="Underline" />
                        </Style>
                    </ContentPresenter.Resources>
                </ContentPresenter>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Setter Property="Foreground" Value="Blue" />
    <Setter Property="Cursor" Value="Hand" />
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="true">
            <Setter Property="Foreground" Value="Red" />
        </Trigger>
    </Style.Triggers>
</Style>

La versione di MichaC e Anderson ha posto la sottolineatura leggermente sbagliata, ecco una versione aggiornata che aggiungerà semplicemente una sottolineatura a qualsiasi TextBlockcosa si trovi all'interno del file ContentPresenter.


1
Christian: Come mai non riesco a vedere nessuna sottolineatura usando il tuo stile? MichaC ha funzionato bene per me.
newman

Anche questo non funziona per me. Lo stile all'interno di ContentPresenter.Resources non viene applicato a nessun TextBlock all'interno del Button
Clyde

OK, il problema sembra essere che lo stile si applica solo a un TextBlock generato implicitamente
Clyde

<Button Style = "{StaticResource LinkButton}"> Testo </Button> funziona
Clyde

<Button Style = "{StaticResource LinkButton}"> <TextBlock Text = "test" /> </Button> non funziona
Clyde

30

Ecco il suggerimento di MichaC implementato come un Styleche puoi riutilizzare su qualsiasi pulsante:

<Style x:Key="LinkButton" TargetType="Button">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <TextBlock TextDecorations="Underline">
                    <ContentPresenter />
                </TextBlock>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Setter Property="Foreground" Value="Blue" />
    <Setter Property="Cursor" Value="Hand" />
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="true">
            <Setter Property="Foreground" Value="Red" />
        </Trigger>
    </Style.Triggers>
</Style>

8
Ha reso questo un wiki della comunità, considerando che il 99% di questa risposta è stata rubata da MichaC :)
Anderson Imes

11

Il modo più semplice (lo faccio nella mia applicazione):

<TextBlock Name="..."
   Text="..."
   Cursor="Hand"
   Foreground="Blue"
   TextDecorations="Underline"
   MouseLeftButtonUp=..."
/>

hai il pieno controllo su TextDecoration, ad esempio cambia lo stile della penna o l'offset. dai un'occhiata a questo link per saperne di più: http://msdn.microsoft.com/en-us/library/system.windows.textdecorations.underline.aspx


4
Cattiva pratica, lo stile di un pulsante Link come suggerito è molto meglio ... cosa succede se hai 50 LinkButton come quello? Inoltre, cosa succede se è necessario aggiungere un'azione Hover o forse una decorazione diversa?
Tomer W

3
Non sono d'accordo con Tomer. "cattiva pratica" implica che non c'è mai bisogno di questo approccio più semplice. In questo momento ho un caso in cui questa era la soluzione perfetta, ovvero la creazione di un pulsante in code-behind). Grazie Siavash.
Gabe Halsmer

Sì, questa non è una cattiva pratica. Sarà perfetto per alcuni scenari.
Richard Moore

8

Un'altra soluzione da utilizzare Hyperlinkè inserire all'interno TextBlock.

<TextBlock>
    <Hyperlink Click="...">
        <TextBlock Text="Link text" />
    </Hyperlink>
</TextBlock>

2

Perché non vuoi usare Hyperlink?

<Button>
    <Hyperlink>
</Button>

Perché ogni volta che provo a ottenere un genitore nell'albero visivo, genera un'eccezione che dice che il collegamento ipertestuale non è visivo o Visual3d
Prashant Cholachagudda

Voglio usare questo. Ho funzionato ma non riesco a sbarazzarmi dell'ombra sui bordi del pulsante. Come si fa a farlo?
Donny V.
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.