Przycisk łącza w wpf

90

Jak mogę sprawić, by Button wyglądał jak LinkButton i nie chcę używać hiperłącza ... !!

Jakieś sugestie

Prashant Cholachagudda
źródło
1
Jeśli kogoś to obchodzi, problem ze wszystkimi odpowiedziami tutaj polega na tym, że linki w odpowiedziach w rzeczywistości nie zachowują się jak linki. Nie znają historii odwiedzanych adresów URL, a kolory nie są kolorami systemowych adresów URL. Ale jeśli nie masz tych wymagań, są w porządku.
Próbuję dowiedzieć się, jak użyć właściwych kolorów systemu Windows. stackoverflow.com/questions/5094447
Zack Peterson

Odpowiedzi:

150

Jeśli nie chcesz żadnego z normalnego stylu przycisku i po prostu chcesz czegoś, co wygląda jak hiperłącze, możesz zacząć od tego

<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>

Oto to samo, co styl:

<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>

i możesz go używać w ten sposób:

<Button Style="{StaticResource LinkButton}" Content="Clicky" />
MichaC
źródło
Zwróć uwagę, że jest tu literówka - LinkButon
GarethD
2
Ta odpowiedź tworzy przycisk, który ma spację między podkreśleniem a tekstem. @Christians odpowiedz rozwiązuje ten problem.
Greg Sansom,
To również nie ma wskaźnika „dłoni” po najechaniu kursorem na hiperłącze. Użyj odpowiedzi wiki społeczności, aby skorzystać z tej funkcji.
AlbatrossCafe
Proponuję dodać <Trigger Property="IsEnabled" Value="False"><Setter Property="Foreground" Value="Gray" /> </Trigger>do obsługi stan IsEnabled
simon
34
<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>

Wersje MichaCa i Andersona umieściły podkreślenie nieco nieprawidłowo, tutaj jest zaktualizowana wersja, która po prostu doda podkreślenie do wszystkich elementów TextBlockznajdujących się w ContentPresenter.

chrześcijanin
źródło
1
Christian: Dlaczego nie widzę żadnego podkreślenia w twoim stylu? MichaC po prostu działał dobrze dla mnie.
newman
Dla mnie to też nie działa. Styl ContentPresenter.Resources po prostu nie jest stosowany do żadnego TextBlocka w przycisku
Clyde
OK, wydaje się, że problem polega na tym, że styl ma zastosowanie tylko do niejawnie wygenerowanego TextBlock
Clyde
<Button Style = "{StaticResource LinkButton}"> Tekst </Button> działa
Clyde
<Button Style = "{StaticResource LinkButton}"> <TextBlock Text = "test" /> </Button> nie działa
Clyde
30

Oto sugestia MichaC zaimplementowana jako Style, której możesz użyć ponownie na dowolnym przycisku:

<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>
Anderson Imes
źródło
8
Utworzono z tego wiki społeczności, biorąc pod uwagę, że 99% tej odpowiedzi zostało skradzione z MichaC :)
Anderson Imes
11

Najprościej (robię to w mojej aplikacji):

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

masz pełną kontrolę nad TextDecoration, np. zmienić styl pisaka lub przesunięcie. spójrz na ten link, aby dowiedzieć się więcej: http://msdn.microsoft.com/en-us/library/system.windows.textdecorations.underline.aspx

Siavash Mortazavi
źródło
4
Zła praktyka, stylizowanie przycisku łącza zgodnie z sugestią jest o wiele lepsze ... a co jeśli masz 50 takich przycisków LinkButtons? Co więcej, jeśli musisz dodać akcję najechania, a może inną dekorację?
Tomer W,
3
Nie zgadzam się z Tomerem. „zła praktyka” oznacza, że ​​nigdy nie ma potrzeby stosowania prostszego podejścia. Mam teraz przypadek, w którym było to idealne rozwiązanie, tj. Tworzenie przycisku w kodzie). Dzięki Siavash.
Gabe Halsmer
Tak, to nie jest zła praktyka. Świetnie sprawdzi się w niektórych scenariuszach.
Richard Moore,
9

Innym rozwiązaniem Hyperlinkjest włożenie do środka TextBlock.

<TextBlock>
    <Hyperlink Click="...">
        <TextBlock Text="Link text" />
    </Hyperlink>
</TextBlock>
xmedeko
źródło
2

Dlaczego nie chcesz używać hiperłącza?

<Button>
    <Hyperlink>
</Button>
Ana Betts
źródło
Coz, za każdym razem, gdy próbuję uzyskać rodzica w drzewie Visual, generuje wyjątek mówiący, że hiperłącze nie jest wizualne lub Visual3d
Prashant Cholachagudda
Chcę tego użyć. Mam to działające, ale nie mogę pozbyć się cienia na krawędziach przycisku. Jak to robisz?
Donny V.