Controles do Lumis Portal

Objetivos

  • Definir o que são controles e como utilizá-los.
  • Apresentar em linhas gerais os controles providos pelo Lumis Portal;
  • Demonstrar a sintaxe de implementação de um controle;
  • Apresentar a possibilidade de implementação de um novo controle; e
  • Apresentar a possibilidade de estender um controle existente.

Pré-requisitos

  • Conhecimentos de Lumis Portal, em especial sobre serviços, sources, processActions, observers e DOUI;
  • Desenvolvimento Java.

Conceitos

Controles são responsáveis pela interação entre o usuário e uma instância de interface de um serviço. Esta interação pode não ser visual, a partir do uso de controles escondidos geralmente inseridos em formulários.

Controles respeitam hierarquia; se o controle possui ‘pai’ (outro controle hierarquicamente superior), herda seus resources (strings para internacionalização do portal) e inclui seus próprios, podendo sobrescrever estas informações. Se o controle não tiver ‘pai’, herdará os resources da interface.

Controles no Lumis podem ser divididos em quatro grandes grupos:

  • Control – Controles de layout;
  • DataControl – Estendem Control, sendo também responsáveis pela persistência de dados entre o browser e o servidor; e
  • DataBoundControl – Estendendo DataControl, são controles que acessam sources e disparam processActions. Controles de formulários fazem parte desta classificação por manipularem dados.
  • ValidatorControl – Estende Control, sendo responsável por processos de validação de dados digitados por usuários em formulários.

Ciclo de vida de um controle

As principais etapas do ciclo de vida de um controle são a execução, sequenciada, dos métodos listados a seguir.

  • init();
  • buildSubControls();
  • loadFromRequest() caso IDataControl esteja implementada;
  • serverValidate() caso IValidatorControl seja implementada e a requisição for um processAction;
  • setRenderData() caso seja uma requisição de renderização; e
  • setProcessActionHandlerParameters() caso seja uma requisição de processAction.

Além disso, na implementação de DataBoundControl, o controle se registra como um observador de seu próprio source. Sempre que o source for carregado, essa implementação executa o método setValueFromSource(), que atribui ao controle o valor que está no campo a que ele está associado. Um override nesse método permite a customização de como um valor é lido de um source. Quando o método setRenderData() de um controle é executado, ele deve acrescentar em seu XML os dados que deseja disponibilizar para o XSL, que por sua vez gerará o código HTML que será renderizado no browser. Desta forma, o XML passará a ter as informações necessárias para a correta implementação e estilização do XSL.

Permissionamento

É possível atribuir uma lista de permissões da ACL para qualquer controle:

control.png

A negação de permissões de um controle afeta apenas a sua própria renderização; os demais controles de mesmo nível serão apresentados normalmente.

Utilização

Controles são definidos dentro da tag <controls> do douidefinition, utilizando as sintaxes <control type=”lum_form”> ou <control:lum_form>. Alguns atributos, como id e className, são comuns a todos os controles. Outros podem ser definidos a cada controle ou herdados por eles, como sourceId, dataId, onEnterRenderAction, etc.

Alguns exemplos de implementação de controles são:

Existem controles que permitem que outros sejam declarados dentro deles, como por exemplo o lum_form e o lum_div. Um controle pode ter como subcontroles um grupo restrito de outros controles ou qualquer um, dependendo de sua implementação específica.

O Exemplo a seguir mostra como controles ‘inputText’ e ‘button’ podem ser declarados em um controle que renderiza um ‘form’:

<control:lum_form id=”formulário”>
<control:lum_inputText id=”nome” />
<control:lum_inputText id=”idade” />
<control:lum_button id=”ok” />
</control:lum_form>

Outras possibilidades incluem a colocação de tags de parametrização do controle, tendo como exemplo <onClick><script> e <permissions>, entre outras. Exemplo:

<control:lum_button id=”botao”>
<onClick type=”renderAction” />
</control:lum_button>

Principais controles

  • lum_adminList
    • Renderiza uma lista de dados com filtros, dados tabulares, informações de paginação e seleção múltipla. Trata-se da lista de conteúdos usualmente mostrada na administração de um serviço.
  • lum_autoAdminListButtons
    • Detecta e, automaticamente, adiciona os seguintes controles: lum_interfaceHeaderButtons, lum_addButton, lum_editButton, lum_deleteButton, lum_versionsButton, lum_configureButton. Este controle complementa a lista administrativa de conteúdos com os botões ‘adicionar’, ‘editar’, etc.
  • lum_button
    • Define um botão padrão com texto, imagem e evento onClick.
  • lum_controlGroup
    • Organiza o form, agrupando controles dentro de um box. Trata-se apenas de um controle visual aplicado a um formulário, sem qualquer funcionalidade associada.
  • lum_dropDownList
    • Utilizado para renderizar um ‘combo box’ que permite a escolha de uma das opções apresentadas. Este controle pode possuir até dois sources: um que retorna/configura o valor do controle e outro que retorna uma lista de opções. Outro modo de configurar o controle é explicitar estes valores na própria declaração do controle.
  • lum_form
    • Utilizado para demarcar os limites de um formulário, cujas entradas de dados são postadas para o servidor.
  • lum_inputHidden
    • É um DataBoundControl, utilizado no caso de informações que não devem ser renderizadas, como por exemplo, ID. Renderiza no HTML da interface um input com ‘type=hidden’.
  • lum_inputText
    • É um DataBoundControl que permite a entrada de uma linha de texto. Renderiza no HTML da interface um input com type=text.
  • lum_link
    • Utilizado para renderizar links de diversos tipos, previamente definidos ou calculados dinamicamente.
  • lum_pane
    • Permite posicionar controles dentro de um ‘pane’. Uma interface pode possuir diversos ‘panes’, sendo que apenas um deles fica ativo e visível a cada momento.
  • lum_propertyPage
    • Cria o entorno de uma interface de propriedades, com cabeçalho (controle lum_interfaceHeader) e, botões de Ok e/ou cancelar (lum_okButton e lum_cancelButton), dependendo da configuração aplicada.
  • lum_script
    • É gerado um nó script que pode conter duas tags customizadas para serem substituídas em tempo de execução: <lum_formName/>, que retorna o nome do formulário corrente; e <lum_translate>STR_XXXX</lum_translate>, que realiza traduções de acordo com o idioma selecionado pelo usuário.
  • lum_table
    • Este controle é utilizado para dispor os controles em uma página, organizando-os em uma tabela. Para isso, é exibido um HTML com tags TR e TD.
  • lum_tabularData
    • Utilizado para renderizar dados de um source em uma forma tabular, utilizando templates para sua diagramação.

Indo além

Pode ainda existir a necessidade de criar alguma implementação que não seja encontrada nos controles padrão do Lumis; neste momento, é possível estender uma classe de controle básico ou ainda classes como Control, DataControl, DataBoundControl, ValidatorControl, com a lógica já implementada, focando apenas nos aspectos específicos do novo controle.

É possível também implementar uma ou mais interfaces para criação de controles inteiramente novos. A implementação de interfaces requer, no mínimo, a interface IControl, ou alguma que a estenda. Controles que podem armazenar valor (IDataControl), vinculados a um source (IDataBoundControl) ou validar dados (IValidatorControl).

Autor: Fabio Cesar (Lumis)