WPF中的链接按钮


90

如何使Button看起来像LinkBut​​ton,而又不想使用Hyperlink ...!

有什么建议


1
如果有人在乎,这里所有答案的问题在于答案中的链接实际上并不像链接那样。他们不了解访问的网址历史记录,并且颜色不是系统网址颜色。但是,如果您没有这些要求,则可以。

我试图弄清楚如何使用正确的Windows颜色。stackoverflow.com/questions/5094447
— Zack Peterson

Answers:


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

请注意,这里有一个错字-LinkBut​​on
— GarethD

2
该答案产生一个按钮,该按钮在下划线和文本之间有一个空格。@Christians答案解决了这个问题。
— 格雷格·桑索姆

将鼠标悬停在超链接上时,它也没有“ hand”指针。使用社区Wiki答案可获得此功能。
— 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的版本在下划线上放置了一些错误,这是一个更新的版本,只会TextBlock向内的任何内容添加下划线ContentPresenter。


1
克里斯蒂安:我怎么看不到使用您的样式的下划线?MichaC对我来说还不错。
— 纽曼

这对我也不起作用。ContentPresenter.Resources中的样式并未应用到Button内的任何TextBlock上
— Clyde 2012年

好的,问题似乎在于该样式仅适用于隐式生成的TextBlock
— Clyde

<Button Style =“ {StaticResource LinkBut​​ton}”>文本</ Button>有效
— Clyde 2012年

<Button Style =“ {StaticResource LinkBut​​ton}”> <TextBlock Text =“ test” /> </ Button>不起作用
— Clyde 2012年

30

这是MichaC的建议,实现为Style您可以在任何按钮上重复使用:

<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盗取的,因此将其设为社区Wiki :)
— Anderson Imes 2010年

11

最简单的方法(我在应用程序中执行此操作):

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

您可以完全控制TextDecoration,例如更改笔样式或偏移量。查看此链接以了解更多信息:http : //msdn.microsoft.com/zh-cn/library/system.windows.textdecorations.underline.aspx


4
不好的做法,按建议的方式设计“链接”按钮要好得多...如果您有50个这样的LinkBut​​ton怎么办?此外,如果需要添加悬停动作或其他装饰,该怎么办?
— Tomer W

3
我不同意托默尔。“坏习惯”意味着永远不需要这种更简单的方法。我现在有一个案例,这是一个完美的解决方案,即在后台代码中创建按钮。谢谢Siavash。
— ·霍尔斯默

是的,这不是一个坏习惯。在某些情况下将是完美的。
— 理查德·摩尔

8

使用的另一种解决方案Hyperlink是放入内部TextBlock。

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

2

为什么不想使用超链接?

<Button>
    <Hyperlink>
</Button>

Coz,每当我尝试在Visual树中获取父项时,都会引发异常,指出超链接不是Visual或Visual3d
— Prashant Cholachagudda 09年

我要用这个 我可以使用它,但似乎无法消除按钮边缘的阴影。你是怎样做的?
— Donny V. 2010年
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.