原文:WPF drag过程中显示ToolTip.

在drag/drop过程中,我们在判断出over的元素上是否可以接受drag的东西之后,通常是通过鼠标的样式简单告诉用户这个元素不接受现在drag的内容,但是用户通常不知道具体的原因,有时候为了增强客户体验,会在over的过程中显示tooltip来告诉用户为什么不能接受drag的东西或者告诉用户over的元素是什么东西,特别是一些绘图或者其他一些复杂的应用软件,这种方式比较广泛。

WPF 给各种控件提供了ToolTip属性,可以通过设置该属性的值来决定鼠标Over到控件的时候要显示什么内容,但是在Drag的过程中却不能触发MouseOver事件,触发的是DragOver事件,那就需要Popup 来实现该效果,下面是根据自己的经验来简单设计了一个Popup控件实现tooltip功能。

1. 在Xaml中增加Popup控件以及进行数据绑定

        <Popup x:Name="toolTip" IsOpen="{Binding ShowToolTip, Mode=OneWay}" AllowsTransparency="True"
Placement="Relative" HorizontalOffset="{Binding ToolTipPos.X}" VerticalOffset="{Binding ToolTipPos.Y}">
<TextBlock Foreground="Red" Text="{Binding DragElement.Description}"></TextBlock>
</Popup>

注:在Popup的属性设置中特别注意Placement的属性值,详细信息可以查看MSDN 怎样设置Placement属性

2. 在ViewModel中要注意属性值的计算

        private Point _tooltipPos;
public Point ToolTipPos
{
get { return _tooltipPos; }
set
{
if (_tooltipPos == value)
return;
if (Math.Abs(_tooltipPos.X - 15 - value.X) > 15 || Math.Abs(_tooltipPos.Y - 15 - value.Y) > 15)
{
// why reduce 15? because if position the popup window to current cursor location,
//if mouse moving when drag/drop, the mouse will be on popup window, so the user's experience is not good.
_tooltipPos = value;
_tooltipPos.Offset(15, 15);
RaisePropertyChanged("ToolTipPos");
}
}
}

注意ToolTipPos的Set值的设置,实际上value是光标当前的位置,为什么要对改值Offset(15,15)?主要是为了在Popup窗口显示的时候,要保证光标所Over的控件是原来的控件,如果不进行offset,在某些细微移动的过程中可能出现DragOver的对象由原来的控件跟popup窗口之间切换。

        private bool _showToolTip;
public bool ShowToolTip
{
get { return _showToolTip; }
set
{
if(_showToolTip == value)
return;
_showToolTip = value;
RaisePropertyChanged("ShowToolTip");
}
}

该属性决定了Popup窗口是否要显示,需要在DragOver事件处理函数中进行设置为True. 在dragover对象的mousemove处理函数中设置该值为false,保证Popup消失。

3. DragOver的过程中获取鼠标的位置,设置Popup窗口的target属性。

            this.toolTip.PlacementTarget = this.SelectedEmployees;
this.ToolTipPos = e.GetPosition(SelectedEmployees);
ShowToolTip = true;

注: e 为dragover过程中参数DragEventArgs e,  在获取鼠标位置的时候不要用Mouse.GetPosition(IInputElement ),因为在drag过程中对鼠标是在DragOver事件中管理的, 用Mouse.GetPosition(IInputElement)不能获得准确的值。

WPF drag过程中显示ToolTip.的更多相关文章

  1. Ajax请求过程中显示“进度”的简单实现

    Ajax在Web应用中使用得越来越频繁.在进行Ajax调用过程中一般都具有这样的做法:显示一个GIF图片动画表明后台正在工作,同时阻止用户操作本页面(比如Ajax请求通过某个按钮触发,用户不能频繁点击 ...

  2. C++ CEF 浏览器中显示 Tooltip(标签中的 title 属性)

    在 Windows 中将 CEF 集成到 C++ 客户端以后,默认是无法显示 tooltip 的,比如图片标签中的 title 属性. 实现的方式其实很简单,按下面的步骤操作就可以: 创建一个文本文件 ...

  3. css3实现loading效果--当页面加载过程中显示Loading的进度条,全部加载完成之后进度条消失

    一个页面等图片资源全部加载完成,会需要很长时间,用户体验会很差,所以我们需要loading来掩盖这个漫长的过程! emmm,定时器?写个定时器还要清除,万一造成内存泄露?定时器之间还会互相影响,呼呼呼 ...

  4. 在程序加载过程中显示ProgressDialog 对话框

    private ProgressDialog mProgressDlg = null; @Override protected void onCreate(Bundle savedInstanceSt ...

  5. WPF Slider Tickbar 中显示数值

    class CustomTickBar : TickBar { protected override void OnRender(System.Windows.Media.DrawingContext ...

  6. 在安装mysql数据库的过程中,显示msvcp100.dll丢失?则么办?

    方案一:重装操作系统为windows10专业版 方案二:问题: 解答: 报错原因是VC运行库不全或者没有安装导致,百度搜索VC集合下载安装, 链接:https://pan.baidu.com/s/1U ...

  7. 在Installshield的安装进度中显示自己设置的信息

    原文:在Installshield的安装进度中显示自己设置的信息 以Installscript msi project为例,在installshield所制作的安装包安装过程中显示安装进度的,就在On ...

  8. VS编程,编辑WPF过程中,点击设计器中界面某一控件,在XAML中高亮突出显示相应的控件代码的设置方法。

    原文:VS编程,编辑WPF过程中,点击设计器中界面某一控件,在XAML中高亮突出显示相应的控件代码的设置方法. 版权声明:我不生产代码,我只是代码的搬运工. https://blog.csdn.net ...

  9. Android ListView滑动过程中图片显示重复错乱闪烁问题解决

    最新内容建议直接访问原文:Android ListView滑动过程中图片显示重复错乱闪烁问题解决 主要分析Android ListView滚动过程中图片显示重复.错乱.闪烁的原因及解决方法,顺带提及L ...

随机推荐

  1. MySQL主从复制&读写分离&分库分表

    MySQL主从复制 MySQL的主从复制只能保证主机对外提供服务,从机是不提供服务的,只是在后台为主机进行备份数据 首先我们说说主从复制的原理,这个是必须要理解的玩意儿: 理解: MySQL之间的数据 ...

  2. 记一次为解决Python读取PDF文件的Shell操作

    目录 一.背景 二.问题 三.解决 四.一顿分析及 Shell 操作 五.后续 一.背景 本想将 PDF 文件转换为 Word 文档,然后网上搜索了一下发现有挺多转换的软件.有的是免费的.收费,咱也不 ...

  3. delphi directui 做界面的一个例子

    现在很多CS系统或者软件界面都做的非常好看,比如:QQ皮肤,迅雷下载,360杀毒界面等.这些都是运用的流行的DIRECTUI 技术,基本上有的资料都是基于C++的,很少有同仁将C++下的DIRECT ...

  4. NX二次开发-UFUN特征选择对话框UF_UI_select_feature

    #include <uf.h> #include <uf_ui.h> UF_initialize(); //特征选择对话框 char sMessage[] = "特征 ...

  5. flutter 死亡红屏 隐藏

    当组件报错的时候会出现红屏现象,解决办法是覆盖原有的ErrorWidget 用一个空白的组件去替换它 1.main.dart中进行修改 新增覆盖代码: void setCustomErrorPage( ...

  6. hdu4352-XHXJ's LIS状压DP+数位DP

    (有任何问题欢迎留言或私聊 && 欢迎交流讨论哦 题意:传送门  原题目描述在最下面.  在区间内把整数看成一个阿拉伯数字的集合,此集合中最长严格上升子序列的长度为k的个数. 思路: ...

  7. 11.RabbitMQ单机集群

    RabbitMQ集群设计用于完成两个目标:允许消费者和生产者在RabbitMQ节点崩溃的情况下继续运行,以及通过添加更多的节点来扩展消息通信的吞吐量. RabbitMQ会始终记录以下四种类型的内部元数 ...

  8. 数据结构C++版-栈

    一.概念 二.应用实例 1.进制转换 #include <stdlib.h> #include <iostream> #include <string> #incl ...

  9. jq选项卡切换功能

    效果图: <!DOCTYPE html> <html lang="en"> <head> <style> *{margin:0;pa ...

  10. SQLAlchemy连接数据库创建表

    # 连接数据库,创建表 def create_all(): engine = create_engine( 'mysql+pymysql://root:123456@127.0.0.1:3306/sq ...