7.6.使用项渲染器把SWF对象作为一个菜单项显示
7.6.1.问题
用一个图片或SWF 做菜单。
7.6.2.解决办法
用itemRenderer 对象加载SWF 文件,并自定义菜单。
7.6.3.讨论
自定义菜单的第一步是把你想要用到的字体和图形存在一些SWF 文件里,并且把这些SWF 文件放在一文件夹下。在我们的例子中,这个文件夹命名为“swf”,你可以用任工具生成这些SWF 文件。
接下来,创建一个renderer 组件。在本例中我们使用Canvas,并在Canvas 里增加一个SWFLoader 组件。如果我们想用Canvas 做自定义菜单,还有一个条件,就是要让Canvas实现IMenuItemRenderer 接口,因为接口的需要,我们在Canvas 里实现了menu 的set get方法,但什么也没有做。SWFLoader 的source 属性我们赋值为data.swf_wp( 因为这个Canvas 最终会用做renderer,所以用data.xxxx,原文是data.swf,太容易让人迷惑了,我改成了data.swf_wp,在原文和原文的例子中都只提到实现接口中的set menu 和getmenu 方法其实还有三个方法需要实现,下面是我改过的代码,如果对原文兴趣,请见本节结尾部分)。
文件名为: FontItemRenderer.mxml
接下来你要在application 里创建自定义的Menu。要创建一个数组用作Menus 的数据源(dataProvider),在这个数组中每个元素有的两个属性,label 和swf_wp 分别用于菜单项上的文字显示和SWF 显示,其中swf_wp 是SWF 文件的路径。关于ClassFactory 我们在第二章就有讲解。
原文中的代码:
用一个图片或SWF 做菜单。
7.6.2.解决办法
用itemRenderer 对象加载SWF 文件,并自定义菜单。
7.6.3.讨论
自定义菜单的第一步是把你想要用到的字体和图形存在一些SWF 文件里,并且把这些SWF 文件放在一文件夹下。在我们的例子中,这个文件夹命名为“swf”,你可以用任工具生成这些SWF 文件。
接下来,创建一个renderer 组件。在本例中我们使用Canvas,并在Canvas 里增加一个SWFLoader 组件。如果我们想用Canvas 做自定义菜单,还有一个条件,就是要让Canvas实现IMenuItemRenderer 接口,因为接口的需要,我们在Canvas 里实现了menu 的set get方法,但什么也没有做。SWFLoader 的source 属性我们赋值为data.swf_wp( 因为这个Canvas 最终会用做renderer,所以用data.xxxx,原文是data.swf,太容易让人迷惑了,我改成了data.swf_wp,在原文和原文的例子中都只提到实现接口中的set menu 和getmenu 方法其实还有三个方法需要实现,下面是我改过的代码,如果对原文兴趣,请见本节结尾部分)。
文件名为: FontItemRenderer.mxml
+展开
-XML
<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml"
width="100" height="25"
verticalScrollPolicy="off" horizontalScrollPolicy="off"
xmlns:external="flash.external.*"
implements="mx.controls.menuClasses.IMenuItemRenderer">
<mx:Script>
<![CDATA[
import mx.controls.Menu;
public function get menu():Menu { return null ; }
public function set menu(value:Menu):void { }
public function get measuredIconWidth():Number{return 0;}
public function get measuredTypeIconWidth():Number{return 0;}
public function get measuredBranchIconWidth():Number{return 0;}
]]>
</mx:Script>
<mx:SWFLoader source="{data.swf_wp}" width="100" height="25"
horizontalCenter="0" verticalCenter="0"/>
<mx:Label x="0" y="0" text="{data.label}" width="100"
height="25"/>
</mx:Canvas>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml"
width="100" height="25"
verticalScrollPolicy="off" horizontalScrollPolicy="off"
xmlns:external="flash.external.*"
implements="mx.controls.menuClasses.IMenuItemRenderer">
<mx:Script>
<![CDATA[
import mx.controls.Menu;
public function get menu():Menu { return null ; }
public function set menu(value:Menu):void { }
public function get measuredIconWidth():Number{return 0;}
public function get measuredTypeIconWidth():Number{return 0;}
public function get measuredBranchIconWidth():Number{return 0;}
]]>
</mx:Script>
<mx:SWFLoader source="{data.swf_wp}" width="100" height="25"
horizontalCenter="0" verticalCenter="0"/>
<mx:Label x="0" y="0" text="{data.label}" width="100"
height="25"/>
</mx:Canvas>
接下来你要在application 里创建自定义的Menu。要创建一个数组用作Menus 的数据源(dataProvider),在这个数组中每个元素有的两个属性,label 和swf_wp 分别用于菜单项上的文字显示和SWF 显示,其中swf_wp 是SWF 文件的路径。关于ClassFactory 我们在第二章就有讲解。
+展开
-XML
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute" creationComplete="init();"
backgroundGradientColors="[#c0c0c0, #ffffff]">
<mx:Script>
<![CDATA[
import mx.events.MenuEvent;
import mx.controls.Menu;
import compent.FontItemRenderer;
private var menu:Menu;
private function init():void {
var menuData:Array = [{label: "SubMenuItem A",swf_wp:'swf/a.swf', children: [
{label: "SubMenuItem A-1", swf_wp:'swf/a1.swf'},{label: "SubMenuItem A-2", swf_wp:'swf/a2.swf'}]},{label: "SubMenuItem B",swf_wp:'swf/b.swf', children: [{label: "SubMenuItem B-1", swf_wp:'swf/b1.swf'},{label: "SubMenuItem B-2",swf_wp:'swf/b2.swf'}]}];
menu = Menu.createMenu(this, menuData);
menu.itemRenderer = newClassFactory(compent.FontItemRenderer);
}
]]>
</mx:Script>
<mx:Button x="10" y="10" label="Show Menu" id="btnShowMenu"
click="menu.show(btnShowMenu.x,
btnShowMenu.y+btnShowMenu.height);"/>
</mx:Application>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute" creationComplete="init();"
backgroundGradientColors="[#c0c0c0, #ffffff]">
<mx:Script>
<![CDATA[
import mx.events.MenuEvent;
import mx.controls.Menu;
import compent.FontItemRenderer;
private var menu:Menu;
private function init():void {
var menuData:Array = [{label: "SubMenuItem A",swf_wp:'swf/a.swf', children: [
{label: "SubMenuItem A-1", swf_wp:'swf/a1.swf'},{label: "SubMenuItem A-2", swf_wp:'swf/a2.swf'}]},{label: "SubMenuItem B",swf_wp:'swf/b.swf', children: [{label: "SubMenuItem B-1", swf_wp:'swf/b1.swf'},{label: "SubMenuItem B-2",swf_wp:'swf/b2.swf'}]}];
menu = Menu.createMenu(this, menuData);
menu.itemRenderer = newClassFactory(compent.FontItemRenderer);
}
]]>
</mx:Script>
<mx:Button x="10" y="10" label="Show Menu" id="btnShowMenu"
click="menu.show(btnShowMenu.x,
btnShowMenu.y+btnShowMenu.height);"/>
</mx:Application>
原文中的代码:
+展开
-XML
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="100" height="25" verticalScrollPolicy="off" horizontalScrollPolicy="off" xmlns:external="flash.external.*"
implements="mx.controls.menuClasses.IMenuItemRenderer">
<mx:Script>
<![CDATA[
import mx.controls.Menu;
public function get menu():Menu { return null ; }
public function set menu(value:Menu):void { }
]]>
</mx:Script>
<mx:SWFLoader source="{data.swf}" width="100" height="25"
horizontalCenter="0" verticalCenter="0"/>
</mx:Canvas>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute" creationComplete="init();"
backgroundGradientColors="[#c0c0c0, #ffffff]">
<mx:Script>
<![CDATA[
import mx.events.MenuEvent;
import mx.controls.Menu;
private var menu:Menu;
private function init():void {
var menuData:Array = [ {swf:'swf/coolfonts.swf', children: [{label: "SubMenuItem A-1", swf:'swf/meridiana.swf'},{label: "SubMenuItem A-2", swf:'swf/virinda.swf'}]},{swf:'swf/scriptfonts.swf', children: [{label: "SubMenuItem A-1", swf:'swf/monotypecorsiva.swf'},{label: "SubMenuItem A-2", swf:'swf/comicsansms.swf'}]}];
menu = Menu.createMenu(this, menuData);
menu.itemRenderer = new ClassFactory(FontItemRenderer);
}
]]>
</mx:Script>
<mx:Button x="10" y="10" label="Show Menu" id="btnShowMenu"
click="menu.show
(btnShowMenu.x, btnShowMenu.y+btnShowMenu.height);"/>
</mx:Application>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute" creationComplete="init();"
backgroundGradientColors="[#c0c0c0, #ffffff]">
<mx:Script>
<![CDATA[
import mx.events.MenuEvent;
import mx.controls.Menu;
private var menu:Menu;
private function init():void {
var menuData:Array = [ {swf:'swf/coolfonts.swf', children: [{label: "SubMenuItem A-1", swf:'swf/meridiana.swf'},{label: "SubMenuItem A-2", swf:'swf/virinda.swf'}]},{swf:'swf/scriptfonts.swf', children: [{label: "SubMenuItem A-1", swf:'swf/monotypecorsiva.swf'},{label: "SubMenuItem A-2", swf:'swf/comicsansms.swf'}]}];
menu = Menu.createMenu(this, menuData);
menu.itemRenderer = new ClassFactory(FontItemRenderer);
}
]]>
</mx:Script>
<mx:Button x="10" y="10" label="Show Menu" id="btnShowMenu"
click="menu.show
(btnShowMenu.x, btnShowMenu.y+btnShowMenu.height);"/>
</mx:Application>
implements="mx.controls.menuClasses.IMenuItemRenderer">
<mx:Script>
<![CDATA[
import mx.controls.Menu;
public function get menu():Menu { return null ; }
public function set menu(value:Menu):void { }
]]>
</mx:Script>
<mx:SWFLoader source="{data.swf}" width="100" height="25"
horizontalCenter="0" verticalCenter="0"/>
</mx:Canvas>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute" creationComplete="init();"
backgroundGradientColors="[#c0c0c0, #ffffff]">
<mx:Script>
<![CDATA[
import mx.events.MenuEvent;
import mx.controls.Menu;
private var menu:Menu;
private function init():void {
var menuData:Array = [ {swf:'swf/coolfonts.swf', children: [{label: "SubMenuItem A-1", swf:'swf/meridiana.swf'},{label: "SubMenuItem A-2", swf:'swf/virinda.swf'}]},{swf:'swf/scriptfonts.swf', children: [{label: "SubMenuItem A-1", swf:'swf/monotypecorsiva.swf'},{label: "SubMenuItem A-2", swf:'swf/comicsansms.swf'}]}];
menu = Menu.createMenu(this, menuData);
menu.itemRenderer = new ClassFactory(FontItemRenderer);
}
]]>
</mx:Script>
<mx:Button x="10" y="10" label="Show Menu" id="btnShowMenu"
click="menu.show
(btnShowMenu.x, btnShowMenu.y+btnShowMenu.height);"/>
</mx:Application>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute" creationComplete="init();"
backgroundGradientColors="[#c0c0c0, #ffffff]">
<mx:Script>
<![CDATA[
import mx.events.MenuEvent;
import mx.controls.Menu;
private var menu:Menu;
private function init():void {
var menuData:Array = [ {swf:'swf/coolfonts.swf', children: [{label: "SubMenuItem A-1", swf:'swf/meridiana.swf'},{label: "SubMenuItem A-2", swf:'swf/virinda.swf'}]},{swf:'swf/scriptfonts.swf', children: [{label: "SubMenuItem A-1", swf:'swf/monotypecorsiva.swf'},{label: "SubMenuItem A-2", swf:'swf/comicsansms.swf'}]}];
menu = Menu.createMenu(this, menuData);
menu.itemRenderer = new ClassFactory(FontItemRenderer);
}
]]>
</mx:Script>
<mx:Button x="10" y="10" label="Show Menu" id="btnShowMenu"
click="menu.show
(btnShowMenu.x, btnShowMenu.y+btnShowMenu.height);"/>
</mx:Application>
加支付宝好友偷能量挖...