Olá, pessoal! Como vocês estão?

Hoje vou mostrar como mudar as cores de uma aplicação no Oracle APEX de forma fácil e rápida. A nova versão do Oracle APEX possui um novo template, o tema “Universal Theme (42)”. Esse novo template, implementado a partir da versão 5.1 do APEX, permite customizar facilmente as cores de seus componentes, tais como: Botões, Headers, Grids, Colunas e Relatórios.

Vou criar uma aplicação exemplo simples, um cadastro de funcionários. O mais importante nesse momento é escolher o tema “Universal Theme (42)”. Por default já vem selecionado.

Após a criação da aplicação, efetuei alguns ajustes para facilitar o entendimento desse artigo.

Para alterar as cores dos componentes da aplicação, devemos utilizar a barra de tarefas do desenvolvedor. Essa barra de tarefas é habilitada quando executamos a aplicação, logados através da Workspace do APEX:

Clique na opção “Theme Roller” e irá abrir uma tela com as opções de customização:

Clique na opção “Show All” para ver todos as opções disponíveis.

Veja que a primeira propriedade “Style” possui algumas opções. São alguns estilos pré-definidos disponibilizados pela Oracle. Você também pode escolher algum e utilizar em sua aplicação.

Na seção Global Colors é onde estão definidas as cores do Header, Body, Links e Focus de todas as páginas da aplicação.

Vamos mudar para amarelo. Clique na cor do Header e irá abrir o seletor de cores.

Temos propriedades por componente, por exemplo. Podemos definir as cores das paletas e o arredondamento das bordas dos botões. Podemos definir uma cor exclusiva do texto ou do fundo do botão quando ele for Hot ou Danger.

Outro bom exemplo que podemos explorar é a seção “Navigation”. Lá você pode mudar as cores da barra de menu. Entre as opções, você pode mudar a cor do ícone, da lista e da entrada de menu que está sendo acessada pelo usuário.

Na seção “Forms” estão as opções de mudança dos itens de um formulário:

Já na seção “Regions”, podemos mudar as cores das regiões. Tais como seu Header e Body.

As outras seções são:

• States – Determina as cores das mensagens que são exibidas ao usuário.
• Pallete – Você pode customizar até 15 opções de cores para serem utilizadas nos componentes do APEX.
• Interactive Reports – Refere-se as cores dos interactive reports, tanto a grid editável quanto aos relatórios.
• Custom CSS – Permite inserir um tags CSS em toda a aplicação de maneira simples e central.

Em especial, a seção “Layout” possui propriedades que permitem mudar o tamanho do Header (título da aplicação), da árvore de menus, definir um tamanho fixo para o Body das páginas da aplicação.

Importante!

Clique no botão “Save As” e salve o seu estilo personalizado. Em seguida clique no botão “Set as Current” para definir o seu estilo como padrão da sua aplicação.

Veja como ficou a aplicação:

Para acessar a aplicação exemplo, clique no link abaixo:

https://apex.oracle.com/pls/apex/f?p=124881

O recurso “Theme Roller” permite facilmente e rapidamente customizar a aplicação conforme o gosto do usuário, possibilitando assim uma experiência ainda melhor com o Oracle APEX.