Przycisk łącza w wpf


90

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

Jakieś sugestie


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

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.


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>

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


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>

2

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

<Button>
    <Hyperlink>
</Button>

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.
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.