在Flex中实现聊天表情图片支持-资料篇

本站原创文章,转载请注明: 转载自zrong's Blog,原文 在Flex中实现聊天表情图片支持-资料篇,欢迎使用文章源码进行转载。

本站转载文章会标明[转],转载请注明原始作者文章地址。



2011年8月24日09:44:35 更新:重新找到了基于riaidea的TextField的图文混排组件源码,见作者博客

这个组件在对文本进行滚动的时候占用CPU较大,我在30行文本+少量表情滚动的时候,CPU瞬间可达30%以上(AMD羿龙II三核),因此在性能较差的机器上可能感觉滚动会卡。综合目前Flash Player 10的市占率90%以上来考虑,应该使用TLF来开发聊天表情支持功能(其实TLF大量文本滚动也会卡的,但比这个要好些)。见在Flex中实现聊天表情图片支持-实战篇

2009年10月9日11:09:14 更新:增加riaidea的范例,(riaidea的作者自行关闭了googlecode上的开源项目,因此riaidea的源码不能下载了,我也没有源码

2009年9月16日20:34:30 更新:在Flex中实现聊天表情图片支持-实战篇

2009年8月21日09:36:19 更新:Flash Text Engine、Text Layout Framework在Flex、Flash中的实现


仔细研究了一下Flex支持表情图片,主要有下面三种方法:

  1. 使用TextArea,或直接使用TextField的html支持功能,在html中使用<img>标签嵌入表情图片文件。但这样做有两个问题,一是图片文件载入较慢;二是不容易控制载入的图片在文本中的“流向”。虽然可以使用getImageReference获取对图片的引用,但处理起来也比较费力。
  2. 将文本中需要插入图像的地方留出空白空间,获取空白空间的位置,并使用图像替代。这种方法的缺点在于每次更新文字内容的时候,所有的图片都要重排位置,对性能有一定影响,尤其是文本和图像比较多的情况下。
  3. 使用Flash Player 10提供的flash.text.engine(简称FTE)提供的高级功能进行处理,具体是使用GraphicElement类,这无疑是更好的方法。Adobe提供的Text Layout Framework(简称TLF)就是架设FTE的基础之上的。

下面是一些我搜集的资料,为后面的实战做个记录:

下面这个范例是我在网上找到的,使用的应该是第2种方法。

(2009年10月9日11:16:10更新)再加一个范例:


发表评论?

22 条评论。

  1. 我也是用的你说的第二种方法,但你说的第三种着实没看明白,特想和你学习学习,呵呵,给个联系方式,要么加我呗,哈

  2. 第二种方法,我一直都没精力去实现它。所以我偷懒直接用第三种了。稍候我会发个源码和文章上来吧。我email:email

  3. 想和您请教学习,方便的话请发个源码.谢谢.^_^

  4. 这是资料篇,没源码。后面实战篇出来才有源码。最近忙,没时间搞……

  5. 这两天正在研究这个东西,有没有源码啊,发过来学习学习~,我的QQ357466133

  6. 西湖深蓝雨

    你好,可以给我发一份这篇文章的源码吗?现在你那里的链接下载不了,非常感谢!

  7. 零点零一分

    能共享个源码吗。上面的地址没权限进

  8. 我这里访问正常。你换个时间再试试。

  9. 零点零一分

    那个地址没权限,能发份FLEX3版本的源代码给我吗。。mingjingjoy@163.com
    万分感谢啊。想学习下。

  10. 零点零一分

    那个地址访问受限制的,能发份FLEX3版本的源代码给我吗。。
    mingjingjoy@163.com
    万分感谢啊。想学习下。

  11. 你说的是googlecode上的Flex3那个么?那个可能是作者自己把项目取消掉了,我也没办法啊 :em28:

  12. :cool: 能否给我也发份Flex3的源代码呢,我的邮箱是395731847@qq.com 非常感谢哈,学习一下

  13. 能发一份给黑色的那个源码给我么,我的邮箱是164831396@qq.com.谢谢啊!

  14. 抱歉,我没有

  15. 请楼主该拿的时候把我QQ号那条消息删了,谢了


  16. lamo:

    请楼主该拿的时候把我QQ号那条消息删了,谢了

    删了

  17. 能发个源码给我吗,我下载不了,谢谢!

  18. 实战篇中有源码

  19. ;-) 能发下黑的那个(2009年10月9日11:16:10更新)再加一个范例,有源码:的源码给我么?非常感谢 hai5656a@163.com

  20. 能发个源码嗎!

发表评论


请输入上面的验证码


Trackbacks and Pingbacks: