【UWP】仅在TextBlock文本溢出时显示Tooltip
前言
这是我今天在回答SO问题时偶然遇到的,觉得可能还比较通用,就记录下来以供参考。
通常,我们使用ToolTip
最简单的方式是这样:
<TextBlock Text="Test"
ToolTipService.ToolTip="Test"
/>
这样在光标悬浮在TextBlock
上方时,会显示一个提示条,但是这似乎又违背了一个设计原则:
ToolTip作为提示,应该仅在当前内容显示不全,且用户有意愿查看完整内容时作为替代元素出现
这很好理解,如果TextBlock
足以显示所有文本内容,那么显示Tooltip
显然是多此一举的事情。但UWP并没有对这种常见的情况进行自动处理,比如将TextBlock
在文本溢出时自动显示Tooltip
作为一个默认行为,所以我们就需要自己来实现这个操作。
思路
我能想到的思路是借助TextBlock.IsTextTrimmed
属性,在True
的时候设置Tooltip的值为TextBlock.Text
,在False
的时候设置Tooltip
的值为null
。
但在实际创建的时候,我发现这很难做到,原因如下:
- Converter的
ConverterParameter
属性是一个简单对象(object),无法通过绑定进行传值(只有DependencyProperty
才能使用绑定),这意味着我无法在绑定IsTextTrimmed
的同时通过ConverterParameter
属性传入Text的值 - 我也不能直接在Converter内绑定
TextBlock
本身,目标太大,而我只想要IsTextTrimmed
属性改变时进行判断.
综上,在查找一些资料后,我决定改造一下Converter
本身。
解决方法
Converter
public class TrimConverter : DependencyObject, IValueConverter
{
public string Text
{
get { return (string)GetValue(TextProperty); }
set { SetValue(TextProperty, value); }
}
public static readonly DependencyProperty TextProperty =
DependencyProperty.Register("Text", typeof(string), typeof(TrimConverter), new PropertyMetadata(""));
public object Convert(object value, Type targetType, object parameter, string language)
{
bool isTrim = System.Convert.ToBoolean(value);
return isTrim ? Text : null;
}
public object ConvertBack(object value, Type targetType, object parameter, string language)
{
throw new NotImplementedException();
}
}
我在Converter内部创建了一个DependencyProperty
用来存放TextBlock.Text
的值。
使用
<Page.Resources>
<local:TrimConverter x:Key="TrimConverter" Text="{Binding ElementName=TestBlock,Path=Text}"/>
</Page.Resources>
...
<TextBlock MaxWidth="100" TextTrimming="CharacterEllipsis"
x:Name="TestBlock"
ToolTipService.ToolTip="{Binding ElementName=TestBlock,
Path=IsTextTrimmed,
Converter={StaticResource TrimConverter}}"/>
在XAML界面中完成绑定后,实测可以解决我的需求。
但是这个解决方法并不完美,它有一个问题:
和TextBlock本身耦合,由于Text值需要绑定,只能一个TextBlock创建一个Converter,不能够复用
实现在TextBlock文本溢出时显示Tooltip有多种实现方式,我只提出了一种,以供参考。
【UWP】仅在TextBlock文本溢出时显示Tooltip的更多相关文章
- CSS 文本溢出时显示省略标记
如标题所示... <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.o ...
- css 文本溢出时显示省略号
.text-ellipsis { width:100px; height:60px; overflow: hidden;//隐藏滚动条 text-overflow:ellipsis; white-sp ...
- HTML技巧篇:如何让单行文本以及多行文本溢出时显示省略号(…)
参考:https://baijiahao.baidu.com/s?id=1621362934713048315&wfr=spider&for=pc 本篇文章主要给大家介绍一下在html ...
- text-overflow文本溢出隐藏“...”显示
一.文本溢出省略号显示 1.文本溢出是否“...”显示属性:text-overflow:clip(不显示省略标记)/ellipsis(文本溢出时“...”显示) 定义此属性有四个必要条件:1)须有容器 ...
- CSS---解决内容过多就会出文本溢出(显示在区域外面,不换行的情况)
当我们设置我的的div,或者其它文本框固定宽度之后,文本内容过多就会出文本溢出(显示在区域外面,不换行的情况). 这时我们可以使用Css中的几个属于来解.有以下的三个属于可以解决问题: 1,word- ...
- Linux vi 文本代码时显示行号或不显示行号
Linux vi 文本代码时显示行号或不显示行号 前提 安装了vim $vi ~/.vimrc 显示的话加上 set nu 不想显示的话可以注释掉 "set nu 之后 $source ~ ...
- css实现文本溢出用...显示
文本溢出省略号显示,要实现这个必须 要有四个条件: 1.须有容器宽度:width:value 2.强制文本在一行内显示:white-space:nowrap: 3.溢出内容隐藏:overflow:hi ...
- css文本溢出隐藏显示省略号(单行+多行)
文本超出若干行就换行,这个功能几乎每个文本浏览网站都会用到,实现它的办法也有很多,今天简单的介绍一下实现它的方法. 一. 单行文本不换行,并将超出文本隐藏 .box-content{ ove ...
- #CSS 文本溢出部分显示省略号
单行结尾溢出: 用text-overflow:ellipsis属性实现,当然还需要加宽度width属来兼容部分浏览. width:300px;overflow: hidden; text-overfl ...
随机推荐
- git常用操作合集
基本操作git status 查看文件处于什么状态 git status -s 带上-s参数,可以以更紧凑的格式输出文件状态信息 git add 开始追踪该文件或者暂存已修改的文件. .gitigno ...
- 如何正确使用 Spring Cloud?【上】
如何更快地交付软件,每周.每天甚至每个小时向用户发布新特性?如何让新员工在入职后就能部署代码?在如此快的节奏下如何保证质量?快,我们应用开发面临的主要挑战,交付越快就越能紧密地收集到用户反馈,从而更有 ...
- CSDN不限积分代下载,知网、万方、sci、IEEE论文代下载,智慧树、超星尔雅刷课
下载内容: 1.CSDN不限积分代下载. 2.知网.万方.sci.IEEE论文代下载. 3.超星尔雅,智慧树刷课. 注:由于本人手抖买一个CSDN会员,想挽回一点损失,所以创立了一个下载群,绝对不是骗 ...
- MariaDB主从复制和读写分离
一.基础环境 二.配置MariaDB服务 1.安装MariaDB # yum install -y mariadb mariadb-server # systemctl start mariadb # ...
- C# 多线程总结 异常处理 线程取消 锁(lock)
那么什么时候能用多线程? 任务能并发的时候 多线程能干嘛?提升速度/优化用户体验 网站首页:A数据库 B接口 C分布式服务 D搜索引擎,适合多线程并发,都完成后才能返回给用户,需要等待WaitAll列 ...
- 使用函数计算三步实现深度学习 AI 推理在线服务
目前深度学习应用广发, 其中 AI 推理的在线服务是其中一个重要的可落地的应用场景.本文将为大家介绍使用函数计算部署深度学习 AI 推理的最佳实践, 其中包括使用 FUN 工具一键部署安装第三方依赖 ...
- react + typescript 学习
react,前端三大框架之一,也是非常受开发者追捧的一门技术.而 typescript 是 javascript 的超集,主要特点是对 类型 的检查.二者的结合必然是趋势,不,已经是趋势了.react ...
- 4、netty第三个例子,建立一个tcp的聊天的程序
代码基于第二个例子,支持多客户端的连接,在线聊天. 主要思路: 连接建立时,在服务器端,保存channel 对象,当有新的客户端加入时,遍历保存的channel集合,向其他客户端发送加入消息. 当一个 ...
- java web轻量级开发面试教程
最近面试java后端开发的感受:如果就以平时项目经验来面试,通过估计很难——再论面试前的准备 在上周,我密集面试了若干位Java后端的候选人,工作经验在3到5年间.我的标准其实不复杂:第一能干活,第二 ...
- InnoDB On-Disk Structures(三)--Tablespaces (转载)
转载.节选于 https://dev.mysql.com/doc/refman/8.0/en/innodb-tablespace.html This section covers topics rel ...