半透明信息显示浮动窗口的实现
实现目的在一些画图软件中,经常需要向用户展示鼠标移动到的位置的对象的一些参数信息。此时,完成一个交互性友好的信息显示界面就相当的重要了。因为一个软件的好坏,在用户的眼中,第一感觉甚至是第一重要的就是视觉效果和可操作性。当然,软件本身的稳定性和效率也很重要。特别对于产品性的软件,在用户展示时,一个优秀的界面效果可以大大加深软件在用户心里的印象分。
功能简介
本功能是作者根据自身软件在用户实际使用过程中对交互性的更高要求而开发的。浮动窗口其实是一个对话框,设置为无标题的风格,然后进行自绘制而成。能够根据需要显示的内容自动调整窗口的大小,保证正好能够容纳需要显示的内容。如以下效果:
图中黄色条为栏目分隔,同时显示其下内容所属的信息域。如图中表示下方信息为台风即时预报信息的内容。下方信息分成两栏,栏间绘制线条进行分割。左侧为信息标题,右侧为信息内容。比如台风名称是奥麦斯。
如果鼠标移动的位置,同时选中多项内容,那么,提示信息可以同时包括多个栏目,如下图:
本图中包括两个栏目,即本公司船位置信息和美气导的等压线信息。从理论上讲,本功能可以支持任意多的栏目,前提是你的显示器能够容纳得下。
整个界面的效果是半透明的。包括透明度,字体大小和信息内容的颜色都可以由用户自行定义,配置界面如下:
透明度范围为0-255;背景色列表框是作者在博客中已提供的一个自定义的线条、填充和颜色选择列表控件。
修改完成后,可以改变浮动窗口的显示效果,比如一种修改后的效果:
这样,即使用户对浮动窗口内容的展示方式不满意,那么也完全可以由用户自行定义自己喜欢的风格。当然,在此基础上,可以进一步扩大自定义的范围。本例中,栏目分割条的背景色和信息内容标题文字的颜色是固定的,信息内容文字的颜色是背景色的反色,这些都可以考虑加入到自定义项中。
代码实现