package com.components.checkBoxList
{
import flash.events.Event;
import mx.collections.ArrayCollection;
import mx.collections.ICollectionView;
import mx.collections.IList;
import mx.collections.ListCollectionView;
import mx.collections.XMLListCollection;
import mx.containers.Tile;
import mx.controls.CheckBox;
import mx.controls.Alert;
import mx.core.IUIComponent;
public class CheckBoxList extends Tile
{
protected var collection:ICollectionView; //显示的数据源
private var _labelField:String = "label"; //显示的数据字段
private var _dataField : String = "selected"; //选中的状态
private var _selectedName : String = ""; //设置选中的值
private var _splitString : String = "、"; //设置选中值的分割符
private var _checkBoxNum:Number = 10; //设置显示的复选框个数
private var cellWidth:Number;
private var cellHeight:Number;
public function CheckBoxList()
{
super();
}
//数据源
[Bindable("collectionChanged")]
public function get dataProvider():Object
{
return collection;
}
public function set dataProvider(value:Object):void
{
if (value is Array)
{
collection = new ArrayCollection(value as Array);
}
else if (value is ICollectionView)
{
collection = ICollectionView(value);
}
else if (value is IList)
{
collection = new ListCollectionView(IList(value));
}
else if (value is XMLList)
{
collection = new XMLListCollection(value as XMLList);
}
else
{
// convert it to an array containing this one item
var tmp:Array = [value];
collection = new ArrayCollection(tmp);
}
dispatchEvent(new Event("collectionChanged"));
addOrResetChildren();
}
//显示字段
[Bindable("labelFieldChanged")]
public function get labelField():String
{
return _labelField;
}
public function set labelField(value:String):void
{
_labelField = value;
dispatchEvent(new Event("labelFieldChanged"));
}
//设定选中的状态
[Bindable("dataFieldChanged")]
public function get dataField() : String
{
return _dataField;
}
public function set dataField(value : String) : void
{
_dataField = value;
dispatchEvent(new Event("dataFieldChanged"));
}
//设定选中的值
[Bindable("selectedNameChanged")]
public function get selectedName() : String
{
var value : String = "";
var splitStr:String = "";
for each (var obj : Object in this.getChildren())
{
if(obj[dataField] == true)
{
value += splitStr + obj[labelField] ;
splitStr = _splitString;
}
}
return value;
}
public function set selectedName(value:String) : void
{
if(value != null && value != "")
{
var selectedNames:Array = value.split(this.splitString);
for each(var label:String in selectedNames)
{
for each(var object:Object in this.getChildren())
{
if(object[labelField] == label)
{
object[dataField] = "selected";
}
}
}
}
dispatchEvent(new Event("selectedNameChanged"));
}
//显示的复选框个数
[Bindable("checkBoxNumChanged")]
public function get checkBoxNum():Number
{
return this._checkBoxNum;
}
public function set checkBoxNum(value : Number):void
{
this._checkBoxNum = value;
dispatchEvent(new Event("checkBoxNumChanged"));
}
//设定分割符
[Bindable("splitStringChanged")]
public function get splitString() : String
{
return _splitString;
}
public function set splitString(value : String) : void
{
_splitString = value;
dispatchEvent(new Event("splitStringChanged"));
}
//新增或重置子列表
public function addOrResetChildren() : void
{
this.removeAllChildren();
if(collection == null) return;
for (var i : int =0; i < collection.length; i++)
{
var cb : CheckBox = new CheckBox();
cb.id = collection[i].id;
cb.selected= collection[i][dataField]=="true" ? true : false;
cb.label = collection[i][labelField];
cb.setStyle("color","#333333");
cb.setStyle("textRollOverColor","#333333");
cb.setStyle("textSelectedColor","#333333");
cb.setStyle("fontSize","12");
cb.setStyle("fontFamily","宋体");
addChild(cb);
}
}
//拿到当前选中的checkBox的Id
public function getSelectedIds() : Array
{
var arr : Array = new Array();
for each (var obj : Object in this.getChildren())
{
if(obj.selected == true)
{
arr.push(obj.id);
}
}
return arr;
}
//显示格式
protected override function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
{
super.updateDisplayList(unscaledWidth,unscaledHeight);
findCellSize();
if(numChildren<=0) return ;
var horizontalGap:Number = getStyle("horizontalGap");
var verticalGap:Number = getStyle("verticalGap");
this.width = cellWidth + 20; //只显示一列,如果dataProvider的length大于显示的checkBox数量会出现滚动条,这里预留出滚动条的宽度20象素
this.height = (cellHeight + verticalGap) * _checkBoxNum;
// var num : Number = Math.floor(width / (cellWidth + horizontalGap) );
// height = Math.ceil((cellHeight + verticalGap) * Math.ceil(numChildren/num));
}
private function findCellSize():void
{
// If user explicitly supplied both a tileWidth and
// a tileHeight, then use those values.
var widthSpecified:Boolean = !isNaN(tileWidth);
var heightSpecified:Boolean = !isNaN(tileHeight);
if (widthSpecified && heightSpecified)
{
cellWidth = tileWidth;
cellHeight = tileHeight;
return;
}
// Reset the max child width and height
var maxChildWidth:Number = 0;
var maxChildHeight:Number = 0;
// Loop over the children to find the max child width and height.
var n:int = numChildren;
for (var i:int = 0; i < n; i++)
{
var child:IUIComponent = IUIComponent(getChildAt(i));
if (!child.includeInLayout)
{
continue;
}
var width:Number = child.getExplicitOrMeasuredWidth();
if (width > maxChildWidth)
{
maxChildWidth = width;
}
var height:Number = child.getExplicitOrMeasuredHeight();
if (height > maxChildHeight)
{
maxChildHeight = height;
}
}
// If user explicitly specified either width or height, use the
// user-supplied value instead of the one we computed.
cellWidth = widthSpecified ? tileWidth : maxChildWidth;
cellHeight = heightSpecified ? tileHeight : maxChildHeight;
}
}
}
分享到:
相关推荐
Flex带CheckBox的多选 列表和表格 Flex带CheckBox的多选 列表和表格 Flex带CheckBox的多选 列表和表格 Flex带CheckBox的多选 列表和表格
此组件是基于flex4的List 自定义了全选,反选功能
NULL 博文链接:https://puzhijun.iteye.com/blog/1290156
Button、CheckBox、ColorPicker、DataGrid、DateField、HSlider、HorizontalList、Image、LinkButton Label、List MumericStepper、PopUpButton、ProgressBar、RadioButton、RichTextEditor、Text、TextArea、...
在FLEX中使用样式方法 2 一 .使用本地样式定义 2 二、使用外部样式表 3 三、使用内联样式 4 四、使用setStyle()方法 4 五、脚本方法 4 Application组件样式属性 5 panel组件样式属性 5 color文本颜色 6 TabNavigator...
Button | ButtonBar | TabBar | ToggleButton | CheckBox | RadioButton | Scroller | HScrollBar VScrollBar | HSlider | VSlider | DropDownList | TextArea | TextInput | ComboBox | List NumericStepper | ...
在FLEX中使用样式方法 2 一 .使用本地样式定义 2 二、使用外部样式表 3 三、使用内联样式 4 四、使用setStyle()方法 4 五、脚本方法 4 Application组件样式属性 5 panel组件样式属性 5 color文本颜色 6 TabNavigator...
CheckBox control . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 113 DateChooser. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ...
active的三种写法代替radio和checkbox *, ul, li { margin: 0; padding: 0; list-style: none; } div { width: 400px; margin: auto; } ul { display: flex; justify-content:...
- ADD Added checkbox "Keep connector's link" in flex-document property form. - FIX Remaks panel focusing on main form (via PostMessage), since TreeInspector in FlexEditSE captures focus on self. - ...
1.鼠标移入移出切换 <!...<... ... li {list-style: none;} .wrapper { margin: 0 auto; width: 100%; max-width: 1140px; } .tabbox { margin: 40px auto; width: 400px; height: 200px
<END><br>5 , vbo_checkcombo.zip Add a checkbox to a combo box and use it to enabled/disable the combo! or whatever you would like to do with it! <END><br>6 , vbo_controlframe.zip Create your ...
如何判断ArrayList,Hashtable,SortedList 这类对象是否相等 帮助解决网页和JS文件中的中文编码问题的小工具 慎用const关键字 装箱,拆箱以及反射 动态调用对象的属性和方法——性能和灵活性兼备的方法 消除由try/...