flex表格样式管理

需求：

我之前做的电子表格和高级数据表格中 有这样的要求，用户可能在电子表格中任意的设置单元格样式（背景色，边框……）。如果每个单元格对象都持有自己的CellStyle，那么100*100的单元格矩阵就会创建10000个CellStyle对象，很可怕。 所以我希望样式是在样式池中，被各个单元格引用的方式。并且对于不用的样式要回收掉。

?

功能：

?????? 1，对表格不使用的样式 及时删除掉

???????2，维护一个样式池， 保证池中样式都是不同的，并且是被引用着的，否则从池中移除

做法：

首先 需要了解下flex的Dictionary类，这个类可以在key上使用弱引用（Dictionary(weakKeys:Boolean = false)）

api描述是：weakKeys指示 Dictionary 对象在对象键上使用“弱”引用。如果对某个对象的唯一引用位于指定的 Dictionary 对象中，则键符合垃圾回收的条件，并且在回收对象时会被从表中删除。?? 使用Dictionary 的key作为样式的池 就可以完成功能1的需要。

代码如下：

自定义样式类

public class CellStyle    {
		
		private static var styleManager:GStyleManager = GStyleManager.initialize();
		
		public static const DEFAULT_STYLE:CellStyle = new CellStyle();
		
		public var stylename:String;
		
		private static function getCellStyle(value:CellStyle):CellStyle{
			var style:CellStyle = styleManager.getCellStyle(value);
			if(style != null){
				return style;
			}
			value.stylename = UIDUtil.createUID();
			styleManager.addStyle(value);
			return value;
		}
		/**
		 * 字体加粗
		 *  @see FontStyleEnum
		 */
		public var fontWeight:String = FontStyleEnum.NORMAL;
		
		/**
		 * 斜体
		 */
		public var fontStyle:String = FontStyleEnum.NORMAL;
		/**
		 * 下划线
		 * @default 
		 */
		public var textDecoration:String = FontStyleEnum.NONE;
		/**
		 * 字体类型
		 * @default 
		 */
		public var fontFamily:String = "simsun";
		
		/**
		 * 字体颜色
		 */
        public var fontColor:String = "#000000";
		
		/**
		 * 字体大小
		 */
		public var fontSize:Number = 12;
//////////////////////文字样式结束///////////////////////////////////////////////////
		
		/**
		 * 上边框类型
		 * @default 
		 */
		public var borderTypeTop:String = CellOp.SOLID;
		/**
		 * 左边框类型
		 * @default 
		 */
		public var borderTypeLeft:String = CellOp.SOLID;
		/**
		 * 右边框类型
		 * @default 
		 */
		public var borderTypeRight:String = CellOp.SOLID;
		/**
		 * 下边框类型
		 * @default 
		 */
		public var borderTypeBottom:String = CellOp.SOLID;
		
		/**
		 * 边框类型
		 * @default 
		 */
		public function set borderType(value:String):void{
			borderTypeTop = value;
			borderTypeLeft = value;
			borderTypeRight = value;
			borderTypeBottom = value;
		}
		
//////////////////////边框类型结束///////////////////////////////////////////////////		
		/**
		 * 上边框粗细
		 */
        public var borderThicknessTop:int = 0;
		/**
		 * 左边框粗细
		 */
        public var borderThicknessLeft:int = 0;
		/**
		 * 右边框粗细
		 */	
        public var borderThicknessRight:int = 0;
		/**
		 * 下边框粗细
		 */
        public var borderThicknessBottom:int = 0;
		
		public function set borderThickness(value:Number):void{
			this.borderThicknessBottom = value;
			this.borderThicknessLeft = value;
			this.borderThicknessRight = value;
			this.borderThicknessTop = value;
			
		}
		
//////////////////////边框粗细结束///////////////////////////////////////////////////		
//		/**
//		 * 上边框透明度
//		 * @default 
//		 */
//		public var borderAlphaTop:Number = 0;
//		/**
//		 * 下边框透明度
//		 * @default 
//		 */
//		public var borderAlphaBottom:Number = 0;
//		/**
//		 * 左边框透明度
//		 * @default 
//		 */
//		public var borderAlphaLeft:Number = 0;
//		/**
//		 * 有边框透明度
//		 * @default 
//		 */
//		public var borderAlphaRight:Number = 0;
		
///////////////////////////边框透明度 结束/////////////////////////////////////////////
     
        /**
         * 格式化 方式
         * @default 
         */
        public var formatString:String = "";
		
		/**
		 * 上边框颜色
		 */
		public var borderColorTop:String = "#000000";
		/**
		 * 右边框颜色
		 * @default 
		 */
		public var borderColorRight:String = "#000000";
		/**
		 * 左边框颜色
		 * @default 
		 */
		public var borderColorLeft:String = "#000000";
		/**
		 * 下边框颜色
		 * @default 
		 */
		public var borderColorBottom:String = "#000000";
		/**
		 * 边框颜色
		 * @param param1
		 */
		public function set borderColor(param1:String) : void
		{
			borderColorTop = param1;
			borderColorBottom = param1;
			borderColorRight = param1;
			borderColorLeft = param1;
			return;
		}
///////////////////////////边框颜色 结束/////////////////////////////////////////////		
		
		
		/** 横向排列 */
		public var horizontalAlign:Number = 0;
		/** 
		 * 纵向排列  
		 */
		public var verticalAlign:Number = 0.5;
///////////////////////////对齐方式 结束/////////////////////////////////////////////			
		
        /**
         * 背景起始色
         * @default 
         */
        public var backColor:String = "";
		
		/**
		 * 透明度
		 */
		public var backAlpha:Number = 0;
		
///////////////////////////背景色 结束/////////////////////////////////////////////			
		
		/**
		 * 右内边距
		 */
		public var padding_right:int = 1;
		
		/**
		 * 上内边距
		 */
		public var padding_top:int = 1;
		
		/**
		 * 下内边距
		 */
        public var padding_bottom:int = 1;
		
		/**
		 * 左内边距
		 */ 
		public var padding_left:int = 1;
/////////////////////内边距 结束//////////////////////////////////////////////		
		
		/**
		 * 是否换行
		 */
		public var textStyle:Boolean = false;
        /**
         * 
         * @param param1
         */
        public function CellStyle(styleName:String = null)
        {
			styleName = UIDUtil.createUID()
        }
        /**
         * 复制样式
         * @param param1
         */
        public function clone(param1:CellStyle) : CellStyle
        {
            this.formatString = param1.formatString;
            this.backColor = param1.backColor;
            this.backAlpha = param1.backAlpha;
            this.borderColorBottom = param1.borderColorBottom;
            this.borderColorLeft = param1.borderColorLeft;
            this.borderColorRight = param1.borderColorRight;
            this.borderColorTop = param1.borderColorTop;
            this.borderThicknessTop = param1.borderThicknessTop;
            this.borderThicknessBottom = param1.borderThicknessBottom;
            this.borderThicknessLeft = param1.borderThicknessLeft;
            this.borderThicknessRight = param1.borderThicknessRight;
//			this.borderAlphaBottom = param1.borderAlphaBottom;
//			this.borderAlphaTop = param1.borderAlphaTop;
//			this.borderAlphaLeft = param1.borderAlphaLeft;
//			this.borderAlphaRight = param1.borderAlphaRight;
			this.borderTypeTop = param1.borderTypeTop;
			this.borderTypeBottom = param1.borderTypeBottom;
			this.borderTypeRight = param1.borderTypeRight;
			this.borderTypeLeft = param1.borderTypeLeft;
            this.padding_bottom = param1.padding_bottom;
            this.padding_left = param1.padding_left;
            this.padding_right = param1.padding_right;
            this.padding_top = param1.padding_top;
            this.fontColor = param1.fontColor;
            this.fontSize = param1.fontSize;
			this.fontWeight = param1.fontWeight;
			this.fontStyle = param1.fontStyle;
			this.textDecoration = param1.textDecoration;
			this.fontFamily = param1.fontFamily;
			this.horizontalAlign = param1.horizontalAlign;
			this.verticalAlign = param1.verticalAlign;
			this.textStyle = param1.textStyle;
			return this;
        }

		public function equals(style:CellStyle):Boolean{
			if(fontWeight == style.fontWeight && fontStyle == style.fontStyle && textDecoration == style.textDecoration
				&& fontFamily == style.fontFamily && fontColor == style.fontColor && fontSize == style.fontSize
				&& borderTypeBottom == style.borderTypeBottom && borderTypeTop == style.borderTypeTop
				&& borderTypeLeft == style.borderTypeLeft && borderTypeRight == style.borderTypeRight 
				&& borderThicknessBottom == style.borderThicknessBottom && borderThicknessLeft == style.borderThicknessLeft
				&& borderThicknessRight == style.borderThicknessRight && borderThicknessTop == style.borderThicknessTop
				&& formatString == style.formatString && borderColorBottom == style.borderColorBottom && borderColorLeft == style.borderColorLeft
				&& borderColorRight == style.borderColorRight && borderColorTop == style.borderColorTop
				&& horizontalAlign == style.horizontalAlign && verticalAlign == style.verticalAlign 
				&& backColor == style.backColor && backAlpha == style.backAlpha 
				&& padding_bottom == style.padding_bottom && padding_left == style.padding_left
				&& padding_right == style.padding_right && padding_top == style.padding_top 
				&& textStyle == style.textStyle){
				return true;
			}
			return false;
		}
				
		public function setProperty(name:String,value:*):CellStyle{
			var cellStyle:CellStyle = new CellStyle();
			cellStyle.clone(this);
			cellStyle[name] = value;
			return getCellStyle(cellStyle);
		}
    }
}

对样式的修改需要调用setProperty方法 而不是直接修改属性，setProperty方法会在修改表样式的时候判断池中是否存在这样的样式，存在就返回，不存在创建一个放在池中在返回。??? 这样就解决了功能2的需要

?

?样式管理类

public class GStyleManager
	{
		private var gridCellStyle:Dictionary;
		
		private static var gstyleManager:GStyleManager;
		private const styleCach:Array = new Array();
		/**
		 * 记录单元格需要填充的样式map
		 */
		private var fillMap:Dictionary = new Dictionary();
		
		function GStyleManager()
		{
			//初始化表格的默认样式
			gridCellStyle = new Dictionary(true);
		}
		
		/**
		 * 初始化GStyleManager对象
		 */
		public static function initialize():GStyleManager{
			if(!gstyleManager){
				gstyleManager = new GStyleManager();
			}
			return gstyleManager;
		}
		
		/**
		 * 通过样式名，取得对应的样式对象，
		 *  如果没有指定样式，可以指定返回默认样式。
		 * @param name:String 样式名称
		 * @param useDefault:Boolean 如果没有name对应的样式，是否返回默认样式
		 * @return 样式对象CellStyle
		 */
		public function getStyleByName(name:String,useDefault:Boolean = true) : CellStyle
		{
			for(var k:* in gridCellStyle){
				var styleName:String = gridCellStyle[k] as String;
				if(name == styleName){
					return k as CellStyle;
				}
			}
			if(useDefault){
				return CellStyle.DEFAULT_STYLE;
			}
			return null;
		}
						
		/**
		 * 添加style
		 */
		public function addStyle(style:CellStyle):void{
			if(style != null){
				gridCellStyle[style] = style.stylename;
			}
		}
				
		/**
		 * 是否存在该样式
		 */
		private function hasStyle(styleName:String):Boolean{
			var cellStyle:CellStyle = gridCellStyle[styleName] as CellStyle;;
			if(cellStyle != null){
				return true;
			}
			return false;
		} 
				
		public function getCellStyle(style:CellStyle):CellStyle{
			var cellStyle:CellStyle = null;
			for(var cs:* in gridCellStyle){
				cellStyle = CellStyle(cs);
				if(cellStyle.equals(style)){
					return cellStyle;
				}
			}
			return null;
		}
				
		public function addFillMap(styleName:String,cell:Cell):void{
			var cells:Vector.<Cell> = fillMap[styleName];
			if(cells == null){
				cells = new Vector.<Cell>;
				fillMap[styleName] = cells;
			}
			cells.push(cell);
		}			
	}

6个单元格设置了背景色 但又2个是相同的，因此池中维护4个而不是6个?? ：）