egret GUI 文本混排+文本链接的聊天解决方案【取巧法】
ui方面:
<e:Scroller verticalScrollPolicy="auto" width="468" height="620" x="6" y="110"> <e:Group id="messageGroup"> <e:Label id="message_area" width="468" height="620"/> </e:Group> </e:Scroller>
使用Label的原因:TextArea不支持textFlow属性,虽然你追踪TextArea最终还是用TextField,并且你最终也可以使用TextField的textFlow属性,但是很麻烦。
套一个Group是因Label不能直接作为Scroller的viewport,然后Group外面再套一层Scroller,这样L可以上下移动Label了,当前的设置Scroller的尺寸以规定他的可视范围。
代码中:
this.message_area._textField.touchEnabled = true; this.message_area.textFlow = 你的textFlow; this.message_area.commitProperties(); this.message_area.height = this.message_area._textField.textHeight;
Label没有TEXTEVET.LINK事件,而Label的textField的鼠标事件又被禁止了,所以需要自己去设置textField的touchEnable为true;
然后在给Label添加textFlow之后需要即时的commitProperties(),如果不调用这个方法的话,估计需要等到下一帧textFlow才会传递到textField去,这样也拿不到他的文本高度和textFlow生效后的高度;
var sv = this.message_area.height - scroller.height; if( sv > 0){ this.messageGroup.verticalScrollPosition = sv; this.scroller._updateContentPosition(); }
以上代码是当文本高度超过scroller的高度的时候主动将他滚动到最下面。
效果图: