之前做项目时,为了实现类似微信消息数目的效果

 
image.png

,我之前是修改的ControlTemplate。类似于将一个带数字的控件,放在另一个控件的右上角,来实现的这个效果。
原来WPF有个Adorner,也可以实现这样的效果。
WPF中很多控件,都带Adorner层。这相当于一个控件的装饰层。我们在这里面可以做出很多蛮好的效果。比如错误提示等。
我们要实现上图的那种效果,我们可以做一个附加属性。

 public static bool GetShowAdorner(DependencyObject obj)
{
return (bool)obj.GetValue(ShowAdornerProperty);
}
public static void SetShowAdorner(DependencyObject obj, bool value)
{
obj.SetValue(ShowAdornerProperty, value);
}
public static readonly DependencyProperty ShowAdornerProperty =
DependencyProperty.RegisterAttached("ShowAdorner", typeof(bool), typeof(MainWindow), new PropertyMetadata(false, Method)); private static void Method(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
var ele = d as Visual; var adolay = AdornerLayer.GetAdornerLayer(ele); if (adolay != null)
{
var ados = adolay.GetAdorners(ele as UIElement);
if (ados == null)
{
adolay.Add(new KDAdorner(ele as UIElement));
}
ados = adolay.GetAdorners(ele as UIElement);
if (ados != null && ados.Count() != )
{
var ado = ados.FirstOrDefault() as KDAdorner; if ((bool)e.NewValue)
{
ado.ShowImage(); }
else
{
ado.HideImage();
}
} }

继承Adorner,实现我们想要的Adorner效果

 public class KDAdorner : Adorner
{
private VisualCollection _visuals;
private Canvas _grid;
private Border _br;
public KDAdorner(UIElement ele)
: base(ele)
{
_visuals = new VisualCollection(this);
_br = new Border ();
_br.CornerRadius= new CornerRadius ();
_br.Background = Brushes.Red;
TextBlock _txt = new TextBlock();
_txt.Text = "";
_txt.Width=_txt.Height = ;
_txt.Foreground = Brushes.White;
_txt.TextAlignment = TextAlignment.Center;
_br.Child = _txt;
_grid = new Canvas();
_grid.Children.Add(_br);
_visuals.Add(_grid);
}
protected override Visual GetVisualChild(int index)
{
return _visuals[index];
}
public void ShowImage()
{
_grid.Visibility = System.Windows.Visibility.Visible;
}
public void HideImage()
{
_grid.Visibility = System.Windows.Visibility.Hidden;
}
protected override Size ArrangeOverride(Size finalSize)
{
_grid.Arrange(new Rect(finalSize));
_br.Margin = new Thickness(finalSize.Width - 12.5, -12.5, , );
return base.ArrangeOverride(finalSize);
}
protected override int VisualChildrenCount
{
get
{
return _visuals.Count;
}
}
}

VIew中给需要添加Adorner效果的控件,添加附加属性

 
image.png

CheckBox绑定了Button的附加属性,我们可以通过IsChecked,控制Adorner层的显示,隐藏。

 
image.png

WPF Adorner的更多相关文章

  1. WPF Adorner+附加属性 实现控件友好提示

    标题太空泛,直接上图 无论是在验证啊,还是提示方面等一些右上角的角标之类的效果,我们会怎么做? 这里介绍一种稍微简单一些的方法,利用附加属性和Adorner来完成. 例如WPF自带的控件上要加这样的效 ...

  2. 坑死我啊,一个WPF Adorner使用注意事项

    1.见鬼了? 项目中遇到这样的要求,一个Button用一个Adorner装饰,这个Adorner上又有一个Button,如下面这样 此时,我们在点击小Button的时候只希望处理小Button的事件, ...

  3. WPF Adorner 在TabControl切换TabItem时消失

    错误的截图: 一开始以为是MVVM绑定的代码中出现了问题,但是通过断点追踪并没有发现问题. 通过通过VS的实时可视化树发现问题:切换Item时Adorner会在AdornerLayer直接消失.届时怀 ...

  4. WPF Adorner 简易图片取色器

    回答MSDN问题所写. 使用Adorner+附加属性 图片类(来自这位博主的博客) /// <summary> /// 用于获取位图像素的类 /// </summary> pu ...

  5. WPF Adorner 弹出式工具栏 例子

    源于MSDN 一个问题. 问:如何做出类似word的文字选中后工具栏弹出和动画效果. 我用的是adorner,其实用popup也是可以的. 效果图: 中间黑色部分代表真正的工具栏. xaml代码: & ...

  6. WPF MVVM 验证

    WPF MVVM(Caliburn.Micro) 数据验证 书接前文 前文中仅是WPF验证中的一种,我们暂且称之为View端的验证(因为其验证规是写在Xaml文件中的). 还有一种我们称之为Model ...

  7. 在WPF控件上添加Windows窗口式调整大小行为

    起因 项目上需要对Canvas中的控件添加调整大小功能,即能在控件的四个角和四条边上可进行相应的拖动,类似Windows窗口那种.于是在参考以前同事写的代码基础上,完成了该功能. 代码实现 Adorn ...

  8. WPF MVVM(Caliburn.Micro) 数据验证

    书接前文 前文中仅是WPF验证中的一种,我们暂且称之为View端的验证(因为其验证规是写在Xaml文件中的). 还有一种我们称之为Model端验证,Model通过继承IDataErrorInfo接口来 ...

  9. wpf一些例子

    相关知识点:WPF - Adorner WPF Diagram Designer http://www.codeproject.com/Articles/484616/MVVM-Diagram-Des ...

随机推荐

  1. Photoshop零基础教程集锦,助你快速进阶为大佬,轻松、任性!!!

    现今,对于Web或App UI设计师而言,除了不断学习专业知识,提升设计技能.掌握一款得心应手的设计工具(例如设计师们常用的图像处理工具PhotoShop,矢量图绘制工具AI, 图形视频处理工具AE, ...

  2. mybatis 插入数据并返回主键值

    <insert id="insert" parameterType="com.pojo.TSubject" useGeneratedKeys=" ...

  3. DB2 sql报错后查证原因与解决问题的方法

    1.对于执行中的报错,可以在db2命令行下运行命令 : db2=>? SQLxxx 查看对应的报错原因及解决方法. 2.错误SQL0206N SQLSTATE=42703  检测到一个未定义的列 ...

  4. 2018.11.24 poj3693Maximum repetition substring(后缀数组)

    传送门 后缀数组好题. 考虑枚举循环节长度lenlenlen. 然后考虑枚举循环节的起点来更新答案. 但是直接枚举每次O(n)O(n)O(n). 考虑枚举len∗k+1len*k+1len∗k+1作为 ...

  5. 2018.11.06 bzoj1093: [ZJOI2007]最大半连通子图(缩点+拓扑排序)

    传送门 先将原图缩点,缩掉之后的点权就是连通块大小. 然后用拓扑排序统计最长链数就行了. 自己yyyyyy了一下一个好一点的统计方法. 把所有缩了之后的点都连向一个虚点. 然后再跑拓扑,这样最后虚点的 ...

  6. 2018.06.27Dual Core CPU(最小割)

    Dual Core CPU Time Limit: 15000MS Memory Limit: 131072K Total Submissions: 26136 Accepted: 11270 Cas ...

  7. linux 下安装安装mysql 5.6. 5.7

    linux版本:CentOS7 64位 5.7.20 安装请看 他人博客 我已经安装成功了 https://www.cnblogs.com/cz-xjw/p/8006904.html 5.6安装 前提 ...

  8. centos 下备份oracle数据

    一.在xshell下root用户登录服务器 1.新建oracle数据库备份目录 mkdir -p /casnw/backup/oradata6910bak 2.设置目录权限为oinstall用户组的o ...

  9. C语言程序设计50例(三)(经典收藏)

    [程序31]题目:请输入星期几的第一个字母来判断一下是星期几,如果第一个字母一样,则继续 判断第二个字母.1.程序分析:用情况语句比较好,如果第一个字母一样,则判断用情况语句或if语句判断第二个字母. ...

  10. Javascript、Jquery获取浏览器和屏幕各种高度宽度(单位都为px)

    Javascript.Jquery获取浏览器和屏幕各种高度宽度 另外参见    http://www.cnblogs.com/top5/archive/2009/05/07/1452135.html ...