`
nickkathy
  • 浏览: 34717 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

Flex checkbox

    博客分类:
  • flex
阅读更多
<!--header-->
<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%" horizontalAlign="center" preinitialize="init()" implements="mx.core.IFactory">
<mx:Script>
<![CDATA[
import common.checkbox.events.SimpleHeaderClickEvent;
import mx.controls.DataGrid;
import mx.binding.utils.BindingUtils;

//will be set by "properties" property of ClassFactory
//allows us to bind to an external value while remaining decoupled
public var externalObject:*;
public var externalPropertyName:String;
public var dataGridObject:DataGrid;

//local property that will be bound to external value held in externalObject[externalPropertyName]
//CheckBox's selected property in turn bound to this
[Bindable]
public var isSelected:Boolean = false;

//method required by IFactory
public function newInstance():*{
return new GenericCheckBoxHeaderRenderer();
}

//set up binding of local property to value specified by ClassFactory::properties
private function init():void{
BindingUtils.bindProperty(this,"isSelected",externalObject,externalPropertyName);

this.parentApplication.addEventListener(SimpleHeaderClickEvent.EXT_CLICK,function(event:SimpleHeaderClickEvent):void{
event.cb = t_cb;
event.itemObjectList = dataGridObject.dataProvider;
event.cb.selected = event.allSelected;
onClick(new MouseEvent(MouseEvent.CLICK));
});
}

//local click handler that dispatches the event
//so it can be handled in a  more appropriate place (such as the document holding the DataGrid)
public function onClick(event:MouseEvent):void{
var evt:SimpleHeaderClickEvent = new SimpleHeaderClickEvent(SimpleHeaderClickEvent.CLICK,
t_cb,dataGridObject.dataProvider);
onHeaderClick(evt);

// 将checkbox状态改变的事件通知出去
dispatchEvent(evt);
}

//单击DataGridHeader事件
private function onHeaderClick(event:SimpleHeaderClickEvent):void{
//更新属性
isSelected = externalObject.allSelected = event.cb.selected;
var theData:* = dataGridObject.dataProvider;

if(theData != null){
for each(var resultObj:* in theData){
resultObj.isSelected = isSelected;
}
theData.refresh();
}
}
]]>
</mx:Script>
<mx:CheckBox id="t_cb" click="onClick(event)" selected="{isSelected}" width="15"/>
</mx:HBox>

<!--Item -->
<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%" horizontalAlign="center"
implements="mx.core.IFactory" preinitialize="init()">
<mx:Script>
<![CDATA[
import common.checkbox.events.SimpleItemClickEvent;
import mx.controls.DataGrid;
import mx.charts.renderers.BoxItemRenderer;
import mx.controls.dataGridClasses.DataGridColumn;

/**
* 该checkbox的惟一标识的名字
*/
public var dnField:*;

//name of property on our VO we're concerned with
public var dataField:String;

// DataGrid
public var dataGridObject:DataGrid;

//method required by IFactory
public function newInstance():*{
return new GenericCheckBoxItemRenderer();
}

private function init():void{
// 监视外部命令
this.parentApplication.addEventListener(SimpleItemClickEvent.EXT_CLICK,function(event:SimpleItemClickEvent):void{
var dn:* = data[dnField];
if(dn != null && dn == event.dn){
// event.stopImmediatePropagation();
t_cb.selected = true;
onClick(new MouseEvent(MouseEvent.CLICK));
}
});
}

//this override is essential for preventing random (un)checking when your DataGrid is scrolled
override public function set data(value:Object):void{
//not sure of the details on when or why, but sometimes this method is passed a null value
if(value != null) {
super.data = value;
//the parent DataGridColumn is passed as value before the real data arrives
if(!(value is DataGridColumn)){
//set itemRenderer's state based on the value held in the property specified by _dataField
t_cb.selected = value[dataField];
}

var evt:SimpleItemClickEvent = new SimpleItemClickEvent(SimpleItemClickEvent.DATA_INIT,super.data,dataField,t_cb);

// 将checkbox状态初始化的事件通知出去
dispatchEvent(evt);
}
}

//local click handler that dispatches the event
//so it can be handled in a  more appropriate place (such as the document holding the DataGrid)
private function onClick(event:MouseEvent):void{
//attach our VO and _dataField onto the event so that it can be manipulated in the handler
//wherever that handler may be
var evt:SimpleItemClickEvent = new SimpleItemClickEvent(SimpleItemClickEvent.CLICK,super.data,dataField);
super.data[dataField] = t_cb.selected;

// 将checkbox状态改变的事件通知出去
dispatchEvent(evt);
}

//捕获单击DataGrid's itemRenderer中的CheckBox事件
/*private function onItemClick(event:SimpleItemClickEvent):void{
//创建当前点击的GenericCheckBoxItemRenderer对象
var ir:GenericCheckBoxItemRenderer = event.target as GenericCheckBoxItemRenderer;
var cb:CheckBox = ir.t_cb as CheckBox;

//更新对象属性值成CheckBox选择装态
event.itemObject[event.itemPropName] = cb.selected;

if(callbackFun != null){
callbackFun(event);
}
}*/
]]>
</mx:Script>
<mx:CheckBox id="t_cb" click="onClick(event)" width="15"/>
</mx:HBox>

<!--headerEvent -->
package common.checkbox.events
{
import flash.events.Event;

import mx.controls.CheckBox;

//simple event that can hold a Person and a property name
public class SimpleHeaderClickEvent extends Event
{
public static var CLICK:String = "checkBoxHeaderClick";
public static var EXT_CLICK:String = "checkExtBoxHeaderClick";

// Checkbox对象
public var cb:CheckBox;

// 数据源
public var itemObjectList:*;

//Select
public var allSelected:Boolean;

public function SimpleHeaderClickEvent(type:String, cb:CheckBox, itemObjectList:*){
super(type,true,true);
this.cb = cb;
this.itemObjectList = itemObjectList;
}
}
}

<!--ItemEvent -->
package common.checkbox.events
{
import flash.events.Event;

import mx.controls.CheckBox;

//simple event that can hold a Person and a property name
public class SimpleHeaderClickEvent extends Event
{
public static var CLICK:String = "checkBoxHeaderClick";
public static var EXT_CLICK:String = "checkExtBoxHeaderClick";

// Checkbox对象
public var cb:CheckBox;

// 数据源
public var itemObjectList:*;

//Select
public var allSelected:Boolean;

public function SimpleHeaderClickEvent(type:String, cb:CheckBox, itemObjectList:*){
super(type,true,true);
this.cb = cb;
this.itemObjectList = itemObjectList;
}
}
}
分享到:
评论

相关推荐

    flex checkbox选中

    flex checkbox选中,自定义选中状态的数据。

    flex checkboxtree复选树形下拉框

    在Flex开发中,"flex checkboxtree复选树形下拉框"是一种常见的用户界面组件,它结合了树形结构和复选框的功能,允许用户在层次结构中进行多选操作。这种组件通常用于数据筛选、配置设置或者层级分类的选择场景。在...

    flex带复选框的tree,flex checkboxtree

    在Flex中,Tree组件是用于显示层次结构数据的控件,而"flex带复选框的tree"(Flex CheckboxTree)则是对Tree组件的一种扩展,增加了复选框功能,用户可以对树形结构的节点进行选择或全选操作,常用于权限管理、配置...

    flex checkboxtree 和可增加面板,可关闭的tab页

    `CheckboxTree`和可添加/关闭的`TabPanel`是Flex中常见的组件,用于提供用户友好的交互界面。这篇博客文章《flex checkboxtree 和可增加面板,可关闭的tab页》可能详细讲解了如何在Flex应用中实现这两个功能。 `...

    flex动态生成checkbox

    flex动态生成checkbox,方便多项选择维护更新

    Flex Checkbox Tree

    【Flex Checkbox Tree】是一种在Adobe Flex开发环境中实现的交互式组件,它将树形结构的数据与复选框相结合,提供了一种用户友好的方式来选择或取消选择树节点。这个组件通常用于数据筛选、配置设置或者层级关系的...

    flex checkbox tree

    Flex Tree组件是一个常用的UI元素,用于展示层级数据,而“flex checkbox tree”则是对Flex Tree的一种扩展,它增加了复选框功能,使得用户可以方便地选择树形结构中的各个节点。本文将详细介绍如何创建一个带复选框...

    FLEX中可换行CHECKBOX

    FLEX中可换行CHECKBOX

    Flex带CheckBox的多选下拉框

    Flex带CheckBox的多选下拉框 Flex带CheckBox的多选下拉框 Flex带CheckBox的多选下拉框 Flex带CheckBox的多选下拉框 Flex带CheckBox的多选下拉框 Flex带CheckBox的多选下拉框

    Flex Tree 中Checkbox

    在“Flex Tree 中Checkbox”的场景下,我们主要讨论如何在Flex Tree组件中集成Checkbox,以及如何通过Checkbox来获取用户的选中状态。 1. **Flex Tree组件**:Flex Tree是MXML和ActionScript中的一个控件,用于显示...

    Flex动态生成checkbox组

    在Flex编程中,动态生成组件是一项常见的需求,特别是在创建用户界面时,可能需要根据后端数据自动生成元素,如复选框(Checkbox)组。"Flex动态生成checkbox组"这个主题,就是关于如何在Flex应用中利用代码动态创建...

    flex Datagrid checkbox全选

    在Flex开发中,Datagrid是一种常用的组件,用于展示表格数据,而checkbox全选功能则是提高用户体验的一个重要特性。本文将详细讲解如何实现Flex Datagrid中checkbox的全选功能。 首先,我们要了解Flex Datagrid的...

    flex combox和checkbox总结

    ### Flex ComboBox 和 CheckBox 的使用详解 #### 一、Flex ComboBox 的使用 在 Flex 开发中,`ComboBox` 控件是一个非常实用的控件,它结合了文本框与下拉列表的功能,用户可以在文本框中输入内容,也可以通过下拉...

    Flex Datagrid checkbox实现

    在标题“Flex Datagrid checkbox实现”中,讨论的核心是Datagrid中集成复选框(checkbox)的功能。 在Flex Datagrid中实现复选框功能,主要是通过添加一个自定义的列renderer来完成。Renderer是Datagrid中的一个小...

    flex4 list全选,反选

    在Flex4中,List组件是用于展示数据列表的常用组件,它可以显示一组可滚动的数据项。在实际应用中,我们经常需要实现对列表中的所有项进行全选或反选的操作,以便用户能快速选择或取消选择全部内容。本文将详细探讨...

    flex tree+checkbox级联勾选

    "Flex Tree + Checkbox级联勾选"是一个重要的功能点,通常出现在数据管理、配置界面或文件管理系统中,允许用户进行批量选择或级联操作。 首先,我们来详细了解一下Flex Tree。Flex Tree是基于Adobe Flex技术的一种...

    Flex DataGrid CheckBox 一个简单的全选

    在Flex的DataGrid中,我们可以为每一行添加CheckBox,这样用户就可以通过点击CheckBox来选择或取消选择特定的行。这在需要多选操作的场景中非常实用,比如用户需要批量处理某些数据。 二、设置CheckBox的默认状态 ...

    flex ComboBox checkbox

    这个“flex ComboBox checkbox”的主题涉及到在ComboBox中集成复选框(checkbox)的功能,这使得用户可以选择多个选项,而不仅仅是单选。下面我们将详细探讨这个主题,包括ComboBox的基本概念、如何添加复选框以及...

    flex中批量生成checkbox

    flex中checkbox的数量可以根据分割字符串来控制,最重要的就是这个标签了

    Flex4 带checkbox的DataGrid

    其中包含一个三种状态的checkbox,DataGrid代码中引用了 带多选框的DataGrid(AdvancedDataGrid) 表头有全选CheckBox,三种状态:全选、部分选择、无选择 如果改变目录结构,需要在CustomCheckBox.mxml中更改inner....

Global site tag (gtag.js) - Google Analytics