【转】对Adobe Flex的十大误解

原文地址:http://www.blogjava.net/vip01/archive/2007/12/18/168462.html

原文内容如下:(PS:这是一篇陈旧的文章)

对Adobe Flex的十大误解
在这篇文章中开源的blazeds折射出adobe的野心 ,
看了大家的回复

感觉很多人还是不了解flex

特地找了篇文章解释一下
------------------------------------------

在Qcon上,Adobe的James Ward和InfoQ.com一起分享了他推广传播Flex应用框架过程中所遇到的对Adobe Flex的十大误解。
为了运行Flex应用程序用户需要安装新东西。

Ward向InfoQ.com独家论述了Flash采用比例和Flex编程模型:
Flex 2和Flex 3必需运行在Flash Player 9上。Flash Player 9运行时目前已经被安装在世界94%的计算机上:http://www.adobe.com/products/player_census/flashplayer/version_penetration.html

Flex 2和Flex 3的应用程序执行在Flash Player 9环境下。Flex应用程序构建在本地Flash Player API之上,如矢量图形、位图处理和网络(基于浏览器网络协议栈)。Flex框架增加了如日期选择器、数据表格、图表等可重用组件。编译Flex应用程序的结果产生一个SWF文件,它是供Flash Player使用的二进制字节码格式。SWF文件包含的是Flex框架代码和项目自定义代码的字节码。Flex编译器对字节码进行了优化,只将要用的类编译到SWF文件中。

对于桌面应用软件,Adobe的目标是推出自己名为Adobe AIR的新桌面运行时,希望能像Web运行时一样普及。Adobe AIR 1.0版本将于2008年初发布。目前,从labs.adobe.com上可得到的AIR是测试版。许多公司都已经在使用AIR构建产品软件。eBay的应用程序eBay桌面就是一个例子。
Flash Player是100%私有的。

Ward继续为InfoQ.com做出说明:
Flash Player的核心是Tamarin虚拟机,这是Mozilla旗下的一个开源项目。而SWF文件格式不是完全开放的,它是由osflash.org社区备案的。已有很多读写SWF文件的开源产品。Flash Player产品的发展方向在很大程度上受该社区及其需求所影响。Flash Player的核心语言是ECMAScript 262的一个实现,ECMAScript 262是JavaScript的规范。Flex还将CSS用于组件/应用的样式。Adobe AIR使用web标准以及开源技术如Tamarin、Webkit和SQLite作为其桌面应用的基础。
Flash是为设计者、视频准备的,而且让人讨厌。

2007年7月Ward在博客文章“我是如何克服对Flash的恐惧”中指出:
毋庸置疑的,Flash的能力被滥用了。弹出窗口、跳过介绍和烦人的广告横行于我们的屏幕上。我曾听人们说过不应该因为一个宗教被滥用而否定它。这一格言同样适用于技术。FLASH不能因为有些人拿它来做令人讨厌的东西而遭到摒弃。毕竟e-mail并没有因为垃圾邮件泛滥而消失。
Ward为InfoQ.com详细阐述了该主题:
传统的FLASH是用为设计者提供的基于时间轴的工具构建的。Flex是用于构建基于Flash的内容/应用的开发者工具套件。设计者和开发者通过共享两个工具之间的资源能够携手合作。Flex增加了一个全面的组件库:

http://www.adobe.com/go/flex_explorer_a pp
http://www.adobe.com/cfusion/exchange/index. cfm?event=productHome&exc=15&loc=en_us
Flex不是为企业/商业应用准备的。

在过去数周里,Ward 发布了关于Oracle在Adobe Flex之上实现大量新应用的七篇系列博客文章。这些应用软件近来公布在Oracle OpenWorld 上,其范围涉及从销售工具到数据库管理和商业智能。

除了Oracle对Flex的使用,InfoQ.com也公布了一些使用Flex开发企业应用的团体。Ward也为InfoQ.com指出了很多使用Adobe Flex开发企业级应用的例子,包括:Workday, SAP, Salesforce和Business Objects。

Flex太贵。

Ward详述了Adobe所做的一系列努力来消除公众对价格的误解:
Flex是为构建Web和桌面的丰富互联网应用所提供的、免费的开发工具包,并且马上要开源。免费SDK包含了开发者构建RIA应用所需的一切,构建出的RIA应用可在任何浏览器或操作系统上同样工作。免费Flex SDK的一部分部分是一套内容广泛的组件集,其可扩展、可更换皮肤且可访问。你可以在Flex组件资源管理器上看到很多这样的组件:http://www.adobe.com/devnet/flex/samples/code_explorer/

Flex Builder是一个可选的Eclipse插件,这让使用免费Flex SDK开发应用软件更高效。它包括如集成调试、设计视图和代码补全等功能。

最近也采取了不少办法来调整Flex Builder的价格。Flex Builder现正免费提供给学生及教职人员。不带图表组件的vanilla版本Flex Builder,其价格已降至249美元,以此更好地平衡Flex Builder的价格等级。

还有许多构建Flex应用后端基础结构的可选项。为了利用高性能AMF数据传输协议,有如LiveCycle数据服务这样的官方Adobe产品,以及如Granite数据服务这样的众多开源项目。使用AMF消除了以下不必要的步骤:从数据转换为文本(SOAP, RESTful 等),传送,然后再由文本转换回数据。AMF还允许在线传送中保存类型信息。
关于AMF 和其他基于文本序列化技术的比较,请看James Ward的RIA基准应用系统普查:http://www.jamesward.org/census.
Flex的应用程序需要专用服务器。

Ward再次为InfoQ.com讲述:
Flex应用程序可以运行在任何Web服务器,应用服务器和数据库服务器之上。Flex应用程序更像是客户端-服务器应用程序。由于逻辑是运行在Flash Player客户端内,你需要某种方式来与服务器交互。你可以有很多不同的选择将Flex连接到你的基础结构。不需要任何专用库,你可以将你的后端数据和服务暴露为RESTful、XML或SOAP,并且很容易在你的Flex应用中消费这些数据。如果选择使用AMF二进制序列化协议,你可能需要添加一些额外的库到你的web应用软件。AMF只是另外一种序列化技术,就如XML或JSON 一样,所以它可以作为你用于和后端SOA沟通的多样方式中的一种。
Flex很难学。

InfoQ.com社区的Leftie Friele,就InfoQ.com文章”谁在使用Flex?” 发表了评论,详述了他的公司在学习Flex上的经验:
我们初创公司Ezmo在开创以来就在使用Flex,我们非常愉快的使用该框架。

不需要任何Flex/Flash的预备知识,我们可以在少于两周之内构建出我们的应用程序。Java和Flex之间的整合更是超级简单,开始使用Flex就像是公园漫步。

说到工具支持, Flex Builder也是相当不错。如果你熟悉Eclipse环境,你能顺利起飞,不会碰到任何问题。唯一缺憾是缺少更好的持续集成工具和更好的Maven插件来构建Flex应用。
对于Flex新手们,Ward给了一段截屏录像,展示了一个Flex应用的构建过程,以帮助你起步。此外,还有许多关于使用Flex和Java的其他文章在 Adobe Developer Connection上 。

使用Flex,我需要重建我的整个应用。

今年1月,Bruce Eckel发表了一篇题目为”混合Java” 的文章。文章中他认为Java团体应该继续使用Java好的方面,但是也应该采用其他技术来替代Java薄弱的方面。文中主要焦点是使用Adobe Flex作为用户界面来取代传统的Java选项(Swing、JSF等……)

Ward详细阐述了这一概念:
既然Flex应用程序只是应用程序的UI端,而后端通常都是一样的。如果你的后端是依照SOA模式构建的,那么通常很容易将这些服务暴露给一个新的Flex UI。这将保持你现有的商业逻辑不变,无论它使用的是EJB、Spring服务还是POJO。
Flex打破了常规的浏览习惯,象后退按钮。

Ward的博文讨论了后退按钮:
Flex已经内建了对后退按钮的支持且非常容易定制,因此这已不再是问题。Flex也提供了一个简单的办法来处理“#”url(或命名的锚点),url随应用状态的变化而变化。另一个Web 1.0的整合问题业已解决。
Ward为InfoQ.com补充了更多的细节:
Flex 3给应用提供了一个简单的方式在命名的锚点中储存状态参数,当该URL被请求时可以根据这些参数正确地恢复状态。有关这一特点的更多信息可以参见Flex 3特性介绍:深连接专题介绍文档。

可访问性对Flex应用来说一直是非常重要。因为Flash Player与Jaws及其他可访问性技术一起工作的,因此为基于Flash的应用程序增加可访问性的能力已经具备了。Flex框架将可访问性纳入核心框架。有许多不同方面的可访问性,这取决于你的应用程序需要支持什么样的损伤和残疾。你可以在开发者指南中找到更多有关Flex可访问性特性的信息。
Flex能做到的,Ajax也能做到。

Ward解释说:
Flex RIA和Ajax不是非此即彼的关系。像Google Finance网站就展示了如何同时使用Flex和Ajax。Ajax非常适合以内容为中心的应用,而Flex则适合于互动,媒体和数据为中心的应用。如果你的应用介于这两者之间,那么你可以用Flex Ajax Bridge来结合这两种技术。在 Flex 3里,Flex Ajax Bridge已经直接集成到SDK中。如果使用的Flex 2,你将需要单独下载Flex Ajax Bridge。
此外,InfoQ.com社区的Michael Marth讲述了他的小组为什么选择Flex:
我们即将推出的网上约会站点viibee.com使用的就是Flex 2

理由是:付出相同的努力,Flex使我们能够创建的用户体验远远超过我们用Javascript/Ajax所能做到的。

【转】FlashBuilder插件

转自:http://bbs.9ria.com/thread-150898-1-1.html

以下是转载内容:

所谓磨刀不误砍柴工,这些插件可以让你的ActionScript编程事半功倍哦!有些是自己在open-oepn的插件列表一个个找的,有些是在网络上搜集的,以后有了新的插件,也会陆续更新。
如果不清楚怎么安装插件的同学,可以看我的另外一篇《FlashBuilder插件安装的3种方法》
FlashBuilder常用精选

1.Easy Explorer:打开在eclipse中选定文件所在的目录。
这是一个非常不错的插件,有了它,你就可以随时跳到你指定文件的目录了。
地址:http://sourceforge.net/projects/easystruts/

2.全屏插件
Eclipse Fullscreen 是一个让 Eclipse 开发工具可以全屏方式运行的插件,全屏状态下将隐去菜单栏和状态栏。
在线安装地址:http://scharf.gr/eclipse/fullscreen/update/

3.SVN插件
可以直接在FlashBuilder里面直接更新和提交代码到svn,非常方便
在线安装地址:http://subclipse.tigris.org/update_1.7.x

4.vi插件
vimPlugin是eclipse下的vim插件,很好用
1、下载viPlugin下载地址:http://www.viplugin.com/viplugin/
2、解压文件夹,将里面的plugin、feature放到eclipse下的对应plugin、feature文件夹下
3、破解方法:在提示的路径(一般为eclipse或workspace路径)新建一个名为viPlugin.license的文件,内容为Xq@a*4
4、重启eclipse,这是在eclipse中可以看到vi的图标

5.范例查询插件
具体使用方法:当你编写as代码时,需要查询某个类怎么使用,可以使用Ctrl+B调出blueprint,然后在输入框中键入要查询的内容
网址:http://labs.adobe.com/technologies/blueprint
安装教程:http://labs.adobe.com/wiki/index.php/Blueprint:Installation_Instructions

6.代码格式化FlexPrettyPrintCommand
可以自动对齐等对代码进行格式化
在线安装地址:[url=url:http://flexformatter.googlecode. … ntCommandUpdateSite]

7.SourceMate
SouceMate是Flash Builder下的一个收费插件,但在我看来,它完全值得你花点小钱去买。它的功能有很多:可以进行元数据验证(如果你的框架里有使用元数据),可以生成ASDocs和ANT构建脚本,可以搜索FIXME和TODO标签下的语句等等。但其真正的亮点在于重构、模块化和代码生成功能。其中的Extract方法我使用的最多。我很幸运地在一个报告会上得到了一份免费的版本,现如今它对我已经不可或缺
地址:http://www.elementriver.com/sourcemate

8.Flash Builder Task Plugin
支持用注释的方式添加任务标记
用法:
//TODO: 添加任务主标题
// todo – 任务详细描述
//FIXME: 待修复的bug主标题
//FIXme: 待修复的bug详细描述
非常好用哦,这样可以和队友共享一些任务标记啦。
下载地址:http://www.richinternet.de/blog/download/flexbuilderTask_1.0.0.zip

一些精选的比较偏门的插件,个人看着喜欢就安装吧

1.一个可以控制Eclipse字体大小的Eclipse插件
http://code.google.com/p/eclipse-fonts/
快捷键-
CTRL+= : 增大字体
CTRL+- : 减小字体
在线安装地址:http://eclipse-fonts.googlecode.com/svn/trunk/FontsUpdate/

2.EditBox:http://editbox.sourceforge.net/
EditBox是一个能够对选中的代码块进行加亮的Eclipse插件。通过改变代码块的背景或对代码块加边框来实现加亮。

3.Multi Clipboard
http://www.bastian-bergerhoff.com/eclipse/features/web/MultiClipboard/toc.html
Multi Clipboard为Eclipse源代码编辑器提供一个可以把多次复制的内容保存起来的剪贴板,它不会像正常剪贴板一样只是保存最后一次复制的内容。 你可以设置该插件当Eclipse关闭时会把Multi Clipboard中的内容保存一个文件中,当Eclipse再次打开时会重新加载保存到文件中的内容。你还可以通过设置该插件把Multi Clipboard中的内容变成可编辑。

4.EditorList 方便的列出所有打开的Editor
http://editorlist.sourceforge.net/

5.Eclipse Platform Extensions
一组Eclipse插件提供了以下功能:
1.提供把文件名或完整的限定名(Qualified name)复制到剪贴板;?
2.提供垃圾收集功能;
3.用命令提示符(Command Prompt)或资源管理或导航器方式打开所选文件或项目所在的位置。
4.提供重启Eclipse平台的菜单; 支持的Eclipse版包括3.0,3.1,3.2;
在线安装:http://opensource.trajano.net/

6.Vrapper(又一个VI插件)
Vrapper是一个Eclipse插件,它对Eclipse文本编辑器进行了封装提供了类似于Vim的编辑功能。让你可以使用像dd yy $ gg jkli这些常用的高效操作指令。安装完Vrapper 之后, 工具栏会出现一个Vim 的图标, 点击一下就可以进入Vim 模式了。可以在Eclipse 的正常编辑模式和Vim 模式之间随意切换。
地址:http://vrapper.sourceforge.net/home/

7.JGit是Git版本控制一个的客户端Eclipse插件。
地址:http://www.eclipse.org/egit/

8.ActionScript Code Coverage Plug-in
ActionScript代码覆盖插件,这个插件可以让你知道你的代码里有那些方法没有被调用到,也就是说那里写了多余的代码:)
地址:http://www.adobe.com/devnet/flash-builder/articles/ascode-coverage.html

最后是几个我没测试成功或者版本过期的插件,有兴趣的同学可以继续研究(之前新闻区发过的)
FlexPMD
FlexPMD是一个代码检测工具,可以检测到一些Flex和Actionscript代码中并不规范、但Flex编译器又无法发现的小细节。使用它有助于提高代码质量,当我写完一段新代码时,我第一件要做的事情就是用FlexPMD过一遍。
你可能不会全盘认可它作出的提示,但你也可以进行设置,使之适应你自己的代码风格。使用该工具的前提是:你必须了解如何编写规范的Flex代码,以及Flex框架的少量相关知识。
FlexPMD还可以显示出代码中被复制和粘贴过的区域,以帮助你确定哪些部分需要重构。在你需要了解一个项目含有多少粘贴来的代码时,该功能显得非常实用。
FlexPMD也可以在Ant、OSX Automator以及Maven等环境下使用,还可以集成到一个如Hudson这样的持续可集成系统的一部分。
FlexPMDhttp://sourceforge.net/adobe/flexpmd/wiki/FlexPMD%20Eclipse%20plugin/

FlexCover
FlexCover是一个针对Flex、AIR的代码覆盖率测试工具,其最新版本更方便使用,因为你只需要用FlexCover SDK覆盖掉你正在使用的Flex SDK再重新进行编译就可以了。在你进行单元测试时,它会同时提供代码覆盖率和分枝覆盖率。这非常有助于你了解需要进行哪种测试,以及是否已经做了足够的测试。
即便你的项目没有单元测试(为你感到羞耻)。FlexCover也能对你的代码中的无效部分作出较好的提示。
地址:http://code.google.com/p/flexcover/

【转】Flex 4与自定义布局

原文地址:http://blog.csdn.net/lihe111/article/details/4325571

如果您还不熟悉Flex 4的最新功能,那么有些内容肯定是您想要了解的。Flex 4/Spark组件架构的新功能之一是可以定制一个容器的布局而不必改变容器本身。您需要做的就是定义一个自定义布局。

Flex 4/Spark架构中的容器并不控制它们自己的布局。相反,每种容器具有一个布局属性,用于确定如何在屏幕上设置子元素的布局。可以使用一个单独的Group容器,并赋予其一个垂直布局、水平布局或平铺布局,这取决于您将如何创建它。代码很简单,如下所示:



         

不过真正的好处在于您不必局限于框架中定义的默认布局。您可以轻松定制BaseLayout类来实现自己定制的布局逻辑。下面是一个简单的例子,显示了如何实现一个在原点周围顺时针放置组件的布局。只要单击左下方的按钮就可以将更多按钮添加到布局。

下面是主应用程序文件的代码。可以看到,代码相当简单。这就是一个DataGroup,有点像一个重复程序(repeater),它包含一组按钮。这个容器的布局基于一个自定义布局实现。在creationComplete中,填充DataGroup的数据提供程序,从而在布局中创建按钮实例。




 
  
    
 
  
    
  
 
  
   
    
      
    
 
  
 
  
 

可以看到,DataGroup实例的布局受CircularLayout类控制(该类如下所示)。该类只是循环遍历datagroup对象的子对象并将它们按顺时针方向放在一个圆圈内。我查看了VerticalLayout类的源代码,弄清了它的工作方式,并由此开始构建自己的布局实现。


package
{
   import mx.core.ILayoutElement;
  
   import spark.layouts.supportClasses.LayoutBase;
  
   public class CircularLayout extends LayoutBase
   {
      override public function updateDisplayList(w:Number, h:Number):void
      {
           super.updateDisplayList(w, h);
            
           if (!target)
             return;
                
           var layoutElement:ILayoutElement;
           var count:uint = target.numElements;
            
           var angle : Number = 360/count;
           var radius : Number = Math.min( target.width/2, target.height/2 ) - 25;
            
           var w2 : Number = target.width/2;
           var h2 : Number = target.height/2;
            
           for (var i:int = 0; i < count; i++)
           {
              layoutElement = target.getElementAt(i);
                   
              if (!layoutElement || !layoutElement.includeInLayout)
                continue;
           
              var radAngle : Number = (angle * i) * (Math.PI / 180) ;
           
              var _x : Number = Math.sin( radAngle );
              var _y : Number = - Math.cos( radAngle );
           
              layoutElement.setLayoutBoundsPosition( w2 + (_x * radius) - 25, h2 + (_y * radius) - 10 );
            }
       }
    }
}

这个示例中使用的项目渲染器实际上是最基本的。它是一个只包含一个按钮的ItemRenderer实例,简单明了并且很容易看到产生的结果。



 
  
    
    
  
 
  
    
  
 
  
 

这个例子使用从以下网址得到的4.0.0.7052每日构建(nighly build)版本进行创建:
http://opensource.adobe.com/wiki/display/flexsdk/Download+Flex+4

英文原文:http://www.insideria.com/2009/05/flex-4-custom-layouts.html

转:Flash Builder 4的快捷方式和调试技巧

我用的windows环境,原文中说的不对的地方,更正了下。

[content assist]内容辅助:Ctrl-Spacebar(译者注:Windows下应该是”alt-/”)——我敢肯定,大多数开发人员都知道该快捷键,但如果出于某种原因,你还没有使用它的习惯,那现在就必须要开始使用了。 使用它可以弹出一个提示框,显示当前对象的所有可用属性和函数。 而你们当中的很多人也许不知道的是,此时可以再按Ctrl-Spacebar(alt-/)来切换显示该对象的相关属性、样式或事件。 有人管这叫”循环提示”。此时弹出的提示框的底部将提示当前显示列表的类型(全部、属性、事件、样式等)。正因为此,现在的我很依赖、而且认为自己不能没有它!
–ct 更正一下,windows下默认也是ctrl+space,而且和搜狗输入法冲突,我一般改为Alt+.

[organize import]组织导入:Shift-Cmd-O ——该快捷键可用于清理未起作用的导入声明语句,并以包的格式组织它们。 此功能早在Flex Builder就存在,但仅限于ActionScript文件。如今在Flash Builder 4下对MXML也可以使用了。
–ct 自己试了一下,没用,默认是shift+ctrl+o

[quick outline]快速大纲:Cmd-O——可以从当前位置迅速跳转到特定的变量或函数。 在弹出的提示框中输入前几个字母,你就能从提示中看到你要跳转的内容,然后单击跳转到那里。 这是一个你读过本文必须学会使用的技巧。
–ct 这个应该是ctrl+o

[quick access]快速访问:Cmd-3 ——该快捷键将打开一个编辑框。 你可以在此框中输入你要找的内容名字的子字符串,甚至只需要输入首字母,它就会显示所有匹配结果。 例如,如果你想查询TestCase类的细节,你可以只输入tcc或TCC就能显示出来(译者注:FB中文版输入tc或TC,因最后一个”c”已被翻译为中文”类”)。 该功能与代码提示很相似。但最酷的是,它可以保存你的操作记录,例如,如果你正在调试应用程序,最近使用过的调试命令将依次显示在该编辑框的操作记录上,以便你可以很快再次执行该命令。 对于我个人而言,我经常在使用Flash Builder下的Tour de Flex插件,此时只需要键入Cmd – 3和”tdf”,就可以调出它了(前提是你已经安装了该插件,如果你没有,你一定得装上!你可以在这里阅读该插件的相关信息)。 下面是显示正在使用该功能的截图,(见图1):
–ct 这个是ctrl+3

[word completion]文字补全:Ctrl-.(译者注:Windows下应该是”Ctrl-alt-/”)——键入一个单词前半部分,然后使用此快捷键(Ctrl-.),可以自动补全你要打的单词。如果它第一次补全的内容不是你想要打的单词,你可以重复按此键直到匹配为止。 该功能与手机打字很类似。 –ct 这个默认是alt+/,不如内容辅助好用

更正缩进:Cmd-I——选中需要更正缩进格式的代码块,再按Cmd-I即可,完全无需手动去做。
–ct 这个是ctrl+i,我一般用apply format –ct 下文说的cmd,应该都是ctrl

复制行:Option(Alt)-Cmd-向上方向键

将行上移/下移: Option(Alt)-向上或向下方向键

删除行(不使用剪贴板) : Cmd-D
–ct 这个用的最多,是ctrl+d

删除上一个词语 :Cmd-Backspace

快速访问声明语句:举例而言,先反白一个函数的函数名,按住Cmd键不放(译者补充:按住不放大概1秒后再移上光标)它会变成蓝色的超链接样式,此时可以通过点击它快速访问该函数的声明语句。

Flash Builder中内置的版本控制功能:Flash Builder 4其实保存着你的文件更改操作历史,并允许你将当前文件与较老版本进行比较,还可以通过比较和替换功能恢复到一个较老版本。其比较功能使用内部差异记录你的当前版本和较老版本的差异。
–ct 说的是svn或git插件吧

设定打开编辑器的最多个数:Flash Builder 4现在多了一个设置,允许你设置打开编辑器的最多个数,而不是可以无限地打开。 当打开编辑器个数超过设定值,将会自动开始关闭先前打开的编辑器。 这个选项默认没有被勾选。 你需要点击”窗口>首选参数>常规>编辑器”,勾选复选框(译者注:名为”自动关闭编辑器”),并设定你想要设定的值。

上一个/下一个状态:Cmd-\ 和 Shift-Cmd-\——当使用状态窗口时,此快捷键可将所有不在当前状态的代码反灰以便于你查看,并会根据你的选择跳转到上一个/下一个状态。

显示”调用层次结构”:Ctrl-Option-H (译者注:Windows下应该是”Ctrl-alt-H”)——可以显示某函数在何处被调用。 在你需要修改或者删除一个函数时,你可以利用该功能查找需要同时作出修改的相关代码。

切换编辑器:Ctrl-Tab(译者注:按前面的格式,这里还要补充Ctrl-shift-Tab)——使用它可以迅速切换不同文件的编辑窗口。 与此相关的快捷键有”打开类型”(Shift-Cmd-T)和”打开资源”(Shift-Cmd-R)的。 这些快捷键允许你快速打开Flex SDK中的或任何可以打开的类型的源代码文件。

查看或修改快捷键 ——点击”窗口>首选参数>常规>键”可以根据需要任意修改快捷键,还可以在此设置快捷键的作用条件。

生成事件处理函数,如果你键入一个事件的过程中,在弹出的代码提示里选择它按下回车键,将得到一个生成该事件的事件处理函数的选项。 例如,在一个按钮的内置属性中,如果你键入”click”的前几个字母,并在代码提示中选中”click”并按下回车键,会跳出一个 “生成click处理函数”选项。 如果单击它,Flash Builder 4将自动在你的Script区块中新增该函数(如果你还没有建立Script区块也会自动帮你建好)。

小技巧: 先给你的MXML组件设置一个id,然后再生成事件处理函数,生成的函数就会自动命名为该id。例如,如果按钮的id是myBtn,单击”生成click处理函数”将生成名为 myBtn_clickHandler 的函数。 新建MXML外观 :此选项可用于快速创建自定义组件的内嵌的外观。 选中一个Spark组件,点击其”外观”属性旁边的下拉按钮,并按下回车键,再选择”创建外观”将打开一个新建MXML外观的对话框(参见图2):

请注意,你可以创建一个默认的Spark外观的副本,然后根据需要进行修改,这可以大大加快你的项目进程。 另外,请注意不要选中”删除ActionScript样式代码”复选框。 如果你确实不需要修改设置的样式,那就可以选中此框。

创建项呈示器 –该选项的使用方式类似于前例,不过是用来快速创建项呈示器的。 该选项适用于所有可以使用项呈示器(包括MXML中的)的组件。

代码注释的快捷键 ,如果要快速注释一段ActionScript代码块,使用CMD -/会很方便。 而对MXML代码则要使用Shift-Cmd-C。 你应当留意这些注释代码的快捷键,因为我发现我在需要快速进行调试的时候,或者觉得不应该删除一大段代码而最好注释之的时候,我总在不断的使用这一快捷键。

生成getter / setter ,可以自动生成getter / setter函数(见图3)。 这是一个我经常在Eclipse和开发中使用的选项,我觉得它非常有用。 此选项位于主菜单的”源代码”菜单上,或右键单击代码部分,再从右键菜单中的”源代码”下选取。 请注意,此时必须保持你的光标已选中变量声明的那一栏。

快速导入所需的类 ,这可能是最懒的一个技巧,但我觉得自己总在使用它。 如果我不知道某个特定的事件所处的包,而又不需要一个创建变量(这将自动为你导入该包)时,甚至我就算知道包名,但懒得手动添加它时,我会另开一行,并键入一个变量声明,使用代码提示选择我需要的类,就会自动导入该类,然后按Cmd – D删除该行并结束导入。

原文地址http://www.adobe.com/cn/devnet/flex/articles/flashbuilder_shortcuts_tips.html Flash Builder 4的快捷方式和调试技巧

Flex实现自定义组件默认皮肤示例

今天遇到一个问题,通过css定义自定义组件的皮肤的时,组件的样式失效,仍然为默认样式,(但是通过直接设置组件的skinClass属性时生效)其原因是自定义组件的默认皮肤的设置方法有问题。下面讲讲如何设置自定义组件的皮肤。用code可以将问题表述为:the right way to set customer component’ default skin, won’t cause skin defined in css not working problem. 下面是代码示例: 总共包含4个文件:

/SkinTest.mxml //主应用程序 
/com/ct/codesample/MyComp.as //自定义组件 
/com/ct/codesample/MyCompSkin.mxml // 皮肤1 
/com/ct/codesample/MyCompSkin2.mxml // 皮肤2

MyComp.as代码:

package com.ct.codesample
{
    import flash.events.Event;

    import spark.components.Label;
    import spark.components.supportClasses.SkinnableComponent;

    /**
     * MyComp,即作为示例的自定义组件,具有一个属性:description,以及2个Label外观元素:
     * titleLabelDisplay和valuelabelDisplay。MyComp.as文件只负责组件的逻辑部分。
     * 
     * @author cachetian
     *      2014-05-21
     */
    public class MyComp extends SkinnableComponent
    {
        public function MyComp()
        {
            super();
        }

        private var _description:String

        /**
         * 约定:description的格式必须为<title>,<value>,例如:"组件示例,这是一个组件示例"
         */
        public function get description():String
        {
            return _description;
        }

        // 标记description更改过的标记
        private var isDescriptionChanged:Boolean = false;

        public function set description(value:String):void
        {
            _description = value;
            // 因为属性设置的有可能比皮肤早,所以先要标记一下,稍后皮肤创建的时候记得更新。
            isDescriptionChanged = true;
        }

        override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
        {
            // TODO Auto Generated method stub
            super.updateDisplayList(unscaledWidth, unscaledHeight);

            //
            // 这里是组件的逻辑部分示例
            //
            if (isDescriptionChanged)
            {
                isDescriptionChanged = false;
                var slice:Array = description.split(",");
                if (slice.length > 1)
                {
                    titleLabelDisplay.text = slice[0];
                    valuelabelDisplay.text = slice[1];
                }
            }
        }

        [SkinPart]
        public var titleLabelDisplay:Label;

        [SkinPart]
        public var valuelabelDisplay:Label;

        //
        // 注意,这里是设置默认样式的方法
        //
        override protected function attachSkin():void
        {
            if (getStyle("skinClass") == null)
            {
                // 设置默认样式
                setStyle("skinClass", Class(MyCompSkin));
            }
            super.attachSkin();
        }
    }
}

MyCompSkin.mxml代码:



    
        
            [HostComponent("com.ct.codesample.MyComp")]
        
        
            
            
            
            
        
    

MyCompSkin2.mxml代码:



    
        
            [HostComponent("com.ct.codesample.MyComp")]
        
        
            
            
            
            
        
    

SkinTest.mxml代码:



    
        
            @namespace s "library://ns.adobe.com/flex/spark";
            @namespace mx "library://ns.adobe.com/flex/mx";
            @namespace codesample "com.ct.codesample.*";
            .s2{
                skinClass:ClassReference("com.ct.codesample.MyCompSkin2");
            }
            #main_layout{
                gap:10;
                top:10;
                left:10;
                right:10;
            }
        
        
            
            
        
    

下面是运行结果:

SkinTest的运行结果

最后总结一下,我不知道如何是最正确的设置默认Skin的方法,但是至少知道在Constructor构造函数中设置是错误的,会引起我上面说的错误,应该在稍后一点的时机,简单的可以重新在attachSkin方法里。

Flex URLLoader使用例子

在Flex中一般可以使用URLLoader发起Http请求,示例代码如下:

package com.ct.codesample
{
    import flash.events.Event;
    import flash.events.IOErrorEvent;
    import flash.net.URLLoader;
    import flash.net.URLRequest;
    import flash.net.URLRequestMethod;
    import flash.net.URLVariables;

    /**
     * URLLoader 使用例子
     * @author tianmu
     *          2014-05-18
     */
    public class UsingURLLoader
    {
        public function UsingURLLoader()
        {
        }
        
        public function main():void
        {
            try
            {
                var urlLoader:URLLoader = new URLLoader();
                var urlVariable:URLVariables = new URLVariables();
                var urlRequest:URLRequest = new URLRequest();
                
                // 添加事件监听
                addEventListeners(urlLoader);
                
                // 添加输入参数
                urlVariable.username = "ct";
                urlRequest.data = urlVariable;
                urlRequest.url = "http://localhost:8080/HttpServer/hello";
                urlRequest.method = URLRequestMethod.POST;
            
                urlLoader.load(urlRequest);
            }
            catch (error:Error)
            {
                trace("An Error Occur! Error Message is :" + error.message);
                trace(error.getStackTrace());
            }
        }
        
        protected function addEventListeners(urlLoader:URLLoader):void
        {
            urlLoader.addEventListener(IOErrorEvent.IO_ERROR, onIOError);
            urlLoader.addEventListener(Event.COMPLETE, onComplete);
        }
        
        protected function onIOError(event:IOErrorEvent):void
        {
            trace("onIOError");
            if (null != event)
            {
                trace(event.text);
            }
        }
        
        protected function onComplete(event:Event):void
        {
            trace("onComplete");
            if (null != event)
            {
                try
                {
                    // 获取返回值
                    var dataStr:String = (event.target as URLLoader).data;
                    trace(dataStr);
                    
                    // 解析JSON对象
                    var dataObj:Object = JSON.parse(dataStr);
                    if ("ok" == dataObj.result)
                    {
                        trace(dataObj.greeting);
                    }
                }
                catch (error:Error)
                {
                    trace("An Error Occur! Error Message is :" + error.message);
                    trace(error.getStackTrace());
                }
            }
        }
    }
}

Flex多线程编程思想

我们都知道,Flex本身不支持多线程接口,勉强也是唯一算多线程的类,就是Timer了
虽然看起来多线程不可能,但是Flex为我们创建了一个异步编程的世界
如果没有明显说明是同步的,Flex大部分api都是异步的,比如Alert.show、Moudle.load、Loader.load等等
下面说重点,Flex多线程编程思想是用异步模拟,其实Flex里面最核心的类是EventDispacher,它是异步编程的物质基础,每一次dispatch event,其实都会造成一次线程切换(是通过底层实现的),于是我们(事件处理函数)就进入另一个线程,虽然实际又进入了是同一个线程,但是多线程的"感觉"就有了
利用Socket,要实现真正的多线程,我们希望一部分代码逻辑是并行执行的,可以通过Socket,交给其他进程来处理,然后再监听Socket完成事件,回到主线程
或者去编写本地扩展native extension,利用c、c++或Java语言的多线程接口,去完成一件运算量大,或需要同步完成一系列逻辑的耗时操作
欢迎提出不同意见,拍砖请致blog@cachetian.com

Flex ios开发的一个隐蔽问题

(花了5天时间,找到了一个隐蔽的问题,感慨一下已经半夜了)

话说是这样的,Flash Builder已经强大到可以跨移动平台:android, ios, blackberry,在做ios开发时,需要一些申请证书的手续,另外apple对app在手机上跑还做了限制,需要一个mobile provision文件,这些东西都是花絮了,问题就在于,app写好了,本机模拟器上跑正常,甚至真机调试也是正常的,但是发布一跑就挂。

插一句:FB在打包ipa的时候,时间太长了,这个问题,必将引起公愤,也是导致我进度缓慢的最主要原因!

研究发现,debug模式下的ipa内部结构和release模式下不一样!能猜到不一样,毕竟时间不一样,但是,对程序又有什么影响呢,这个猜的很费脑筋。最后,我试出来的:

里面一些地方用到了swf,采用的swfloader,动态引入的方式,即source=’xxx.swf’,页面里包含这样的内容就挂。

解决方法:改为source=@Embed(‘xxx.swf’),即静态进入方式即可。

原因:FB把所有它认为会用到的swf都打包了,不允许自己在运行时load swf了。有人也问了

感谢元旦,不然真搞不定……

Flex Air内存泄露与解决方法

不写立马一篇日志,简直对不起自己这一天的苦心研究啊

内存泄露

一般内存泄露就是申请的内存没释放,程序运行久了会导致系统卡死,死于没有可用内存了

关于虚拟机的内存泄露是指,无效资源不能被垃圾回收器判断为回收,运行久了,导致新生代全满,新的对象的申请和释放都在老年代,程序运行超慢,因为没可用内存了

ps:新生代和老年代说的是jvm (java 虚拟机)的

比如,3个函数里的局部Object实例,正常情况下,局部变量在函数返回时都该回收了,但是如果这3个实例抱成一团,比如a关联了b,b关联了c,c关联了a,像是孤岛群的样子,那么jvm是不能回收了,它认为,只要不是孤岛,就说明有人在用,就不回收。这显然,bug了

Flex Air,类似于jvm,也是一个跨平台解释执行环境,所以,内存泄露原理完全同java,下面说说Flex里面会遇到的内存泄露情况。

例子

比如ATM软件,它运行起来就是几个页面不停的流转与切换,每个页面有图片,有SWF视频,声音文件等,运行了一天半天了,突然发现系统内存被占用100%了,心里一阵狂躁

原因

存在孤岛群,所以释放不了。所有应该回收而不能回收的情况,肯定都是因为这个。需要我们稍加注意,手动去解除它们之间的关联关系。

罪魁祸首们:

——–小分割

1. addEventHandler

去看看sdk源码,里面频频用到removeEventHandler,其初不明白为啥,原来添加了监听,那么回调函数这层关联会形成孤岛群,造成内存泄露

2.BitmapData

位图,以及使用它作为source的Image图片,如果没人告诉你,你根本想不到BitmapData还有dispose方法,如果不调用,造成内存泄露

3.SWF

Shock Wave Flash,Flash的文件格式的文件,load进来以后,需要unloadAndStop,否则造成内存泄露。

4.Module

同上,load需要unload,否则内存泄露

5.Effect

这个神奇了,特效使用完毕后,Effect.target必须置为空,否则内存泄露。

——–小分割

小结

没有完美的语言与运行环境,但是有完美的设计,解决性能,内存泄露等问题一般都是使用缓存,以及在合理的时机更新或同步,以及足够的异常处理等一系列手段解决。突然联想到一件事,就是使用hibernate,总出现莫名其妙提交失败之类的问题,其原因往往就是太依赖自动管理了,其实少了量的地方使用sql,来弥hibernate微操作做能力弱的缺点。