Quando usar

Sempre usar no portlet para exibir:

• OBRIGATÓRIO - Período sendo exibido (filtro)
• Outros filtros aplicados
• OBRIGATÓRIO - Data da última atualização
• CASO EXISTA OBRIGATÓRIO - Atualizações agendadas
• Mecanismos para filtros rápidos (ex. combo de troca de mês)
• Orientações sobre conteúdo e/ou objetivo do portlet (Ex.: Pedidos a vencer no mês).

No cabeçalho é possível apresentar ícones, títulos e descrições do portlet, datas, totais, faixas ou grupos de infomações pré-especificadas;

Estrutura

• Área do cabeçalho - fundo azul...
• PIN - Que fixa o cabeçalho;
• Icone - Para representar o portlet;
• Texto - Pode conter uma descrição ou uma informação referente a configuração;
• Ícone da Funcionalidade (opcional);
• Título (opcional) - deve conter o nome da Entidade ou Título da Informação sendo visualizada;
• Resumo dos critérios sendo filtrados (opcional porém recomendado).

Comportamentos

• O cabeçalho é ocultável pelo link no topo extremo do mesmo
• PIN de Cabeçalho - usado para fixar ou liberar o cabeçalho aberto na interface. Não fixado é exibido em camada sobre os dados; já fixado move os dados para posição abaixo do cabeçalho;

Boas Práticas

• O texto apresentado no cabeçalho do portlet deve ser objetivo e breve devido ao seu espaço.
• Lembre-se das restrições do tamanho mínimo 235 x 200 px para evitar scrollbars

Exemplo

• Portlet

Código fonte

< em desenvolvimento >

Referências

• http://designinginterfaces.com/

Veja Também

Visão Geral

Cabeçalhos representam

Quando usar

• Para apresentar totais, agrupadores, controles de navegação entre registros e outras ferramentas do contexto (UC);
• Para identificar filtros aplicados na área de conteúdo;
• Para identificar registro selecionado referente aos conteúdos abaixo do cabeçalho(ex.pai x filho).

Estrutura

• Agrupador de cabeçalho (ocultáveis ou não);
• Filtros rápidos;
• Totalizadores (filtráveis ou não);
• Filtro Simples.

Comportamentos

Apresenta títulos referentes ao portlet, contendo botões para minimizar, maximizar e fechar.

Boas Práticas

Exemplo

Código fonte

Referências

...