代码改变世界

Flash中外部共享库的运用及Flex实时加载Skin

2009-02-15 11:37  宝宝合凤凰  阅读(1260)  评论(0)    收藏  举报

共享库顾名思义,就是可以让多个影片共享其中的素材,当然这些素材一般都是多个影片重复使用的。比如:有一张背景图,你需要在多个影片中使用,如果你在每个影片中都导入背景图,明显,当下载每个影片时,背景图也重复下载了,这时如果你使用共享库的话,那么无论有多少个影片用到背景图,背景图片也只是下载一次就够了。
  如果延伸一下共享库应用的话,你可以把flash程序与界面分离,如程序单独作一个main.swf,而界面的影片剪辑放入library.swf,这样你如果要换肤的话,只需修改library.swf而没必要打开main源码修改了。
  所以说共享库的好处就是可以减少影片容量,给项目减肥,方便于素材的管理及便于项目协作开发。接下来我们就来看看如何创建自己的共享库。

一、新建一个flash文档,保存文件为library.fla。然后新建元件,名称为circle,类型选择影片剪辑(MovieClip)。
 


展开对话框中的高级选项(点击Advanced按钮),选择Export for runtime sharing复选框,在URL输入框中输入共享库的路径及文件名,本例中是library.swf(此共享库影片与调用此共享库的影片在相同的目录下)。
 


好了,填好后按确定保存。接着发布影片,文件名为library.swf,并关闭library.fla文档。

二、接下来创建一个新文档,来调用共享库中的影片剪辑。
创建新fla文档,保存在相同目录下,文件名为main.fla。然后点击“文件(File)”菜单,选择“导入(Import)”>“打开外部库(Open External Library)”,选择之前建好的library.fla文件。把之前建好的影片剪辑circle从共享库中拖入main.fla文档的库中。这时选择main.fla文档库中的circle,右键选择“链接(linkage)”选项,你会发现元件的“imported for run-time sharing”复选框已经勾上了。

 


好了,共享库中的circle元件已经被导入到main.fla文件中了,但是main.fla文件的大小并没有增加。


注意:
1、如果共享库中的被标为“export for runtime sharing”元件中有嵌套元件的话,这些被嵌套的元件也同样要设置成“export for runtime sharing”。不然的话这些元件将不作为外部共享元件而是直接导入到影片的库中了。
2、如果你修改了外部共享库中的元件,并重新发布。修改过的元件将自动应用到调用它的影片当中去,而不需重新发布这些影片。

点击下载例子源码

文章来自: 闪客居(www.flashas.net) 详文参考:http://www.flashas.net/html/flashas/ASxiaojiqiao/20080316/2660.html

=================================

Flex实时加载Skin

转载自http://hi.baidu.com/ming871/blog ... 2979d5d439c916.html
Flex实时加载Skin2008-08-13 21:36一篇翻译的文章,来自 The Kiwi Project ,这种方法很有用,但是唯一的问题就是,在加载皮肤的过程中,用户等待的问题。如果皮肤文件比较大,没有加载上来之前,程序可以说是无反应的,这样需要我们以某种方式提醒用户当前程序的工作。


实时加载 Flex 皮肤
目前,有很多关于如何在你的 Flex 程序中绘制皮肤的资源。
概述:Flex 支持两种绘制皮肤的方法:贴图和编程。贴图皮肤是在Flash、Photoshop、Firework等软件中创建皮肤资源图像,然后将他们导入(embed)到 Flex 程序中;编程皮肤是建立一个通过程序定义一个控件皮肤的 ActionScript 类。你可能猜到,贴图皮肤比较简单,编程皮肤可以实现更加丰富的效果
这两个方法都有一个共同的缺点是,皮肤资源(对于贴图来说是 SWF/PNG/GIF 等文件,对于编程来说是那个 AS 类)必须在程序编译时就被包括。怎么改进呢?在这篇文章中我将演示一个如何实时加载贴图皮肤的巧妙方法。
为了使这个例子尽可能的简单,我仅建立一个只有一个按钮的 Flex 程序,这个按钮的皮肤是动态添加的。本程序将实时取得一个皮肤 SWF 文件,加载皮肤,然后把它们应用到按钮上。

第一步:为皮肤资源建立一个外壳 SWF
目的,有了这个外壳 SWF,我的 Flex 程序就可以实时加载皮肤中适当的资源
package
{
import flash.display.Sprite;

public class Wrapper extends Sprite
{
    [Embed(source="flex_skins.swf",symbol="RadioButton_upIcon")]
    public var rbUpSkin: Class;
    [Embed(source="flex_skins.swf",symbol="RadioButton_downIcon")]
    public var rbDownSkin: Class;
    [Embed(source="flex_skins.swf",symbol="RadioButton_disabledIcon")]
    public var rbDisabledSkin: Class;
    [Embed(source="flex_skins.swf",symbol="RadioButton_overIcon")]
    public var rbOverSkin: Class;
}
}
译者注:上面代码需要用 mxmlc 编译,不用使用 Flex Builder 去建项目。

第二步:将这个外壳 SWF 放到服务器上
Flex 程序需要从某个地方加载皮肤呀。

第三步:在 Flex 程序中使用 Loader 加载外壳 SWF
我建了一个比较实用的类 ClassLoader 来加载 SWF 文件,并且将其转化为类。以下是一些关键行:
loader = new Loader();
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, completeHandler);
loader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, ioErrorHandler);
loader.contentLoaderInfo.addEventListener(SecurityErrorEvent.SECURITY_ERROR, securityErrorHandler);
...

request = new URLRequest(swfLib);
var contextoaderContext = new LoaderContext();
context.applicationDomain = new ApplicationDomain(ApplicationDomain.currentDomain);
loader.load(request, context);

第四步:从加载的 SWF 中生成类,然后实例化
var wrapperClass:Class = loader.contentLoaderInfo.applicationDomain.getDefinition(className) as Class;
var wrapper:Object = new wrapperClass();

第五步:利用 setStyle 应用皮肤
这个很简单了。
StyleManager.getStyleDeclaration("Button").setStyle("upSkin", wrapper.rbUpSkin);
StyleManager.getStyleDeclaration("Button").setStyle("downSkin", wrapper.rbDownSkin);
StyleManager.getStyleDeclaration("Button").setStyle("disabledSkin", wrapper.rbDisabledSkin);
StyleManager.getStyleDeclaration("Button").setStyle("overSkin", wrapper.rbOverSkin);

第六步:运行程序

那么为什么要这么做呢?动态的皮肤提供给你一个难以置信而格外有力的功能:你可以让你的用户在你的程序上使用他们自己的皮肤。想象一下一个像 Winamp 的 Flex Mp3 播放器。开发人员并不需要为程序建立一个皮肤库,任何人都可以发布一个 UI 通过设置皮肤 SWF (可能在一个配置窗口中)让用户选择任一在社区中提供的皮肤。同样重要的,开发者也有能力来控制哪个皮肤可以被替换,哪个皮肤只能使用原来的皮肤(仅仅对相应的控件调用 setStyle 即可)。最后,将皮肤放到程序的外面,可以有效的保持程序的体积不会太大,肯定要比包含皮肤时要小。