[原译]自定义WPF LinkLabel 控件

WPF里是没有LinkLabel控件的。因此我自己写一个。首先。我们看一下WPF中什么类似的组件可以实现这个链接功能

如果你想要模拟一个LinkLabel控件。你可以在TextBlock里使用内联的Hyperlink。像下面这样

<TextBlock>
    <Hyperlink>
        <Run Text="Test link"/>
    </Hyperlink>
</TextBlock>

 

你可以使用Label控件。加一个内联的HyperLink,但是我认为TextBlock更好。因为你可以在Expression Blend 中通过InlineCollection  编辑所有子元素的属性

图1


虽然这种方法也行,但是我还是不太喜欢。因为我觉得我还是写一个类似windows窗体程序中的LinkLabel控件。然后我就做了。首先看一下控件的样子

图2

第一个是默认的LinkLabel控件。第二个是LinkLabelBehavior 属性被设置为HoverUnderline ,第三个的Foreground和 HoverForeground 属性都使用了自定的颜色。

 

LinkLabel控件支持的属性

1.Foreground和 HoverForeground属性

允许自定义这两个属性的值

2.LinkLabelBehavior 属性

允许设置下划线的显示与否

3.自定义HyperlinkStyle 属性

你可以使用这个属性给超链接设置自定义的样式。如果你已经自定了Foreground和 HoverForeground。则会被覆盖。

Url 超链接的目标

所有这些属性都继承自标准的System.Windows.Controls.Label 控件

通过Blend/Xaml设置这些属性很简单

<ThemedControlLibrary:LinkLabel Content="Link Label" FontSize="22"/>
<ThemedControlLibrary:LinkLabel Content="Link Label" LinkLabelBehavour="HoverUnderline" />
<ThemedControlLibrary:LinkLabel Foreground="#FF847901" HoverForeground="#FF06C8F2" Content="Link Label" LinkLabelBehavour="NeverUnderline"/>

图三

然后是控件的使用方法。仅仅添加命名空间到xaml中。然后使用就行了。

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    x:Class="DemoApplication.Window1"
    Title="DemoApplication" Height="300" Width="300"
    xmlns:ThemedControlsLibrary="clr-namespace:ThemedControlsLibrary;assembly=ThemedControlsLibrary"
    >
    <Grid>
        <ThemedControlsLibrary:LinkLabel HorizontalAlignment="Left" VerticalAlignment="Top" Content="LinkLabel"/>
    </Grid>
</Window>

 

 

控件的完整代码很简单。就定义一下需要的属性,和控制这些属性应该显示在Blend中的(category)目录位置就行了。

public class LinkLabel : Label
{
    private const string _linkLabel = "LinkLabel";

    public static readonly DependencyProperty UrlProperty = DependencyProperty.Register("Url", typeof(Uri), typeof(LinkLabel));

    [Category("Common Properties"), Bindable(true)]
    public Uri Url
    {
        get { return GetValue(UrlProperty) as Uri; }
        set { SetValue(UrlProperty, value); }
    }

    public static readonly DependencyProperty HyperlinkStyleProperty = DependencyProperty.Register("HyperlinkStyle", typeof(Style),
            typeof(LinkLabel));

    public Style HyperlinkStyle
    {
        get { return GetValue(HyperlinkStyleProperty) as Style; }
        set { SetValue(HyperlinkStyleProperty, value); }
    }

    public static readonly DependencyProperty HoverForegroundProperty = DependencyProperty.Register("HoverForeground", typeof(Brush),
            typeof(LinkLabel));

    [Category("Brushes"), Bindable(true)]
    public Brush HoverForeground
    {
        get { return GetValue(HoverForegroundProperty) as Brush; }
        set { SetValue(HoverForegroundProperty, value); }
    }

    public static readonly DependencyProperty LinkLabelBehavourProperty = DependencyProperty.Register("LinkLabelBehavour",            typeof(LinkLabelBehaviour),     typeof(LinkLabel));

    [Category("Common Properties"), Bindable(true)]
    public LinkLabelBehaviour LinkLabelBehavour
    {
        get { return (LinkLabelBehaviour)GetValue(LinkLabelBehavourProperty); }
        set { SetValue(LinkLabelBehavourProperty, value); }
    }

    static LinkLabel()
    {
        FrameworkElement.DefaultStyleKeyProperty.OverrideMetadata(
            typeof(LinkLabel),
            new FrameworkPropertyMetadata(typeof(LinkLabel)));
    }

}

为了使得内容可以绑定。我使用了Filipe Fortes 实现的BindableRun 我添加BindableRun  到控件模板中

<local:BindableRun BoundText="{Binding RelativeSource= {RelativeSource TemplatedParent}, Path=Content}"/>

 

为了支持不同的主题显示。应该在工程里有个Themes文件夹。包含控件的样式。LinkLabel只有一个样式文件Generic.xaml,因为超链接样式不管当前主题是什么。都是一样的。我不会包含LinkLabel 的模板。

 

多看源代码。下载并且开始使用吧。

示例和源码下载

原文地址:building-a-wpf-linklabel-control

著作权声明:本文由http://leaver.me 翻译,欢迎转载分享。请尊重作者劳动,转载时保留该声明和作者博客链接,谢谢!

转载于:https://www.cnblogs.com/lazycoding/archive/2012/10/11/2719778.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值