Estilo do menu
Neste vídeo será abordado o que são arquivos de estilo no LumisXP e será criado o estilo do menu.
Clique aqui para baixar o material de apoio deste vídeo.
Sobre os arquivos de estilo
- Os arquivos de estilo geram o HTML produzido pelas instâncias de interface a partir de um XML.
- O XML, pode possuir informações como os dados dos conteúdos cadastrados na instancia de serviço relacionada a instância de interface
- Para criação de arquivos de estilos há suporte para JavaScript (padrão atual), Groovy, XSL e Thymeleaf.
Criação do estilo para o menu
- Acessar a instância de interface do menu e criar um novo estilo.
- Copiar o HTML do layout esperado e colar no editor de estilos.
- Iterar sobre os itens de menu no XML para gerar as tags <li> dinamicamente:
- Filtrar itens de primeiro nível usando "parentContentId".
- Excluir itens marcados como "escondidos" usando "hidden".
- Gerar classes dinâmicas com base no atributo "inCurrentPath".
- Adicionar estruturas para itens de segundo nível vinculados aos pais.
Resultado
- O menu dinâmico é gerado com o HTML esperado do layout.
- Itens ocultos não aparecem, e a hierarquia de níveis é mantida.
- Classes dinâmicas são aplicadas para destacar o item selecionado.