WIzard de Páginas
Início  Anterior  Próximo

minilogowi


seta WIzard



O WIzard é o módulo do WebIntegrator que oferece ao desenvolvedor um ambiente de desenvolvimento baseado nos conceitos RAD (Rapid Application Development) para a criação e/ou edição de páginas WSP. Neste tipo de ambiente a maior parte do tempo de desenvolvimento de uma página será destinado à definição dos valores das propriedades e dos eventos dos elementos que irão fazer parte da página sem ser preciso que o desenvolvedor se importe com a codificação HTML necessária para gerá-la.

Um dos recursos que merece destaque no WIzard é a possibilidade de montagem automática de uma página baseada em informações coletadas de componentes do tipo Objeto definidos no Pré-Página. A primeira vez que o WIzard é executado para uma determinada página ou caso o desenvolvedor peça para recarregar a página o WIzard irá percorrer as definições de Pré-Página dessa página e assim que um componente Objeto é encontrado ele automaticamente insere na página WSP um formulário HTML com os campos correspondentes às colunas referenciadas pelo Objeto, caso a página venha a possuir mais de um Objeto serão criados tantos formulários quanto for a quantidade de Objetos existentes no Pré-Página.




NOTA

nota   Como um sub-produto desse recurso há também a possibilidade da geração da lógica de Pós-Página para realizar inclusões ou alterações, essa lógica também será baseada nas definições do(s) Obejto(s) de Pré-Página. Para saber com maiores detalhes sobre o funcionamento da geração automática de páginas baseada nas definições de Objetos no Pré-Página clique aqui.



O ambiente do WIzard é composto de duas janelas: uma que exibe o layout da página como será visto pelos usuários e uma outra, a janela de Propriedades, onde são exibidas as propriedades do elemento selecionado. Na janela onde se exibe o layout da página, os elementos podem ser selecionados bastando clicar com o mouse sobre o ícone prop e automaticamente a janela de Propriedades irá exibir os dados do elemento correspondente.

A janela de Propriedades contém em sua parte superior uma combo onde são listados todos os elementos que fazem parte da página e logo abaixo uma pequena barra de ferramentas que oferece as seguintes opções:

Botão
Descrição



add
Insere mais um elemento na página. Esse novo elemento será inicialmente do tipo Genérico e será posicionado como o último elemento da página mas o desenvolvedor poderá alterar as suas propriedades a fim de reposicioná-lo e/ou trocar de tipo.
delete
Remove o elemento que se encontra atualmente selecionado.
maint
Facilitador para manutenção de página. Clicando nesse botão, o usuário obterá uma janela contendo todos os elementos que compõem sua página, podendo copiar, mover, e remover elementos.

up
Desloca o elemento que se encontra selecionado uma posição acima ou à esquerda de onde ele se encontra atualmente. A propriedade Sequência será decrementada de 1.

down
Desloca o elemento que se encontra selecionado uma posição abaixo ou à direita de onde ele se encontra atualmente. A propriedade Sequência será incrementada de 1.
view16
Exibe a página já processada pelo WIEngine.

update
Gera a lógica de Pós-Página para a realização de inserções ou alterações baseada nas definições do(s) Objeto(s) de Pré-Página. Para cada Objeto de Pré-Página (formulário) serão criado 4 (quatro) elementos no Pós-Página: dois Updates, um Objeto e um Gravar.

reload
Recarrega as definições de Pré-Página a fim de inserir novos elementos na página. As alterações que foram feitas no layout da página não serão perdidas apenas serão inseridos os campos e/ou formulários (Objetos) novos que o WIzard encontre.
setpos
Salva as posições e os dimensionamentos das janelas do WIzard.
folder1
Abre a página que está selecionada na combo-box.
paste
Copia o elemento que está selecionado na janela de layout da página para a página que está selecionada na combo-box.
save
Salva as propriedades do elementos de página.
arrow_open
Este botão localiza-se no canto superior esquerdo da janela de definições da página. Ele abre a janela que contém os componentes padrão do WebIntegrator e os definidos pelo usuário.


Os elementos listados na
combo-box localizada acima da barra de botões são aqueles que estão inseridos na página e podem representar um formulário HTML, um determinado tipo de campo de formulário HTML (TEXT, CHECKBOX, TEXTAREA, SELECT, etc.), a tag HEAD de um documento HTML ou um tipo genérico onde o desenvolvedor poderá criar links, inserir imagens ou colocar qualquer outra tag HTML. Para saber mais sobre o tipo Genérico clique aqui.

Como explicado anteriormente, para cada Objeto encontrado no Pré-Página será criado um formulário na página. Esse formulário aparecerá listado na
combo-box identificado pelo mesmo identificador do Objeto a que ele se refere seguido de FRM. Para saber maiores detalhes sobre as propriedades de um formulário clique aqui.

O elemento que representa a tag HEAD está representado pela opção <HEAD> na
combo-box servindo para que o desenvolvedor possa inserir informações sobre o documento. Os browsers não exibem as informações que se encontram dentro desta tag. Para saber maiores detalhes sobre as propriedades da tag HEAD clique aqui.

Já os elementos que representam tipos de campo de formulário HTML apresentam algumas características comuns sendo divididos em duas partes: o título e o campo. As propriedades relacionadas com o título são iguais para todos os componentes, já as propriedades relacionadas ao campos há algumas que são específicas a depender do tipo escolhido.

Logo abaixo seguem relacionadas as propriedades comuns a todos os elementos que representam campos de formulário (Campo, Grupo e Checkbox).

O campo
Nome indica o nome da variável do contexto do WebIntegrator representada por esse elemento. Em se tratando de um campo de formulário esse nome faz referência a uma coluna do Objeto representado pelo formulário.

O campo
Tipo indica o tipo de elemento que está selecionado. Clicando no link se abrirá a janela de edição de Elementos Definido pelo Usuário para o elemento que estiver selecionado, caso o elemento não seja do tipo USR. Um elemento pode ser um dos 5 tipos listados a seguir:

·      Genérico (GEN): indica um elemento que a depender das propriedades que estejam setadas poderá se comportar como um botão, um link, uma imagem, um texto com a possibilidade de conter tags HTML ou até mesmo uma combinação desses.  
·      Campo (TXT): indica um campo de entrada de dados de um formulário onde o usuário poderá digitar algum valor, exceção feita aos campos HIDDEN ou aqueles que se encontrem desabilitados e/ou com permissão de apenas leitura.  
·      Checkbox (CHK): indica um campo de formulário HTML do tipo CHECKBOX, este tipo de campo normalmente é usado para atributos booleanos simples onde um campo deve estar escolhido, ou não. Também pode ser utilizado para atributos que possam levar múltiplos valores ao mesmo tempo. O último é representado por um número de CheckBoxes com o mesmo nome.  
·      Grupo (GRP): indica um elemento que representa um grupo de valores donde apenas um poderá ser escolhido. Esse tipo de elemento se divide em mais dois tipos: Combo e Radio que representam respectivamente uma combo-box e um radio group.  
·      Form (FRM): indica um elemento que representa um formulário HTML. Normalmente será dentro desse tipo de elemento que elementos do tipo Checkbox, Grupo e Campo ficarão inseridos.     
·      Botão (BTN): indica um elemento que representa um botão.  
·      Elementos Definido pelo Usuário (USR): são simbolizados por # ou $ mais o nome do elemento.  
 

O campo
Quebra Linha
indica se há uma quebra de linha logo após o elemento.

O campo
Sequência
indica a sequência que esse elemento possui na página. Ao se alterar o valor desse campo também se altera a posição (sequência) que o elemento irá aparecer na página. O desenvolvedor também poderá alterar a posição (sequência) do elemento na página usando os botões up e down que, respectivamente, deslocam-no uma posição acima ou abaixo.

O campo
Classe indica o nome da classe CSS que será usada para aplicar um estilo visual a todo o elemento (título + campo). A classe CSS deve estar especificada no arquivo que serviu como modelo para a página ou deve estar em um arquivo CSS a ser incluído na página. Para incluir um arquivo CSS numa página gerada pelo WIzard selecione na combo-box o elemento <HEAD> e no campo Link CSS coloque o nome da arquivo desejado. Clicando em reticencias serão listadas as classes CSS que estão definidas nos arquivos CSS que foram definidos para essa página.

O campo
Estilo CSS indica o estilo visual que será aplicado a todo o elemento. Aqui o desenvolvedor especifica diretamente os códigos style-sheet a serem aplicados ao elemento, exemplo:

font: italic 12px Verdana, Geneva, Arial, Helvetica, sans-serif; background: blue;

O campo
Texto indica o texto que será exibido como rótulo do elemento.

O campo
Classe indica o nome da classe CSS que será usada para aplicar um estilo visual ao texto do elemento. A classe CSS deve estar especificada no arquivo que serviu como modelo para a página ou deve estar em um arquivo CSS a ser incluído na página. Para incluir um arquivo CSS numa página gerada pelo WIzard selecione na combo-box o elemento <HEAD> e na propriedade Link CSS indique o caminho relativo ao servidor web do arquivo CSS desejado. Clicando em reticencias serão listadas as classes CSS que estão definidas nos arquivos CSS que foram definidos para essa página.

O campo
Estilo CSS indica o estilo visual que será aplicado ao campo do elemento. Aqui o desenvolvedor especifica diretamente os código style-sheet a serem aplicados ao elemento, exemplo:

font: italic 12px Verdana, Geneva, Arial, Helvetica, sans-serif; background: blue;

O campo
Complemento serve para que o desenvolvedor possa inserir atributos complementares aos elementos inseridos na página e que não esteja relacionado entre as propriedades disponíveis.

Já as propriedades relacionadas ao campo podem sofrer variações a depender do tipo escolhido. Para saber as propriedades relacionadas ao campo de cada um dos elemento que representam campos de formulário clique no links desejado que segue abaixo:

·      Campo  
·      Checkbox  
·      Grupo  
·      Botão  
·      Check-Box  
·      Formulário  
·      Genérico  
·      HEAD  
·      Componente do Usuário