Histórico da Página

...

Quando

...

usar

...

Para
...
conduzir
...
ações
...
sub-focais,
...
menos
...
impactantes
...
para
...
o
...
negócio.
...
Para
...
conduzir
...
em
...
processos
...
longos,
...
como
...
wizards,
...
com
...
vários
...
passos;
...
Para
...
informar
...
e
...
consultar
...
chaves
...
estrangeiras;
...
Para
...
detalhar
...
informações
...
(apresentadas
...
na
...
interface
...
anterior
...
de
...
maneira
...
simples)
...
-
...
EXTRAS
...
ON
...
DEMAND;
...
Para
...
interfaces
...
que
...
precisam
...
manter
...
o
...
contexto
...
sendo
...
exibido
...
ao
...
fundo
...
(informações
...
de
...
apoio);
...
Para
...
apresentar
...
mensagens
...
e
...
interfaces
...
de
...
acompanhamento
...
de
...
processamento;
...
Para
...
apresentar
...
interfaces
...
modais
...
que
...
precisam
...
travar
...
outras
...
interfaces;
...
Para
...
apresentar
...
mensagens
...
ao
...
usuário
...
(ver
...
Mensagens).
...

Estrutura

A Janela é uma área flutuante sobre a interface é um container que engloba os seguintes itens:

Barra de Título
A barra de títulos é uma área de identificação de Portlets e Janelas localizada na parte superior destes componentes. Ela é composta por
Título - Deve conter o nome do Caso de Uso, tarefa sendo suportada na Interface, nome da Entidade ou Título da Informação sendo visualizada (SEM AÇÕES OU VERBOS);
Fechar - Ícone permite que o portlet seja ocultado do desktop podendo ser ativado novamente depois pelo menu visualizar
Maximizar - acionando o botão maximizar localizado na barra de títulos ou através do duplo clique sobre a barra de títulos;
Restaurar - Para restaurar a janela quando esta esitver no modo maximizado;

Cabeçalho
No cabeçalho estará disposto um ícone e título idêntico ao da barra. Também nessa área pode estar disposto mecanismos de busca,

totalizadores e informações de cabeçalho referente ao assunto tratado no conteúdo.

- Ícone da Funcionalidade (opcional);
- Título - Deve conter o nome do Caso de Uso ou tarefa sendo suportada na Interface;
- Agrupador de Cabeçalho;
- Filtros Rápidos;
- Totalizadores;
- Filtro Simples.
Área de Conteúdo
O conteúdo comporta um conjunto de informações referente ao contexto utilizado no momento corrente.
- Painel Agrupador com Data Grid;
- Formulários;
- DataGrid;
- Cadastros CRUD;
- Gráficos.
Painel de ações no Rodapé
O rodapé é composto por uma barra que agrupa um conjunto de ações disponíveis para aquele assunto. Um dos botões deve ser o que tem a maior

focalidade, seguindo a prioriodade da esquerda para a direita.

- Ação Focal;
- Ações Normais;
- Ações Subfocais.

Estados e Transições
As animações são realizadas conforme o usuário abre ou fecha a janela, conforme descrito nos comportamentos.

Podem haver dois tipos de Janela:

Datasul Janela Tamanho Fixo - Com dimensões pré-definidas.
Datasul Janela Redimensionável - Segue as mesmas características de Janela, porém ela pode ser redimensionada pelo usuário.

Comportamentos

A Janela é carregada na interface com o efeito de Zoom-in quando é carregada.
Para ação de fechar a Janela é utilizado o efeito de Zoom-out.
O usuário, ao clicar e manter pressionado pode mover para todos os lados da área do browser.

Boas Práticas

A Janela pode ser do tipo modal, quando o usuário fica bloqueado e tudo que estiver atrás dessa janela, ficará em background escuro semi-

transparente. A janela deve ser inicializada no centro do desktop By You através do centerPopup do flex.

Para títulos é importante utilizar títulos curtos com o nome da entidade, evitar gerundios, evitar abreviaturas no nome da Janela (ex.:GGF).

Exemplo de Janela com Tamanho Fixo

Marcação Wiki
{flash:file=^Window_Meiu.swf\|width=800\|height=600}

...

Exemplo de Janela Redimensionável

Marcação Wiki
{flash:file=^Window_Meiu2.swf\|width=800\|height=600}

Código fonte

Bloco de código
\\ h2. Código fonte \\ {code} < em desenvolvimento > {code} \\ h2. Referências * [

Referências

http://designinginterfaces.com/

Veja Também

dts_pagetree

] h2. Veja Também * [Cabeçalho] * [Área de Conteúdo] * [Painel de ações no Rodapé] {dts_pagetree} {: }

sdk_doc_footer

Páginas filhas

Versões comparadas

Versão antiga 7

Nova versão Atual

Chave