...
Quando
...
usar
...
...
...
...
...
...
...
...
...
...
...
...
...
...
...
...
...
...
...
...
...
...
...
...
...
...
...
...
...
...
...
...
...
Estrutura
Janela popup modal composta da estrutura a seguir.
- Cabeçalho:
- Mecanismo de visualização dos critérios já aplicados,
- Mecanismo Abertura e fechamento de todos os grupos de critérios
- Busca de critérios por palavra-chave para janelas com muitos critérios (opcional)
- Conteúdo:
- Grupos e Formulários de critérios a filtrar
- Mecanismo para informar valores individuais e faixas nos critérios
- Mecanismo de abertura e fechamento individual de grupos
- Rodapé:
- Ações de aplicar e cancelar filtros
Exemplo
| Marcação Wiki |
|---|
{flash:file=Filtro Avançado |
...
- AdvancedFilter^FiltroAvancado_Meiu2.swf|width=800|height=600} |
Componente finalizado
Veja Também
| dts_pagetree |
|---|
h2. Código fonte
\\
{code}
<?xml version="1.0" encoding="utf-8"?>
<panel:SuperPanel xmlns:mx="http://www.adobe.com/2006/mxml" xmlns="*"
xmlns:panel="nl.wv.extenders.panel.*"
xmlns:filtros="com.datasul.meiu.filtros.*"
resizable="true"
width="650"
height="500"
minHeight="500"
minWidth="650"
titleStyleName="portletHeader"
layout="vertical"
horizontalScrollPolicy="off"
verticalScrollPolicy="off"
borderThicknessBottom="0"
borderThicknessTop="0"
borderThicknessRight="0"
borderThicknessLeft="0"
horizontalAlign="center"
verticalAlign="top"
verticalGap="0"
creationComplete="criaElementosArray()">
<mx:Style source="assets/style/main.css"/>
<mx:Script>
<![CDATA[
[Bindable] public var info:Boolean = true;
public var arrItens:Array = new Array();
/* ELEMENTOS DO FILTROS - id + grupo que pertence */
public function criaElementosArray():void{
arrItens.push({id:computadores,grupo:grupo1});
arrItens.push({id:maquinas,grupo:grupo1});
arrItens.push({id:pendrive,grupo:grupo1});
arrItens.push({id:mouse,grupo:grupo1});
arrItens.push({id:mousepad,grupo:grupo1});
arrItens.push({id:monitor,grupo:grupo1});
arrItens.push({id:teclado,grupo:grupo1});
arrItens.push({id:gravador,grupo:grupo1});
arrItens.push({id:memoria,grupo:grupo1});
arrItens.push({id:roteador,grupo:grupo1});
arrItens.push({id:moeda,grupo:grupo2});
arrItens.push({id:movimentacao,grupo:grupo3});
}
/* DADOS DO ListGroupData */
public var listaProvider:Array = [
{label: "Real"},
{label: "Dolar"},
{label: "Euro"},
{label: "Todos"}
];
/* COLETA AS INFORMAÇÕES FILTRADAS */
private function enviaInfo():void{
var k:int;
arrFinal = new Array();
for(k=0; k < arrItens.length; k++){
if(arrItens[k].id.data.selected){
arrFinal.push({nome:arrItens[k].id},{valor:arrItens[k].id.inputFaixa.text});
}
}
}
]]>
</mx:Script>
<panel:headerBar>
<mx:Canvas width="100%" height="100%" paddingRight="8" paddingLeft="8" id="portletHeader" horizontalScrollPolicy="off">
<mx:Label name="title" text="Filtro Avançado" color="#FFFFFF" fontWeight="bold" verticalCenter="0" left="5"/>
<mx:HBox id="titleControls" color="#ffffff" backgroundImage="" verticalAlign="middle" horizontalAlign="right" horizontalScrollPolicy="off" right="5" verticalCenter="0" name="controlBar" >
</mx:HBox>
</mx:Canvas>
</panel:headerBar>
<filtros:CabecalhoFiltro id="cabecalho"
mensagemAlert="Nenhum filtro está aplicado."
tituloAlert="Aviso"
aberturaFiltros="Recolher parâmetros"
recolherParametros="Recolher parâmetros"
extenderParametros="Extender parâmetros"
nenhumParametro="Nenhum parâmetro encontrado."
umParametro="1 parâmetro encontrado."
parametroEncontrados=" parâmetros encontrados."
arrItens="{arrItens}"
titulo="Filtro Avançado de Manutenção"
localizar="Localizar parâmetros"/>
<mx:Canvas width="100%" height="100%" backgroundColor="0xFFFFFF" horizontalScrollPolicy="off">
<mx:VBox id="conteudo" width="100%" paddingBottom="10" paddingTop="20" paddingLeft="10" paddingRight="30">
<filtros:WindowShade id="grupo1" label="Ordem de Manutenção" width="100%" clipContent="true" styleName="linkButtonWindowShade" click="cabecalho.verificaAltura()">
<mx:VBox width="100%" horizontalScrollPolicy="off" verticalGap="-4">
<filtros:TextInputGroupData id="computadores" labelCheck="Computadores" info="{info}" initialText="Todos" avisoInfo="Sempre exibir dicas de uso" ajudaToolTip="Clique aqui para ver as dicas de uso." setaParaDireita="Seta para direita"/>
<filtros:TextInputGroupData id="maquinas" labelCheck="Máquinas" info="{info}" initialText="Todos" avisoInfo="Sempre exibir dicas de uso" ajudaToolTip="Clique aqui para ver as dicas de uso." setaParaDireita="Seta para direita"/>
<filtros:TextInputGroupData id="pendrive" labelCheck="Pendrive" info="{info}" initialText="Todos" avisoInfo="Sempre exibir dicas de uso" ajudaToolTip="Clique aqui para ver as dicas de uso." setaParaDireita="Seta para direita"/>
<filtros:TextInputGroupData id="mouse" labelCheck="Mouse" info="{info}" initialText="Todos" avisoInfo="Sempre exibir dicas de uso" ajudaToolTip="Clique aqui para ver as dicas de uso." setaParaDireita="Seta para direita"/>
<filtros:TextInputGroupData id="mousepad" labelCheck="Mousepad" info="{info}" initialText="Todos" avisoInfo="Sempre exibir dicas de uso" ajudaToolTip="Clique aqui para ver as dicas de uso." setaParaDireita="Seta para direita"/>
<filtros:TextInputGroupData id="monitor" labelCheck="Monitor" info="{info}" initialText="Todos" avisoInfo="Sempre exibir dicas de uso" ajudaToolTip="Clique aqui para ver as dicas de uso." setaParaDireita="Seta para direita"/>
<filtros:TextInputGroupData id="teclado" labelCheck="Teclado" info="{info}" initialText="Todos" avisoInfo="Sempre exibir dicas de uso" ajudaToolTip="Clique aqui para ver as dicas de uso." setaParaDireita="Seta para direita"/>
<filtros:TextInputGroupData id="gravador" labelCheck="Gravador" info="{info}" initialText="Todos" avisoInfo="Sempre exibir dicas de uso" ajudaToolTip="Clique aqui para ver as dicas de uso." setaParaDireita="Seta para direita"/>
<filtros:TextInputGroupData id="memoria" labelCheck="Memória" info="{info}" initialText="Todos" avisoInfo="Sempre exibir dicas de uso" ajudaToolTip="Clique aqui para ver as dicas de uso." setaParaDireita="Seta para direita"/>
<filtros:TextInputGroupData id="roteador" labelCheck="Roteador" info="{info}" initialText="Todos" avisoInfo="Sempre exibir dicas de uso" ajudaToolTip="Clique aqui para ver as dicas de uso." setaParaDireita="Seta para direita"/>
</mx:VBox>
</filtros:WindowShade>
<filtros:WindowShade id="grupo2" label="Controle Moeda" width="100%" height="100%" clipContent="true" styleName="linkButtonWindowShade" click="cabecalho.verificaAltura()">
<mx:VBox width="100%" horizontalScrollPolicy="off" verticalGap="-4">
<filtros:ListGroupData id="moeda" labelCheck="Moeda" listaProvider="{listaProvider}"/>
</mx:VBox>
</filtros:WindowShade>
<filtros:WindowShade id="grupo3" label="Mão-de-obra e Material" width="100%" clipContent="true" styleName="linkButtonWindowShade" click="cabecalho.verificaAltura()">
<mx:VBox width="100%" horizontalScrollPolicy="off" verticalGap="-4">
<filtros:CheckboxGroupData id="movimentacao" labelCheck="Movimentação"/>
</mx:VBox>
</filtros:WindowShade>
</mx:VBox>
</mx:Canvas>
<mx:ControlBar height="40" paddingRight="18">
<mx:Button label="Confirmar" styleName="focalButton" click="enviaInfo()"/>
<mx:Button label="Cancelar" click="closeClickHandler(event)"/>
</mx:ControlBar>
</panel:SuperPanel>
{code}
h2. Referências
* [http://designinginterfaces.com/]
h2. Veja Também
{dts_pagetree} |
|---|
|