Flex中的Localelization – MXML/ActionScript

Categories: Flex; Tagged with: ; @ February 19th, 2009 10:02

使用MXML 或 ActionScript 均可进行Localelization,

但是在使用ActionScript载入resource, 不可在runtime通过ResourceManager.getInstance().localeChain来更改显示语言

而在MXML中, 会自动进行Binding, 可以通过ResourceManager在runtime修改显示语言

在ActionScript 中使用HashMap – Use HashMap in ActionScript

Categories: Flex; Tagged with: ; @ January 10th, 2009 10:58

HashMap:

HashMap的key必须为String类型, 如果要使用任意类型的key, 应选择使用Dictionay而非HashMap

主要操作如下:

	private function init():void {
		//新建对象
		var obj:Object = new Object();

		//增加key-value
		obj["name"] = "liguoliang";  //格式: Object[key] = value
		obj["age"] = 25; 			 //注意: key必须为String, value可以为任意类型

		//使用for..in...遍历所有的key - value
		for(var k:String in obj) {
			trace("Key: " + k + " - value: " + obj[k]);
		}

		//使用for each..in遍历HashMap
		for each( var v:* in obj) {
			trace("value: " + v);
		}
		
		//删除一个key-value
		delete obj["age"];
		
		//使用for..in...遍历所有的key - value
		for(var k:String in obj) {
			trace("Key: " + k + " - value: " + obj[k]);
		}
	}

输出结果如下:

Key: name – value: liguoliang

Key: age – value: 25

value: liguoliang

value: 25

Key: name – value: liguoliang

使用ActionScript建立DataGrid, 添加右键, 增加列, 并设定列的ItemRenderer

Categories: Flex; Tagged with: ; @ January 6th, 2009 0:59

很多时候为了获得对组件的灵活控制, 不得不放弃MXML, 直接使用ActionScript.

 
//新建一个DataGrid _dataGrid = new DataGrid(); 
//增加右键 
var menu:NativeMenu = new NativeMenu(); 
var menuItemDelete:NativeMenuItem = new NativeMenuItem("Delete"); 
//监听事件,在右键选定Delete时运行该函数
 menuItemDelete.addEventListener(Event.SELECT, onMenuDeleteClicked); 
//将该menuItem加入到Menu中 
menu.addItem(menuItemDelete);
 _dataGrid.contextMenu = menu; //将菜单加入到DataGrid中 

columnLocale = new DataGridColumn(); //新建一个列 
columnLocale.dataField ="locale";//设定DataGrid中locale列的EditItem;
comboBoxLocaleEditor = new ClassFactory(ComboBox); // D
comboBoxLocaleEditor.properties = {dataProvider : LocalizationItem.localeArray} //设定该EditorItem的属性 
columnLocale.itemEditor = comboBoxLocaleEditor; 

var columnGender:DataGridColumn = new DataGridColumn();
 columnGender.headerText = "Gender""; 
columnGender.dataField = "Gender_"; 
//使用ItemRender 
columnGender.itemRenderer = new ClassFactory(Gender_Label);
 _dataGrid.showHeaders = false; //隐藏DataGrid的Header 
_dataGrid.columns = [columnLocale, columnGender]; //这一个数组,存放DataGrid的Column 

_dataGrid.dataProvider = value; //设定dataProvider 

具体在实际中的使用, 无异于MXML.

使用ItemRenderer处理基于List容器的显示内容 [DataGrid, Tree, List等]

Categories: Flex; Tagged with: ; @ January 6th, 2009 0:52

具体的情况如:使用labelFunction处理DataGrid显示内容 , 只是这里使用的是ItemRender来实现并实现更多功能.

如Student中有一Gender_属性, 1表示男生, 2表示女生, 3表示未知, 现在有下要求:

1. 在DataGrid中不可以显示1, 2,3, 应显示 男女 [ 该功能可由LabelFunction实现],

2. 如果为男生,, 则”男生”颜色为红色, 女生颜色为默认, 未知字体大小为10号

具体实现:

			var columnGender:DataGridColumn = new DataGridColumn();
			columnGender.headerText = "Gender";
			columnGender.dataField = "Gender_"; //使用ItemRender
			columnGender.itemRenderer =  new ClassFactory(Gender_Label);
			//columnGender.labelFunction = formatGender;

			_dataGridStudent.columns = [columnID, columnName, columnAge, columnGender];

ItemRender实现: 该类将继承List, 重写其UpdateDisplayList函数, 如下:

package com.test.itemRender
{
import mx.controls.Label;
import mx.controls.listClasses.ListBase;

public class Gender_Label extends Label
{
	/**
	 * 构造函数
	 */
	public function Gender_Label() {
		super();
	}

	override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void {
		super.updateDisplayList(unscaledWidth, unscaledHeight);
		if(data.Gender_ == 1) {
             setStyle('fontSize',14);
             setStyle('fontWeight', 'bold');
             setStyle('color', 0xDD0000);
             this.text = "男生";
		 }else if(data.Gender_ == 2) {
		 	setStyle('fontSize',14);
		 	this.text = "女生"
		 }
		 //otherwise, return the label to its regular state
		 else {
		     setStyle('fontSize', 10);
             this.text = "未知";
		 }
	}

}// end of class
}// end of package

最终效果:

image

使用labelFunction处理DataGrid显示内容

Categories: Flex; Tagged with: ; @ January 5th, 2009 17:31

在设定了DataGrid的DataProvider, 设定DataGridColumn及其相应的DataField之后, DataGrid就可正常显示, 但有时候需要稍微处理一下显示内容: 如 某ArrayCollection中含有一组Student, Student对象具有gender属性, 其中1代表男, 2代表女, 3代表不确定. 此时需要使用labelFunction进行处理显示内容.

image image

原理:

DataGrid通过DataGridColum函数中的itemToLabel实现数据源到现实内容的过程,

当DataGrid 某列的labelFunction不为空时, DataGridColumn的itemToLabel函数将执行:

if (labelFunction != null)
return labelFunction(data, this);

具体可参见类DataGridColumn的itemToLabel函数.

使用方法:

var columnGender:DataGridColumn = new DataGridColumn();  //增加一个Column
			columnGender.headerText = "Gender";
			columnGender.dataField = "Gender_";
			columnGender.labelFunction = formatGender;  //设定LabelFunction

			_dataGridStudent.columns = [columnID, columnName, columnAge, columnGender];  //将Column加入到DG中.总共四个Column

labelFunction函数

	/** 设定DataGrid 性别栏显示内容*/
	 private function formatGender(item:Object, c:DataGridColumn):String {
	 	var gender:String;
	 	if(item.Gender_ == 1) {
	 		gender = "男";
	 	}else if(item.Gender_ == 2) {
	 		gender = "女";
	 	}else {
	 		gender = "未知";
	 	}
	 	return gender;
	 }

Newer Posts <-> Older Posts



// Proudly powered by Apache, PHP, MySQL, WordPress, Bootstrap, etc,.