云信 duilib 踩坑填坑–点点滴滴

  • A+
所属分类:编程语言

云信duilib

云信官方只提供了简单的可怜的介绍、和属性列表,通过这些,就想掌握,想想也是不可能的。

本着实践是检验真理的唯一标准,生命在于不断的折腾的思想,不断的修改测试探查效果,猜测含义,加深对各种布局各种属性的理解。

本着踩了坑,即使不能埋坑,却一定要标记出来,以免后来者不小心掉进去的品德,抛砖引玉,特记录下云信duilib开发的点滴。


1、Window窗口参数

1.1 部分透明效果

shadowattached="false"

custom_shadow="0,70,5,10"

决定背景透明区域,ustom_shadow="0,0,0,0" 默认全部透明,

custom_shadow="20,70,20,20"则是认为背景的左侧20 ,上部70,右侧20,下部20 是透明的。

同时需要注意的是,想要实现部分透明效果,背景图像必须为纯黑色,底层是将纯黑色作为透明遮罩,纯黑色的可以适当做透明处理,而非黑色如蓝色,绿色等,则不能做部分透明处理。

示例:

bkcolor="bk_main_wnd_title"

云信 duilib 踩坑填坑--点点滴滴

云信 duilib 踩坑填坑--点点滴滴

要想将黑色去掉,实现部分透明效果,就要设置透明区域,有两种设计方法:

全部透明:不写这个属性,或全置为0,custom_shadow="0,0,0,0"

这个简单,但有隐患,具体如下:

云信 duilib 踩坑填坑--点点滴滴

界面展现出来这样,底层应该是richEdit控件的默认背景也是黑色,而此处因为设置的是全部区域内的纯黑色是透明的,所以将黑色过滤掉了。

部分透明:

调节这里的透明范围,如左20,上70,右20,下20的范围是透明的,其它地方不透明,之所以其它地方没看到黑色,是因为被别的背景遮住了。

custom_shadow="20,70,20,20"

云信 duilib 踩坑填坑--点点滴滴

而对于部分透明,就没有这种问题了。


1.2 可拉伸属性

Sizebox 属性列表中说,窗口可拖动改变窗口大小的边距。

听起来好像是,设置这个值后,就可以拖动窗口,改变大小。

但这种理解是错误的,比如设置sizebox="4,4,6,6"后,你会发现,鼠标位于边框时,光标呈现了拉伸状态。

这时候,你可能误认为曙光来临,在这提示的暗示下,当你兴奋的想去拉伸改变窗口大小时,结果却发现,窗口大小丝毫不为所动,很气恼,很伤心,很沮丧,有没有,再次对照官方文档,然并卵,并没有找到有用信息。

于是,不断修改调整,终于找到症结之所在。

真是感叹,网易这篇文档的书写者,当真是惜字如金。

Sizebox确实可以使得光标在边框时,出现拉伸状态,但只设置了这个值,并不能拉伸窗口。

涉及因素:

1、BOX、HBOX、VBOX等布局的widthheight属性,是否设置的固定或auto,固定很好理解,auto则是根据子控件大小确定本身大小,这两种状况下,都是不可拉伸的。

只有widhtheight在stretch状态下,才可以拉伸,默认情况就是stretch。

2、window 属性里的 mininfo=”1000,1000” maxinfo=”1000,1000” ,最小窗口、最大窗口完全一样,当然也不能拉伸了。


2、 Box、VBox、HBox

这些盒子的使用,只能通过大量的修改测试了。

VBoxHBox 是有一定规则的盒子,存放东西的时候只能按照纵向横向的顺序排放。

而Box却给你了自由,没有规则,具体在什么位置放东西,子控件容器则要根据valign haling margin等进行位置确定。其实这就是画布,然后结合定位信息,在指定位置绘图。

难以言述,只能实践中掌握。


3 、Sublime 的格式化代码,谨慎使用,因为会打乱属性顺序,造成云信无法解析,直接崩溃

有时候代码缩进过于凌乱,安装了sublime的一个代码缩进控件

Selection->Format->indentxml

结果发现,代码缩进清晰了,但运行不起来,duilib加载格式错误的xml格式时,会自动崩溃掉,不给哪里出错的提示。

经查,使用代码自动缩进工具,会调整标签中的属性位置,比如为了换行方便,会将15个字节的属性与5个字节的属性调换位置。而云信duilib中,EVENT事件,是有一定顺序的,所以导致云信解析不了这个XML,进而直接崩溃。

weinxin
我的微信公众号
爱真理,得永生!          爱在灵灵久博客,网罗天下,福利大家!

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: