大约2月前 - 没有评论
若需转载本站原创文章,请注明: 转载自zrong's Blog
本站转载的文章标题会标明[转]。
本文链接地址: [转]十个Flex/Air疑难杂症及解决方案简略
今天寻找原来写的关于FXG的文章,无意中发现sban写的几篇很不错的文章都看不到了,原来他的博客挂了。google到新的博客,也没有发现原来的博文。但又找到几篇不错的文章,看来还是转过来保险
原文作者:sban
原文地址:http://sban.biz/239
以下为转载
杂症病因及解决方案简略:
1, 在TileList中如果选择档过多,会出现卷轴,当拖动卷轴时,渲染的进度条会出现花屏现象;
并非TileList有这个问题,在Flex3内,DataGrid,List,Tree等控件如果使用不当,均存在这个问题;在先前的fl组件包内的TileList组件也有类似阴影。根本原因在于,使用ItemRenderer的大数据控件,其在渲染时,并不会一次创建所有数据列/行的显示对象 (ItemRenderer),它仅会创建在屏幕上可见的数据列/行,并且重复利用这些显示对象,以提交运行时效率。
可以做这样一种代码实验,以帮助人们理解这种机制:在一个TileList控件内,它本身有滚动条,它的ItemRenderer也使其有滚动条,在多屏数据的情况下,任意滚动一个ItemRenderer的滚动条,然后滚动TileList的滚动条到另一屏,你会发现,虽然数据已经变了,你从未滚动过这个数据,但它与你先前滚动过的那个数据具有相同的滚动位置。
从严格意义上讲,这并不能算是Adobe的bug,因为如果你严格按照Adobe的官方说明使用,多数情况下,是不会出现的,因此这个bug的复现也颇具难度。从Flex SDk 3.5开始,Adobe Flex团队,对所有基于ItemRenderer实现的数据控件针对开发者遇到的问题进行了改良,优化了SDK内部控件实现方法,并且添加了一个 offscreenExtraRowsOrColumns属性,该属性意为非显示区域的行或列数,用于帮助开发者在特定情况下遇到的花屏问题。
如果遇到这个问题,如果解决(方案按优先级自上向下排列):
1) 修改策划
显示大数据时,传统滚动条是一个糟糕的设计,因为人的眼晴对于大量的,重复结构的数据,很难定位上次查看的位置,多数人都是边察看边用指在屏幕上做标记。此种情况下,
a)要么不使用滚动条,使用翻页,用户每次翻页后,重新取数据、向数据控件赋值,在这种情况下,DataGrid,TileList等均不会出现花屏问题,因为压根儿就不会有滚动,但在此时,使用Repeater效率更高。
b)要么设计一种粗粒度滚动条,在这种粗粒度滚动中,每一个点相关于翻页设计中的一页,用户拖动时还相当有手感,相对传统滚动条要好许多,这种设计在许多产品中都已经开始使用。
2)在更新DataProvider时手动刷新控件视图
每次当data有变化,均手动再次设置一次ItemRenderer,大意如下:
list.itemRenderer = new ClassFactory(YourItemRenderer);
注:在Gumbo中,如果使用Bindable绑定数据,FB在编译时已经做了代码优化。所以,多数时候,按照官方方法可以避免很多问题。
3)使用offscreenExtraRowsOrColumns属性调整
这是最BT的方案,让人感觉是Adobe自己用算法难已处理了,所以请用户告诉控件目前有多少数据列/行在显示区外。具体用法请参照livedoc说明。
2-4,电子白板中,控制权转移;录制;画面同步
在白板开发中,控制权转移,画面同步,录影属于基本功能点。在技术技巧上,录影使用ImageSnapshot取得数据,剩下的便是系统架构师的事情。白板若要做好,方方面面必须设计好,特别是多人同时在线应用。
最基本的白板实现方案是基于ShareObject,但这种实现是demo级的,既浪费资源性能又低,比较合理的设计,作者认为应该是这样:
1)控制权转移实则是多人数据同步,数据同步不要使用SO,当控制权变化时,由Server处理并向Client广播,如果在同一时间内白板只充许有一人控制,此时仅需向二人广播,如果其它人也需要知道当前人控权者是谁,通过另外统一的状态广播实现。
2)画面同步必须设计出二种机制,一种为指令绘制型,另一种为图像同步型。对于后来进入观看白板的人用户,它第一次需要向server请求当前最新的白板画面,server选择一个最可靠的client的白板数据发给新来者,或者使用p2p技术直接由client端发送。指令绘制型用于在活动用户之间更新白板数据、动作。指令需自行设计,这种设计可以轻松实现白板重绘。
3)录影在这里有两种实现,一种为ImageSnapshot,另一种为指令重绘型。
5,FLASH的置顶问题
默认情况下,在网页中swf对象之上放置不了浮动层,解决方案是修改FlashVars属性值,把wmode修改为opaque,同时对照其它对象,排列z-index。
6,聊天表情無法复制粘贴,由于聊天表情是动态文本,所以添加到textflow中的是一个sprite对象
这个问题没有一步到位的方案,属于架构师考虑的设计问题。自定义一种输入框,自定义一套emoticon标签,每一个表情用一个自定义标签标识,监听输入框的copy与paste事件,送入剪辑板的数据仅包含emoticon标签,而不是图像数据,在paste时进行解析、替换。
7,老板模式,当系统焦点离开air程序后,无法检测到系统的key_down事件
系统焦点离开AIR后,即使在AIR中有KEY_DOWN事情监听也无济于事。解决方案是,rumtime升级到AIR 2.0,在AIR程序启动时,同时启动一个C++ native progress,当AIR程序最小化至系统托盘后,由C++程序负责监听系统按键,以此实现AIR程度快捷键呼出。
8,Air注册表操作(登陆启动look程序)
Air直接写不了,解决方案有两种方向:
1)与问题7同,使用nvtive progress写注册表
2)不使用AIR,使用替换解决方案Flex4U
9,在1.5的air运行时环境下,中文不能输入问题,因为客户端可能已经安装1.5的运行时,在网页安装中只能检测客户端是否安装了运行时,却无法检测到版本信息或者更新运行时
这里面有二个问题,第一个,对于必须要求rumtime为2.0的air程序,在编译时指定,强制用户升级。
第二个,在网页中安装air,如何知道用户的air rumtime版本?
Adobe的air网页在线安装是通过这个swf实现的:
http://airdownload.adobe.com/air/browserapi/air.swf
下载,反编译后,里面使用一个叫做ProductManager的类进行客户端环境的签别,验证。一共有两个类文件:AIR.as与 AIRLCEndpoint.as。
从原理上讲,可以hack反编译之后的源码,重新编译为自已的air.swf,然后自定义bridge网页安装实现。
10,隐藏window边框后,鼠标在拖动窗口边界改变窗口大小时,不能设置系统光标样式
这个问题不复杂。如果不使用系统镶边,自定义光标显示对象,添加进显示列表,并添加事情监听实现缩放与拖动逻辑。在livedoc中官方曾见有示例,有兴趣的朋友可以查一查。
大约8月前 - 1个评论
若需转载本站原创文章,请注明: 转载自zrong's Blog
本站转载的文章标题会标明[转]。
本文链接地址: Flex4 Beta中的viewports和scrolling介绍
下面是IViewport的几个基本属性以及它们分别都代表什么。
width, height, contentWidth, contentHeight, horizontalScrollPosition, verticalScrollPosition.
详细介绍见:Introduction to viewports and scrolling in Flex 4 beta
大约10月前 - 16个评论
若需转载本站原创文章,请注明: 转载自zrong's Blog
本站转载的文章标题会标明[转]。
本文链接地址: 在Flex中实现聊天表情图片支持-实战篇
2009年10月29日更新:今天发现,有几个问题,Flash Builder beta2自带的SDK已经解决了(下面标出了),看来beta确实是不能用于正式产品啊……
2009年10月8日更新:Flash Builder beta 2发布后,spark组件中有些类的名称修改了,比如TextFilter改为TextConverter,SimpleText改为Label,TextArea.textview.textFlow改为TextArea.textFlow……因此如果使用beta2,那么下面的源码可能不会编译通过,请自行修改。
我发布“在Flex中实现聊天表情图片支持-资料篇”后,便有许多朋友找我要那个范例的源码。我在文章中就已提过那范例是从网上down来,并非我所做,自然没有源码。不过,也只需要用一个烂大街的方法就能获取源码了(这方法已经被许多老师采用过了,拿一个别人的课件改个名字就能来参赛 ),也不知道为啥要源码的同志不想动动手……
那好吧,源码来了。
例子很简单,所有的代码加起来都不到400行,但做的时候却很痛苦。因为要了解spark组件和FXG的特点,还要了解新的skin的做法。不过总算做好了,总结一下,纠结的地方主要有下面几点:
采用内嵌表情还是采用外部表情图片。
为了获得更小的文件(Flex4比Flex3编译的文件大了200多K),一直是采用外部表情图片的。在本机调试都正常。但上传到网上后,就无法显示图片。调整了swf的base属性之后,图片可以在输入框和文字框中显示,就是不能显示在图片选择面板中。最后一气之下改成了内嵌图片。后来发现有可能是浏览器缓存问题,不过改就改了,也就没再纠缠这个问题。
要注意的是,spark的BitmapImage是不支持外部图片的,必须要内嵌。所以如果要用外部图片,就必须用Halo组件中的Image。而由于TLF中的InlineGraphicElement又仅支持URL或者DisplayObject,而BitmapImage无法提供URL(本来嘛,是内嵌的撒)因此在我将外部图片转成内嵌后,原来的程序出了问题。原因是BitmapImage的source属性返回的是BitmapData对象,如果将其提供给InlineGraphicElement的source属性,就会报错。因此在提供图片信息的时候,必须要提供Bitmap才行。
图片插入到TextInput之后不更新。
检查发现,InlineGraphicElement已经作为textFlow的元素存在了,但是在TextInput中却不显示出来,但如果再输入一些文字的话,图像又可以显示出来。因此判断是textFlow更新后没有执行flowComposer.updateAllControllers。把这个操作放在StatusChangeEvent.INLINE_GRAPHIC_STATUS_CHANGED事件后就行了。
Flex4 spark中的TextInpu焦点定位的怪问题。(Flash Builder beta2自带的SDK已经解决了这个问题)
在发送输入框文字之后,再将文字清空,如果使用按钮来发送文字,则清空过后还能重新定位回输入框继续输入文字;而如果使用TextInput的enter事件来完成这个动作,则清空后返回虽然能重新定位输入框,并显示闪烁的输入光标,但无论如何也无法输入文字了,必须重新单击一次输入框,才能再次输入。后来用一个变通的方法解决了。就是在为输入框重新设置焦点之前,先将焦点移到按钮上,再移回来…… 很无语
当时在这里发帖求助,可没人理,也无语
flowComposer自动清空为null的问题。(Flash Builder beta2自带的SDK已经解决了这个问题)
flowComposer偶尔会自动清空,造成flowComposer.compose()或者flowComposer.updateAllControllers()失效,后来发现在界面大小变更的时候以及通过text=”设置文字清空的时候,flowComposer都可能会清空为null。而只需要重新将ti或者ta设置焦点就可以填充flowComposer的值。
滚动条不更新的问题。
输入的文字超过一屏之后,TextArea会自动出现滚动条。在Halo组件中,我是通过valueCommit事件来更新滚动条,但在spark中没有。不仅valueCommit没用,change等统统没用。后来改为用updateComplete来更新滚动条。其实,如果用textFlow的事件来更新,应该更加保险。
另外,spark的scroller组件也是蛮纠结的,在Halo中用ta.verticalScrollPosition = ta.maxVerticalScrollPosition就可以了,可spark又整了个viewport出来。这不,更新语句又要改成ta.scroller.viewport.verticalScrollPosition=ta.scroller.viewport.contentHeight。
还有几个麻烦的事情,比如ParagraphElement要进行深复制才能用,比如format和hostFormat……算了,不说了,直接看效果好了
大约11月前 - 没有评论
若需转载本站原创文章,请注明: 转载自zrong's Blog
本站转载的文章标题会标明[转]。
本文链接地址: Flex4 中有哪些出色的新特性?
文中介绍了Flex4的命名空间(namespaces)、FXG、布局(layout)、状态(state)和新的mxml标记(如fx:Declarations、fx:Definition、fx:Library等),值得一看。
译文:http://blog.csdn.net/lihe111/archive/2009/08/10/4431579.aspx
原文:http://www.sitepoint.com/article/whats-new-flex-4/
大约11月前 - 没有评论
若需转载本站原创文章,请注明: 转载自zrong's Blog
本站转载的文章标题会标明[转]。
本文链接地址: Flash Text Engine、Text Layout Framework在Flex、Flash中的实现
在在Flex中实现聊天表情图片支持-资料篇一文中,我提到了FTE(Flash Text Engine)和TLF(Text Layout Framework)。它们的强大自不必多说,可去该文章提供的网址查看,或者直接看这个Demo。但是,在Flex与Flash中有对应的组件可以使用么?FTE和TLF是什么关系?下面就来说说吧
关系
用下面这张图来说明是最好的了。TLF是建立在FTE的基础上的。或者说TLF在FTE的基础上实现了“高级功能”。直接使用FTE是很难受的(后面我会专门写文章演示代码),连Adobe都这样说:
“FTE 提供对文本度量、格式和双向文本的复杂控制的低级别支持。尽管可以使用 FTE 创建和管理简单的文本元素,但设计 FTE 的主要目的在于为开发人员创建文本处理组件提供基础。”
请注意加粗的部分。Adobe认为FTE并不适合做文本处理。因此,Adobe又做了TLF,并且将TLF整合到了Flex SDK 4.0(Gumbo)中。但TLF同样不是组件。不过TLF已经可以将需要显示的文本输入到DisplayObject当中,并加入了对选择文本、编辑文本、快捷键、事件的支持,虽然仍不能直接支持滚动条(配合事件和滚动条组件是可以支持的),但这已经前进了一大步,更方便我们使用了。
那我们就基于TLF来开发么?不是。我需要的是像Flash或者Flex中的TextArea组件一样来简单的使用TLF。为了实现我这个美好的愿望,Adobe针对Flash CS4制作了Text Layout Component组件,针对Flex的组件则包含在新的spark包中。
下载Text Layout Component:
说到这里,这个关系就比较顺了。TLF就是FTE的扩展,这个扩展其实还是代码层面多些。而Text Layout Component和spark中的相关组件又是TLF的扩展,它们才是真正的组件级别的应用。所以,我把主要的精力放在熟悉组件的功能与特性上(人懒,没办法 )。当然,对于TLF和FTE我也做了了解,毕竟它们是底层。
本图片采用国产软件EDrawMax绘制,本图片的源文件下载:
大约11月前 - 没有评论
若需转载本站原创文章,请注明: 转载自zrong's Blog
本站转载的文章标题会标明[转]。
本文链接地址: Flash Builder Beta(Flex4,Gumbo):新特性不完全说明
Flash Builder确实很让人激动,我最喜欢的是下面这几个特性:
中文界面
增强的包管理
包重载
新的spark皮肤和组件
自动生成getter/setter
自动生成事件管理函数
主题管理器
新的调试器和概要分析器
中文界面
中文界面看起来就是舒服啊
增强的包管理
包重载
我有个不好的喜欢,过2个月后再看原来的代码,就喜欢把它们重新换个package,这个习惯让我经常头疼于几十上百的类文件的包修改,原来是使用在文件中查找替换进行的,现在FlashBuilder提供这个功能了。
新的spark皮肤和组件
关于这点,我将单独写一篇文章说明
自动生成getter/setter
不说了,直接看图
自动生成事件管理函数
这个功能实在是太太太太方便了,即使没有为组件命名,FlashBuilder也会自动为组件设置一个id。充分方便我这懒人
主题管理器
还是直接看图
新的调试器和概要分析器
这个就看这篇文章吧,英文。
大约11月前 - 3个评论
若需转载本站原创文章,请注明: 转载自zrong's Blog
本站转载的文章标题会标明[转]。
本文链接地址: 使用Flex、Flash Media Server和Flash Media Encoding Server创建视频共享程序
Adobe devnet的文章,详细介绍了如何利用Flex从客户端上传视频,用Flash Media Encoding Server在服务器端转换视频,然后利用FMS流发布视频的流程。浅显易懂,值得一看。
Creating a video sharing web application using Flex, Flash Media Server, and Flash Media Encoding Server
Flash Media Encoding Server好是好,就是太贵了,6K美刀啊 (看完文章我才发现,早知不看这鸟文)……还是ffmpeg比较靠谱
大约11月前 - 15个评论
若需转载本站原创文章,请注明: 转载自zrong's Blog
本站转载的文章标题会标明[转]。
本文链接地址: 在Flex中实现聊天表情图片支持-资料篇
2009年10月9日11:09:14 更新:增加riaidea的范例
2009年9月16日20:34:30 更新:在Flex中实现聊天表情图片支持-实战篇
仔细研究了一下Flex支持表情图片,主要有下面三种方法:
使用TextArea,或直接使用TextField的html支持功能,在html中使用<img>标签嵌入表情图片文件。但这样做有两个问题,一是图片文件载入较慢;二是不容易控制载入的图片在文本中的“流向”。虽然可以使用getImageReference获取对图片的引用,但处理起来也比较费力。
将文本中需要插入图像的地方留出空白空间,获取空白空间的位置,并使用图像替代。这种方法的缺点在于每次更新文字内容的时候,所有的图片都要重排位置,对性能有一定影响,尤其是文本和图像比较多的情况下。
使用Flash Player 10提供的flash.text.engine(简称FTE)提供的高级功能进行处理,具体是使用GraphicElement类,这无疑是更好的方法。Adobe提供的Text Layout Framework(简称TLF)就是架设FTE的基础之上的。
下面是一些我搜集的资料,为后面的实战做个记录:
How to use Text Layout Framework in Flex 3.2 or AIR 1.5
How to add a scrollbar to Text Layout Framework
Utilizing Flash Text Layout Framework using MXML
Flex 用AS3GIF类播放gif动画
Spark Text Primitives – Functional and Design Specification
下面这个范例是我在网上找到的,使用的应该是第2种方法。
(2009年10月9日11:16:10更新)再加一个范例,有源码:
.value;'>
选择月份 2010年七月 (11)
2010年六月 (4)
2010年五月 (15)
2010年四月 (2)
2010年三月 (1)
2010年二月 (1)
2010年一月 (4)
2009年十二月 (7)
2009年十一月 (3)
2009年十月 (1)
2009年九月 (3)
2009年八月 (5)
2009年七月 (1)
2009年六月 (1)
2009年三月 (10)
2009年二月 (4)
2008年十一月 (2)
2008年十月 (1)
2008年八月 (4)
2008年七月 (4)
2008年六月 (4)
2008年五月 (1)
2008年四月 (4)
2008年三月 (7)
2008年二月 (5)
2008年一月 (1)
2007年十二月 (6)
2007年十一月 (7)
2007年十月 (1)
2007年九月 (4)
2007年八月 (6)
2007年七月 (6)
2007年六月 (4)
2007年五月 (4)
2007年三月 (3)
2007年二月 (10)
2007年一月 (12)
2006年十二月 (9)
2006年十一月 (4)
2006年十月 (11)
2006年九月 (10)
2006年八月 (9)
2006年七月 (9)
2006年六月 (11)
2006年五月 (15)
2006年四月 (6)
2006年三月 (16)
2006年二月 (15)
2006年一月 (4)
2005年十一月 (15)
2005年十月 (10)
2005年九月 (8)
2005年八月 (2)
2005年七月 (10)
2005年六月 (5)
2005年五月 (11)
2005年四月 (3)