Edison’s Blog

<item icon=”assets/myIcon.png”/>

DynamicIconListItemRenderer:

import com.edison.util.IconUtility;

import flash.display.DisplayObject;

import mx.controls.List;

import mx.controls.listClasses.ListData;

import mx.controls.listClasses.ListItemRenderer;

public class DynamicIconListItemRenderer extends ListItemRenderer

{

public function DynamicIconListItemRenderer()

{

super();

}

override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void

{

super.updateDisplayList(unscaledWidth,unscaledHeight);

// make a distance between the icon and the label

var distance:Number = 5;

label.x = label.x + distance;

}

//重写此方法

override protected function commitProperties():void

{

if(!ListData(listData).icon)

{

ListData(listData).icon = IconUtility.getClass(this,data[List(listData.owner).iconField]);

}

super.commitProperties();

if(this.label.x == this.icon.x)

{

this.label.move(this.icon.width,this.label.y);

}

}

}

DynamicIconMenuBarItem:
import com.edison.util.IconUtility;

import flash.display.DisplayObject;

import mx.controls.menuClasses.MenuBarItem;

public class DynamicIconMenuBarItem extends MenuBarItem

{

public function DynamicIconMenuBarItem()

{

super();

}

//重写此方法

override protected function commitProperties():void

{

super.commitProperties();

if(icon == null && data != null)

{

var iconClass:Class = IconUtility.getClass(this,data[menuBar.iconField]);

icon = new iconClass();

addChild(DisplayObject(icon));

}

invalidateDisplayList();

}

}

在上次讨论这个问题的时候，借助重写MenuBar来解决这一问题。但是重写的话，有时会觉得比较麻烦。今天做东西的时候找到了一个更好的方法。
假设有如下文件：
package app.icons
{

[Bindable]

public class AppIcons

{

[Embed(source="assets/iPhone Phone.png")]

public static var sendInfo:Class

}
}

可以使用getQualifiedClassName(app.icons.AppIcons.sendInfo)来获取图标类的完整路径，然后如下所示设置数据既可：
“<menuitem label=’发送’ icon=’”+getQualifiedClassName(AppIcons.sendInfo)+”‘>”
这样的话让MenuBar的iconField=”@icon”，就可以使其按钮以及子按钮前面显示相应的图标了。

A fun 2D physics sandbox by Emil Ernerfeldt (email: phungame gmail com)

一个2d物理引擎，挺酷的，至少按视频里的表现。

原文地址：http://www.acc.umu.se/%7Eemilk/media.html，视频下载地址：wmv

今天做项目，使用自带的Menu MenuBar组件，发现无论怎么定义数据和iconField，菜单和子菜单里面就是不显示图标。最后实在没法子，在网上搜了很多资料，发现必须使用如下形式的定义才可以在菜单里显示图标。

public var _addUser:Class = AppIcons.addUser;

public var _addGroup:Class = AppIcons.addGroup;

public var _sendMessage:Class = AppIcons.sendMessage;

public var _editUser:Class = AppIcons.editUser;

public var _deleteUser:Class = AppIcons.deleteUser;

<mx:MenuBar width=”100%” height=”30″ iconField=”@icon” labelField=”@label”>

<mx:dataProvider>

<mx:XMLList>

<menuitem label=”新建” icon=”_addUser”>

<menuitem label=”联系人” icon=”_addUser”>

<menuitem label=”联系人” icon=”_addUser”/>

<menuitem label=”联系人” icon=”_addUser”/>

</menuitem>

<menuitem label=”分组”/>

</menuitem>

<menuitem label=”加入组” icon=”_addGroup”>

<menuitem label=”组一” />

<menuitem label=”组二”/>

<menuitem label=”组三”/>

<menuitem label=”组四”/>

<menuitem type=”separator”/>

<menuitem label=”新建联系组”/>

</menuitem>

<menuitem label=”发送短消息” icon=”_sendMessage”/>

<menuitem label=”编辑” icon=”_editUser”/>

<menuitem label=”删除” icon=”_deleteUser”/>

</mx:XMLList>

</mx:dataProvider>
</mx:MenuBar>

AppIcons如下定义：

[Bindable]
public class AppIcons
{

[Embed(source="assets/iPhone Phone.png")]

public static var sendInfo:Class

[Embed(source="assets/Address Book.png")]

public static var addressBook:Class

[Embed(source="assets/find.png")]

public static var infoQuery:Class

[Embed(source="assets/user manage.png")]

public static var userManage:Class

[Embed(source="assets/note.png")]

public static var note:Class

[Embed(source="assets/user_add.png")]

public static var addUser:Class;

[Embed(source="assets/group_add.png")]

public static var addGroup:Class;

[Embed(source="assets/phone.png")]

public static var sendMessage:Class;

[Embed(source="assets/user_edit.png")]

public static var editUser:Class;

[Embed(source="assets/user_delete.png")]

public static var deleteUser:Class;
}

但是还是有问题，子菜单里还是没有办法显示图标。于是又开始人肉搜索。可惜搜索了半天也没有结果。没法子，只好老老实实读sdk的源代码。经过不断的调试，发现在MenuBar的getMenuAt方法里面，adobe的同志生成menu的同时没有给其设置document，因此我们在使用menuBar的文档中定义的icon是没有办法被解析的。（参见adobe flex sdk中MenuBar 的getMenuAt方法，itemToIcon方法，以及Menu的makeListData方法，和openSubMenu方法)

于是问题就简单了，只需要在getMenuAt和openSubMenu方法中new Menu的时候给新创建的Menu设置一下document就可以了。重写getMenuAt还比较好做，但是重写openSubMenu就比较麻烦了，它是一个内部的方法，最重要的是没有办法像getMenuAt一样获取到新创建的menu，于是乎又郁闷了。

最后，从iconFunction中找到了答案，在openSubMenu里有一句代码： menu.iconFunction = r.iconFunction;

呵呵，现在，通过简单的重写一下MenuBar就可以得到想要的结果了。

public class MenuBar extends mx.controls.MenuBar
{

public function MenuBar()

{

super();

}

public override function getMenuAt(index:int):Menu

{

var menu:Menu = super.getMenuAt(index);

menu.iconFunction = getMenuIcon;

return menu;

}

private function getMenuIcon(data:Object):Class

{

return super.itemToIcon(data);

}

}

总结一下：

造成这种结果的原因是在sdk MenuBar中的Menu是在动态创建的，无法获取到document，也无法设置iconFunction，所以只要将将document赋予menu就可以使第一级子菜单获得icon，但是二级，三级子菜单还是没有icon，所以就定义一个iconFunction，将MenuBar中ItemToIcon的结果通过这个iconFunction传给子菜单们就可以了，因为MenuBar显然获取了document，可以正确解析定义的icon。

问题：

1、将图片的R,G,B通道分别分离出来，以RGB模式，灰度模式表示

2、将图片以灰度模式表示

demo

source