WPF의 링크 버튼


90

Button을 LinkButton처럼 보이게 만들고 Hyperlink를 사용하고 싶지 않습니다 ... !!

모든 제안


1
누군가 관심이 있다면 여기에있는 모든 답변의 문제는 답변의 링크가 실제로 링크처럼 작동하지 않는다는 것입니다. 그들은 방문한 URL 기록을 알지 못하며 색상은 시스템 URL 색상이 아닙니다. 그러나 이러한 요구 사항이 없으면 괜찮습니다.

올바른 Windows 색상을 사용하는 방법을 알아 내려고합니다. stackoverflow.com/questions/5094447
Zack Peterson

답변:


148

일반적인 Button 스타일을 원하지 않고 하이퍼 링크처럼 보이는 것을 원한다면 이것으로 시작할 수 있습니다.

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

다음은 스타일과 동일합니다.

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

다음과 같이 사용할 수 있습니다.

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

여기에 오타가 있습니다-LinkButon
GarethD

2
이 답변은 밑줄과 텍스트 사이에 공백이있는 버튼을 생성합니다. @Christians 대답은 이것을 해결합니다.
Greg Sansom 2012

또한 하이퍼 링크 위로 마우스를 가져갈 때 "손"포인터가 없습니다. 이 기능에 대한 커뮤니티 위키 답변을 사용하십시오.
AlbatrossCafe

<Trigger Property="IsEnabled" Value="False"><Setter Property="Foreground" Value="Gray" /> </Trigger>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>

MichaC와 Anderson의 버전은 밑줄을 약간 잘못 배치했습니다. 여기 TextBlockContentPresenter.


1
Christian : 어떻게 당신의 스타일을 사용하여 밑줄을 볼 수 없습니까? MichaC는 나를 위해 잘 작동했습니다.
newman

이것은 나에게도 효과가 없습니다. ContentPresenter.Resources 내의 스타일은 Button 내의 어떤 TextBlock에도 적용되지 않습니다
Clyde

좋아, 문제는 스타일이 암시 적으로 생성 된 TextBlock에만 적용되는 것 같습니다
Clyde

<Button Style = "{StaticResource LinkButton}"> 텍스트 </ Button> 작동
Clyde

<Button Style = "{StaticResource LinkButton}"> <TextBlock Text = "test"/> </ Button>이 작동하지 않음
Clyde

30

다음 Style은 모든 버튼에서 재사용 할 수 있도록 구현 된 MichaC의 제안입니다 .

<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
이 답변의 99 %가 MichaC에서 도난 당했다는 점을 고려하여 커뮤니티 위키로 만들었습니다. :)
Anderson Imes

11

가장 쉬운 방법 (내 응용 프로그램에서 수행) :

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

TextDecoration을 완전히 제어 할 수 있습니다 (예 : 펜 스타일 또는 오프셋 변경). 자세한 내용은 다음 링크를 참조하십시오. http://msdn.microsoft.com/en-us/library/system.windows.textdecorations.underline.aspx


4
나쁜 습관, 제안 된대로 링크 버튼을 스타일링하는 것이 훨씬 낫습니다. 50 개의 LinkButton이 있다면 어떻게 될까요? 또한 마우스 오버 동작을 추가해야하거나 다른 장식을 추가해야하는 경우에는 어떻습니까?
Tomer W

3
나는 Tomer에 동의하지 않습니다. "나쁜 실행"은 더 간단한 접근 방식이 필요하지 않다는 것을 의미합니다. 지금은 이것이 완벽한 솔루션 인 경우가 있습니다. 즉, 코드 숨김에서 버튼을 만드는 것입니다.) 감사합니다 Siavash.
Gabe Halsmer 2014 년

예, 이것은 나쁜 습관이 아닙니다. 일부 시나리오에 적합합니다.
Richard Moore

8

사용하는 또 다른 해결책 Hyperlink은 내부에 넣는 것입니다 TextBlock.

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

2

하이퍼 링크를 사용하지 않는 이유는 무엇입니까?

<Button>
    <Hyperlink>
</Button>

Coz, Visual tree에서 부모를 얻으려고 할 때마다 Hyperlink가 시각적이거나 Visual3d가 아니라는 예외가 발생합니다
Prashant Cholachagudda

이것을 사용하고 싶습니다. 작동했지만 버튼 가장자리의 그림자를 제거 할 수없는 것 같습니다. 어떻게하나요?
Donny V.
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.