Na primeira coluna do seu datagrid você coloca um header renderer e um
componente com uma imagem dentro, eu uso uma imagem em V indicando check
(https://www.google.com.br/search?q=check&es_sm=93&source=lnms&tbm=isch&sa=X&ei=AibaU-zkOo-gyATNjYGgDw&ved=0CAgQ_AUoAQ&biw=1511&bih=725&dpr=0.9).
Coloca o sortable da coluna false. Coloca no click da imagem pra chamar a
função que irá selecionar os checkboxes. Depois do headerRenderer, coloca o
item Renderer com a chamada para o seu componente checkbox.
(Id do datagrid: _dgCargasAlocadas)
<mx:DataGridColumn width="3" sortable="false">
<mx:headerRenderer>
<fx:Component>
<mx:Image buttonMode="true"
click="outerDocument.handlerCkbMarcarTodosAlocadas(event);"
toolTip="Marcar/desmarcar todos"
source="@Embed(source='Estilos/images/check_20x20_2.png')" width="6"
height="4" verticalAlign="middle" horizontalAlign="center"/>
</fx:Component>
</mx:headerRenderer>
<mx:itemRenderer>
<fx:Component>
<Renderer:RendererCheckBox/>
</fx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
Componente checkbox:
Crie uma classe extendendo checkbox (comentários no código):
package Interfaces.Faturamento.MontagemDeCarga.Renderer
{
import flash.display.DisplayObject;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.text.TextField;
import mx.controls.CheckBox;
import mx.controls.DataGrid;
import mx.controls.listClasses.BaseListData;
import mx.controls.listClasses.IDropInListItemRenderer;
import mx.core.Application;
import mx.events.CollectionEvent;
import mx.events.FlexEvent;
/*
* Extende checkbox
*/
public class RendererCheckBox extends CheckBox
{
private var _listData:BaseListData
private var _dataGrid:DataGrid;
public function RendererCheckBox(){
super();
this.addEventListener(FlexEvent.CREATION_COMPLETE, init);
}
/*
* Sobrescreva a função updateDisplayList dessa forma:
*/
override protected function updateDisplayList(w:Number, h:Number):void{
super.updateDisplayList(w, h);
var n:int = numChildren;
for (var i:int = 0; i < n; i++){
var c:DisplayObject = getChildAt(i);
if (!(c is TextField)){
c.x = (w - c.width) / 2;
c.y = 3;
}
}
}
//ADICIONA LISTENERS DE EVENTOS CLICK E CHANGE
private function init(evt:FlexEvent):void{
this.addEventListener(MouseEvent.CLICK, isSelected);
this.addEventListener(Event.CHANGE, onChange);
this.toolTip = "Marcar/desmarcar linha";
this.buttonMode = true;
}
/* --------------
GETS E SETS
-------------- */
[Bindable("dataChange")]
public function get __listData():BaseListData{
return _listData;
}
public function set __listData( value:BaseListData ):void{
_listData = value;
}
/*SOBRESCREVENDO O ATRIBUTO DATA,
POR CAUSA DO CACHE QUE O FLEX FAZ EM RELAÇÃO
AO DATAGRID E O ITEMRENDERER */
override public function set data(value:Object):void{
super.data = value;
this.selected = value['isSelected'];
}
private function onChange( event:Event ):void{
data['isSelected'] = this.selected;
/* ESSA LINHA PODERIA FICAR MAIS GENÉRICA PARA
PODER SER UTILIZADO EM QUALQUER COMPONENTE, MAS AQUI ESTÁ SENDO USADO
APENAS PARA ESTE DATAGRID*/
parentDocument._dgCargasAlocadas.dispatchEvent(new
CollectionEvent(CollectionEvent.COLLECTION_CHANGE));
}
private function isSelected(event:MouseEvent):void
{
/*ATRIBUINDO O VALOR AO METODO SET CRIADO NO COMPONENTE PAI,
PASSANDO EVENTO TODO PARA SER MANUPULADO PELO PAI
(APENAS PREENCHE UM ARRAYCOLLECTION COM OS ÍTENS SELECIONADOS)*/
parentDocument.linhasSelecionadasCarga(event);
}
}
}
Na classe pai, escreva o método handlerCkbMarcarTodosAlocadas (chamado pela
imagem do headerRenderer)
na declaração das variáveis:
private var flgSelecionouTodosAlocadas:Boolean = false;
public function handlerCkbMarcarTodosAlocadas(evt:MouseEvent):void{
if(!flgSelecionouTodosAlocadas){
/*
* Percorre o datagrid selecionando as linhas e chamando a função de seleção
única
*/
for (var i:int = 0; i<_dgCargasAlocadas.dataProvider.length; i++){
_dgCargasAlocadas.dataProvider[i].isSelected = true;
_dgCargasAlocadas.selectedItem = _dgCargasAlocadas.dataProvider[i];
linhasSelecionadasCarga(evt);
}
flgSelecionouTodosAlocadas = true;
}
else{
for (var x:int = 0; x<_dgCargasAlocadas.dataProvider.length; x++){
_dgCargasAlocadas.dataProvider[x].isSelected = false;
_dgCargasAlocadas.selectedItem = _dgCargasAlocadas.dataProvider[x];
linhasSelecionadasCarga(evt);
}
flgSelecionouTodosAlocadas = false;
}
}
Por fim, a função de seleção única (chamada pelo item renderer checkBox das
linhas):
na declaração das variáveis:
private var CargasSelecionadas:ArrayCollection = new ArrayCollection();
public function linhasSelecionadasCarga(evt:Event):void{
if(_dgCargasAlocadas.selectedItem.isSelected){
CargasSelecionadas.addItem(_dgCargasAlocadas.selectedItem);
}
else{
for(var i:int = 0; i<CargasSelecionadas.length; i++){
if(CargasSelecionadas[i].PLACA == _dgCargasAlocadas.selectedItem.PLACA){
CargasSelecionadas.removeItemAt(i);
}
}
}
}
Então ao final do processo você tem na sua aplicação um arraycollection com
todos os itens que foram selecionados.
Em sábado, 26 de julho de 2014 19h42min41s UTC-3, Robinho de Morais
escreveu:
>
> Boa noite pessoal, como faço para quando ao clicar no header do datagrid
> da coluna que tenho o checkbox ele ir percorrendo e selecionando ?
>
> Qual o metodo que uso para selecionar isso no datagrid ?
>
--
--
Você recebeu esta mensagem porque está inscrito na lista "flexdev"
Para enviar uma mensagem, envie um e-mail para flexdev@googlegroups.com
Para sair da lista, envie um email em branco para
flexdev-unsubscr...@googlegroups.com
Mais opções estão disponíveis em http://groups.google.com/group/flexdev
---
Você está recebendo esta mensagem porque se inscreveu no grupo "flexdev" dos
Grupos do Google.
Para cancelar inscrição nesse grupo e parar de receber e-mails dele, envie um
e-mail para flexdev+unsubscr...@googlegroups.com.
Para obter mais opções, acesse https://groups.google.com/d/optout.
