存档

2009年7月 的存档

Flex与Flashvars通讯

2009年7月31日 评论已被关闭

在这里我使用swfobject加载swf

<script type=”text/javascript” src=”swfobject.js”></script>
<script type=”text/javascript”>
 var flashvars =
 {
      testId: “jt0001″,
      edit: “1″
    };
  swfobject.embedSWF(“pro.swf”, “con1″, “100%”, “100%”, “10.0.0″, “expressInstall.swf”,flashvars);
</script>
<body scroll=”no”>
 <div id=”con1″></div>
</body>

在Flex中取得Flashvars中设置值:

var testid=this.loaderInfo.parameters["testId"];
var edit=this.loaderInfo.parameters["edit"];

附SwfObject的一些使用方法:

1、最简单,最基本,只要想插入flash都能用到的经典一句话

<script type=”text/javascript” src=”swfobject.js“></script>
<script type=”text/javascript”>
  swfobject.embedSWF(“test.swf”, “yourFlashContainer”, “300″, “120″, “9.0.0″, “expressInstall.swf”);
</script>

注解:调用方法embedSWF——插入SWF文件,参数依次是
@swf文件的地址;
@用于装入swf文件的容器(如div)的id;
@flash的宽度;
@flash的高度(当然,这里的宽高都可以使用诸如100%这样的百分比来表示);
@正常播放该flash所需的最低版本;
@当版本低于要求时,执行该swf文件,这里利用这个flash跳转到官方下载最新版本的flash插件。(该参数可以省略)

在同一个页面插入多个flash到不同位置时,只要重复上面的语句,使用不同的容器id就可以了。

2、给swf文件传递参数、变量、属性的调用方法
<script type=”text/javascript” src=”swfobject.js“></script>
<script type=”text/javascript”>
//1、使用Json初始化变量、参数、属性
    var flashvars = {
      name1: “hello”,
      name2: “world”,
      name3: “foobar”
    };
    var params = {
      menu: “false”
    };
    var attributes = {
      id: “dynamicContent2″,
      name: “dynamicContent2″
    };
    swfobject.embedSWF(“test6_flashvars.swf”, “content2″, “300″, “120″, “6.0.0″, “expressInstall.swf”, flashvars, params, attributes);

//2、传统的初始化设置,效果一样
    var flashvars = {};
    flashvars.name1 = “hello”;
    flashvars.name2 = “world”;
    flashvars.name3 = “foobar”;
    var params = {};
    params.menu = “false”;
    var attributes = {};
    attributes.id = “dynamicContent3″;
    attributes.name = “dynamicContent3″;
    swfobject.embedSWF(“test6_flashvars.swf”, “content3″, “300″, “120″, “6.0.0″, “expressInstall.swf”, flashvars, params, attributes);
//3、直接写在后面,就一句话,简洁剽悍,不拖泥带水
    swfobject.embedSWF(“test6_flashvars.swf”, “content5″, “300″, “120″, “6.0.0″, “expressInstall.swf”, {name1:”hello”,name2:”world”,name3:”foobar”}, {menu:”false”}, {id:”dynamicContent5″,name:”dynamicContent5″});
</script>

分类: 生活杂谈 标签: ,

Flex 4的十大变化

2009年7月27日 评论已被关闭

1. 集成Adobe Catalyst

Flex 4的一个主要特性就是提供了对Adobe Catalyst(Adobe新的设计工具,用于创建富Internet应用而无需编写代码)集成的支持。Catalyst改变了开发者与设计者协作的方式,因为它清楚地知道应用开发者与设计者之间工作方式的显著差异。这样开发者与设计者都能专注于自己所擅长的领域,凭借Catalyst,无论开发者还是设计者都能按照自己所习惯的方式进行工作。Flex 4中的很多变化都是围绕着Flex与Catalyst的集成进行的。请查看Adobe Catalyst站点以了解其详细信息。

2. Spark组件架构

Flex的每个版本都包含了完整的组件库,其中含有用于构建应用的通用组件,如数据表格、按钮及布局容器等等。Flex 4的底层组件架构名为Spark,而在Flex 3中则叫做Halo。为了支持Catalyst,Flex 4更新了底层的组件模型以达到松耦合的目的。

在新的Spark组件模型中,核心逻辑、皮肤以及布局都被分开了,这样我们就能单独处理其中任意一部分而又不会影响到其他部分。Spark组件模型构建于 Halo组件模型之上,这意味着Spark扩展了Halo的核心基类UIComponent,这样我们就能以增量的方式使用Flex 4,同时还能将Flex 3组件应用在Flex 4应用中。

除此以外,Flex 4还对效果(effect)进行了增强。现在可以将效果应用在任意的对象和类型上,这么做提升了其灵活性。Flex 4的效果由新的“spark.effects”包实现。就像新的组件库一样,Flex 4的效果也被重新实现了,但却并没有对Flex 3的效果进行任何变更,这么做的目的是为了保持向后兼容。请查看Chet Haase所写的关于Flex 4效果的文章或是其博客以更多地了解Gumbo Effect。

阅读白皮书以更多地了解Spark架构

3. MXML 2009

MXML基于XML,构建于Flash Player所用的编程语言——ActionScript 3之上。MXML用于对用户界面和支持工具(比如说IDE,现在是Catalyst了)的视图区域进行布局。MXML 2009包含了大量更新以对不同的行为(核心、皮肤和布局)进行解耦,同时还提供了新的组件库。现在Flex 4的组件在其自己的包中(spark.components)得以实现,同时又没有对Flex 3的组件进行任何变更,为此MXML 2009专门提供了一个新的命名空间以提供支持。

下面的应用声明示例展示了如何使用该命名空间以及如何为Spark和Halo组件定义命名空间:

<s:Application
  xmlns:fx=”http://ns.adobe.com/mxml/2009″
  xmlns:s=”library://ns.adobe.com/flex/spark”
  xmlns:mx=”library://ns.adobe.com/flex/halo”>

这样,我们就可以通过下面的代码声明Flex 4的Button:

<s:Button label=”My Flex 4 Button” />

下面的代码声明了Flex 3的Button:

<mx:Button label=”My Flex 3 Button” />

请浏览MXML 2009规范以深入了解其变化。

4. 对View States的改进

Flex 2将状态(states)概念引入到了Flex框架中,这样我们就可以通过简单的状态改变来管理视图组件的变化。Flex 4改进了视图状态(view states)以简化其语法,这样我们就能更轻松地使用他们了。新语言属性includeIn和excludeFrom就是简化语法的一个例子,我们可以设定组件的这两个属性值以响应状态变化(参见下面的代码示例)。

<!– Given the states A,B,C –>
<m:states>
  <m:State name=”A”/>
  <m:State name=”B”/>
  <m:State name=”C”/>
</m:states>

<!– This button will appear in only states A and B –>
<Button label=”Click Me” includeIn=”A, B”/>

<!– This button will appear in states A and B –>
<Button label=”Button C” excludeFrom=”C”/>

点击这里以进一步了解View States的变化。

5. FXG支持

Flash Player的核心是个绘图引擎。Adobe在Flash Player 10中引入了FXG,现在又将其引入到了Flex中。FXG是个声明式的图形格式,可以在工具间传递内容,这意味着设计者可以在Catalyst或CS4 Illustrator中创建内容,接下来Flex应用开发者就可以将其导入并使用而无需修改任何内容。

请阅读FXG规范以了解更多细节信息。

6. 皮肤增强

Spark组件模型最大的变化在于对皮肤的颠覆性改造,现在皮肤可以控制组件的所有可视化部分,同时还将逻辑封装到了组件核心之外。这样我们就可以对组件的可视化部分进行独立修改而不会影响到底层的核心逻辑。

来看看PanelSkin.mxml皮肤文件吧,Panel容器的默认皮肤代码如下:

<?xml version=”1.0″ encoding=”utf-8″?>
<s:SparkSkin xmlns:fx=”http://ns.adobe.com/mxml/2009″ xmlns:s=”library://ns.adobe.com/flex/spark” alpha.disabled=”0.5″>

   <fx:Metadata>
   <![CDATA[
    /**
     * @copy spark.skins.default.ApplicationSkin#hostComponent
     */
    [HostComponent("spark.components.Panel")]
    ]]>
   </fx:Metadata>

   <fx:Script>
     /* Define the skin elements that should not be colorized.
      For panel, border and title backround are skinned, but the content area and title text are not. */
      static private const exclusions:Array = ["background", "titleField", "contentGroup"];

     /**
      * @copy spark.skins.SparkSkin#colorizeExclusions
      */
     override public function get colorizeExclusions():Array {return exclusions;}

     /* Define the content fill items that should be colored by the “contentBackgroundColor” style. */
     static private const contentFill:Array = ["bgFill"];

     /**
      * @inheritDoc
      */
     override public function get contentItems():Array {return contentFill};
   </fx:Script>

   <s:states>
     <s:State name=”normal” />
     <s:State name=”disabled” />
   </s:states>

    . . . . .

   <s:Rect left=”1″ right=”1″ top=”31″ height=”1″>
    <s:fill>
     <s:SolidColor color=”0xC0C0C0″ />
    </s:fill>
   </s:Rect>

   <!– layer 5: text –>
   <!– Defines the appearance of the PanelSkin class’s title bar. –>
   <s:SimpleText id=”titleField” lineBreak=”explicit”
      left=”10″ right=”4″ top=”2″ height=”30″
      verticalAlign=”middle” fontWeight=”bold”>
   </s:SimpleText>

   <s:Group id=”contentGroup” left=”1″ right=”1″ top=”32″ bottom=”1″>
   </s:Group>

</s:SparkSkin>

由于该皮肤文件唯一的作用就是控制Panel容器的可视化外观,因此设计者可以修改组件的样式而无需编辑其源代码,也不必了解组件的内部行为。更为重要的是,设计者可以按照自己熟悉的方式来使用Catalyst。

点击这里深入了解Gumbo的皮肤组件。

7. 更新的布局组件

熟悉Flex开发的人可能会注意到Flex 3中的大多数容器都已经不在Gumbo组件库中了。这是由于布局已经被解耦了,现在我们需要通过代理(delegtion)来处理他们。因为大多数 Flex 3容器仅仅就是为了提供不同的布局样式(比如说用于水平布局的HBox,用于垂直布局的VBox等等),因此现在他们已经没什么用了。

下面的示例表明Flex开发者现在也可以定义布局了。该示例利用Group类来管理按钮,Group是个新的Spark类,用于管理其中的内容条目。布局的结果就是两个并排放置的按钮,就像是使用Flex 3中的HBox的结果一样。

<s:Group width=”400″ height=”400″>
  <s:layout>
   <s:HorizontalLayout paddingLeft=”5″ paddingTop=”5″ />
  </s:layout>

  <s:Button label=”Button 1″ />
  <s:Button label=”Button 2″ />
</s:Group>

来自Adobe的Ryan Stewart对新的布局机制进行了深入分析

8. Flash Builder 4

Flash Builder 4(之前叫做Flex Builder)是面向应用开发者的最新的Eclipse IDE。该新版本带有众多更新,包括条件调试断点、更多的重构工具并支持FlexUnit 4。一如往常,它还包括MXML、ActionScript 3、可视化设计器以及Flex性能与内存分析器(只有专业版才有该性能分析器)。

除此之外,该最新版还提供了高级的数据管理特性以简化数据为中心应用的开发。这包括客户端的数据管理特性,它可以处理CRUD操作以及在大集合中进行滚动。

点击这里来深入了解该IDE。

9. 编译器性能

几乎每个Flex 3开发者心中都有一个痛——糟糕的编译器性能。基于此,Gumbo的一个主要目标就是改进Flex 4中的编译器性能。虽然官方尚未发布性能基准,但来自Adobe的Peter Donovan根据自己所作的一些试验对其进行了测试,结果表明新的编译器性能提升了25%。他说要想将性能提升3到4倍只能进行重新设计。当然了,每个企业级Flex应用的开发者都希望今年底Flex 4正式发布时能实现这一点。

请阅读Peter Donovan的文章来深入了解相关信息。

10. 新的文本功能

Flash应用(无论是Flex还是非Flex应用)的一个主要议题就是高效处理文本的能力。在Flash Player 10中,Adobe引入了全新的文本引擎以支持RIA的需要(多语言、打印以及键盘快捷键等等)。Gumbo引入了大量新的文本类(RichText、 SimpleText等等)以在Flex框架中提供更健壮的文本支持。除此以外,Adobe正在全力开发新的Text Layout Framework以赋予ActionScript 3开发者利用Flash Player文本引擎的能力。请点击这里以深入了解Text Layout Framework。

如你所见,Flex 4代表了该流行的RIA平台的巨大进步。请查看Matt Chotin的文章《What’s new in Flex 4 SDK beta》来深入了解Flex 4 SDK的变化。

作者简介

Jon Rose是Gorilla Logic, Inc.(位于科罗拉多州的博尔德)的一名企业软件咨询师和Flex业务主管。他还是知名的企业软件社区InfoQ.com的编辑。另外,他是DrunkOnSoftware.com的主办人之一,这是一个面向那些爱豪饮的朋友的视频网站。他的客户有小公司,也有政府部门。爱解决难题的天性使其致力于开发高质量的软件。你可以通过其博客了解他。

来至:http://www.infoq.com/cn/articles/top-10-flex4-changes

分类: 生活杂谈 标签:

as3解析excel表格

2009年7月24日 评论已被关闭

as3解析excel表格

http://code.google.com/p/as3xls/source/checkout

还没有试,待有空试下………..

分类: 生活杂谈 标签:

Flex嵌入HTML的组件:Flexi (v1.2)

2009年7月24日 评论已被关闭

http://www.carballares.es

两个比较有用的函数:showIFrame()和hideIFrame().我们很简单的就可以显示showIFrame() 和 隐藏hideIFrame()我们已经导入的任意URL。

详细内容:
http://www.carballares.es/en/arcadio/?p=254

分类: 生活杂谈 标签: ,

Flash Flex Data Services服务组件大排行

2009年7月24日 评论已被关闭

AMF Projects轻量级
在众多知名的后台语言 上,Flash和Flex开发人员除了可以使用标准的XML/E4X/Socket去请求非序列化的外部服务数据之外,还有一个轻量快捷的通讯机制,使用 AMF (Action Messaging Format),你可以访问opensource.adobe.com去找到关于AMF的详细介绍,这里我只是简单描述AMF是一种基于HTTP协议上以 2进制序列化(10101010101….)和反序列化的方法来传输数据的开放消息通讯格式,用来和Flash Player进行服务端通讯。它的特点是速度快(有多快,请看我Blog中放出的Flex架构剖析里面的环节),开发简单,众多第三方工具集合,缺点是仍 然需要在服务端设置crossdomain.xml,以确保安全沙箱策略的通过。
那么针对众多主流后台语言,Flash和Flex开发者可以有什么样的选择(以下项目资源,均可通过google项目名称得到具体地址)
针对Java,.Net,Ruby和PHP,可以使用WebORB。它提供了通用API来满足Flash Player使用AMF方式跟这四种主流语言构造的后端服务进行消息通信。
专 门针对PHP,有大名鼎鼎的AMFPHP,开源社区第一个支持AMF实现的项目,支持AMF0和AMF3格式,跨越所有Flash Player版本,很成熟。另外一个也是人气鼎沸的Zend AMF,通过Zend PHP Framwork一起交付,同样支持AMF0和AMF3。
专门针对Ruby,你可以使用RubyAMF
针对.Net,可以使用FluorineFx,可以一直支持到.Net Framwork 3.5。
针对Python,可以使用PyAMF和GAE SWF Project,后者不得不提,允许开发者直接使用AMF让Flash Player和Google App Engine通讯,支持Widgets模式,扩展了PyAMF的功能。
觉得这些AMF Projects还不够?听我接着往下讲。
BlazeDS, 提供强有力的Java-based AMF通讯实现方式,同时还支持消息推送。可以使用AMF和任何其他第三方实时通迅整合。除了支持AMF格式,还提供了RPC服务,消息适配服 务,Proxy Service服务和各种Java适配器。BlazeDS将会很快出现.Net版本。
GraniteDS,另外一个强力,免费,开源的J2EE级别的Data Service组件,面向Flash/Flex开发人员提供全面的J2EE之上的EJB3/Seam/Spring/Guice/Pojo级别的数据服务支撑。
Livecycle ES DS,完全的商用级别的Flex数据服务组件,如果上升到银行,电信,证券,海关等专业的企业级数据服务,LCESDS可以满足Flex和后端J2EE各种服务的适配和通讯任务。

转至:http://www.7yue.com/post/340.html

分类: 生活杂谈 标签:

Flex Builder 小提示

2009年7月6日 评论已被关闭

在手动编译(Ctrl+B)的时候,自动先保存文件:
Window->Preferences->General->Workspace 中 勾选 Save automatically before build

分类: 生活杂谈 标签: ,

免费获得Flash Builder Beta版序列号

2009年7月3日 评论已被关闭

免费获得Flash Builder Beta版序列号及其它adobe工具的序列号
https://freeriatools.adobe.com/

分类: 生活杂谈 标签:

容器内阴影效果的代码

2009年7月2日 评论已被关闭

容器内阴影效果的代码

AS代码如下:

private function getBitmapFilter():BitmapFilter {
    var color:Number = 0×96c2e6;
    var alpha:Number = 0.8;
    var blurX:Number = 5;
    var blurY:Number = 5;
    var strength:Number = 2;
    var inner:Boolean = true;
    var knockout:Boolean = false;
    var quality:Number = BitmapFilterQuality.HIGH;

    return new GlowFilter(color,
                          alpha,
                          blurX,
                          blurY,
                          strength,
                          quality,
                          inner,
                          knockout);
}

设置组件的filters属性,组件要设置边框和背景色样式才能看得出,下面是示例:
    <mx:Canvas width=”300″ height=”200″ filters=”{[getBitmapFilter()]}”
        borderStyle=”solid” backgroundColor=”#FFFFFF”/>
可适当调节一些参数值来改变内阴影的效果。