Marca de UI no Web UI Framework

O Web UI Framework permite alterar a marca da UI para o nome de sua própria marca, incluindo logotipos da empresa. É possível usar o Ext JS Plugins para customizar a aparência.

Você também pode alterar o tema e outros itens. Um aplicativo de amostra pode ser dividido nas duas partes a seguir:
  • Temas
  • Layout

Temas

Todos os temas utilizados no Web UI Framework utilizam arquivos CSS que podem ser substituída por:

  • Colocar as entradas substituídas em um diretório. Um arquivo CSS customizado pode ser colocado em qualquer lugar.

    Use a tag IncludeCSS para substituir o arquivo CSS. A tag IncludeCSS suporta um código de idioma. Utilize o arquivo localizado do CSS para o código de idioma correspondente. O arquivo localizado poderá ser, então, usado para substituir o CSS.

    Exemplo:
    <scuitag:includeCSS path="/sfs/resources/default/css/sfs-core.css" />
  • Usar a implementação de pós-autenticação (ISCUIPostAuthenticationProvider).

Layout

Esse é um layout de amostra que pode ser usado como um ponto de início de um aplicativo. Embora seja possível escolher projetar seu próprio layout customizado, esse tipo de layout de estrutura é recomendado.

O layout da tela pode ser dividido em cinco partes diferentes, conforme mostrado abaixo.

Uma tela de amostra para um sistema de gerenciamento de linhas aéreas, com cinco partes
Tabela 1. Layout da tela
Seção de Diagrama de Layout da Tela Parte do Layout da Tela Descrição
A Cabeçalho Consiste do nome do aplicativo, do logotipo da empresa, de links estáticos, de informações do usuário com login efetuado e de uma imagem de plano de fundo.
B Menu O Web UI Framework permite incluir um menu em uma tela. Os usuários podem chamar uma função JavaScript passando o ID do elemento HTML no qual o menu deve ser renderizado. As entradas de menu são buscadas a partir da API getUserHierarchy do usuário com login efetuado.
C Cabeçalho da Página Consiste do título da página e de um ou mais painéis.
D Página ou Tela Consiste de um ou mais painéis.
E Rodapé Consiste de links estáticos e informações de copyright.