公司一个项目要实现聊天是模块，具体需求是滚动条居左，置底，采用TextLine类实现图文混排以提高效率。由于textLine不支持html，所以需要重写一个类。lash里处理只读字体效率最高的类是TextLine，而非TextField。对滚动条居左，我采用办法是左右并排两个两个Canvas容器，用group剪裁右边容器的滚动条，把左边容器位置设置成负的，只显示一个滚动条，然后利用代码控制左边滚动条与右边同步，代码如下
<!--聊天消息区域外层再套一层Group，并且宽度比speakpanal小，目的为了开启垂直滚动条verticalScrollPolicy="{ScrollPolicy.ON}， 这样就可以使用滚动条的私有属性speakpanal.mx_internal::contentPane.mouseEnabled让鼠标事件设为false,再利用group的自动剪裁隐藏滚动条--> <s:Group id="messagesContainer" width="{SIZE_WIDTH_MIN}" height="{SIZE_MIN}" mouseEnabled="false" bottom="52" clipAndEnableScrolling="true"> <mx:Canvas id="speakpanal" width="{messagesContainer.width+20}" height="{messagesContainer.height}" verticalScrollPolicy="{ScrollPolicy.ON}" horizontalScrollPolicy="{ScrollPolicy.OFF}" mouseEnabled="false" > <mx:VBox id="messages" verticalGap="2" width="{messagesContainer.width}" paddingTop="5" paddingBottom="5" paddingLeft="15" paddingRight="2" verticalScrollPolicy="{ScrollPolicy.OFF}" horizontalScrollPolicy="{ScrollPolicy.OFF}" mouseEnabled="false"/> </mx:Canvas> </s:Group> <mx:Canvas id="messagesContainer_left" height="{messagesContainer.height}" bottom="52" x="-5" width="16" verticalScrollPolicy="{ScrollPolicy.ON}" horizontalScrollPolicy="{ScrollPolicy.OFF}" verticalScrollBarStyleName="scrollBar" scrollRect="{new Rectangle(0, 0, messagesContainer.width, messagesContainer.height)}" cacheAsBitmap="true" > <!-- 根据滚动条/messagesContainer_left = messagesContainer_left/messages_left 得出messages_left高度 保证滚动条高度不变--> <mx:VBox id="messages_left" height="{messagesContainer.height*messagesContainer.height/SCROLL_HEIGHT_SIZE}" /> </mx:Canvas>
我在给messages添加内容时采用addElement(p)方法，p是这这边封装的一个类继承sprite，里面是一段html文字，我messages里面不断添加新的聊天内容，最后问题出现，当添加的聊天行数足够多时，返现messages最底端与最后一个p之间的空白部分越来越大，我输出messages的高度，和总的p的高度，高度是一致，没道理啊。难道是p在messages里面的位置有重叠的地方导致底端空出来，经过测试排除这个可能，最后打印出每个p的高度，发现它的高度是个小数，但小数也没道理啊，难道他会四舍五入？？还是我封装的类有问题。最后决定把messages提出来往里面不断添加自定义的简单组件，我自定义了一个mxml模块test，里面就一个lable，先设置它的高度是个小数，比如14.75.然后不断的messages添加 test，messages.addElement(test),，发现果然，messages底端与最后一个test的空白位置越来越大，排除自己的类库问题，问题基本可以确定是addElement内部机制的问题，难道它会把给他添加的子组件的对高度进行取int然后取值，没办法，现在只能采用的办法是，对p的高度进行最小整数取值然后重新设置高度 如：p.height = Math.ceil(p.height);//重新设置p高度 取最小整数。
