Nesse tutorial, será criado um Formulário com Labels abaixo dos campos utilizando a tabela de exemplo “employees” e os seguintes recursos extras:
- Blocos.
- Páginas.
Criando um Formulário com Labels abaixo dos campos
Nota:
Caso tenha alguma dúvida de como criar um Formulário, acesse: Criando um novo Formulário
1. Crie uma nova aplicação do tipo Formulário, selecione a opção “Único Registro” e em seguida, selecione a tabela de exemplo “employees”.


2. Feito isso, caso deseje uma melhor exibição do formulário, clique na aba “Editar Campos” e altere o nome dos campos destacados, conforme é mostrado nas imagens abaixo.

Editando os campos do Formulário com Labels abaixo dos campos
1. Primeiro, no menu da aplicação, acesse a aba “Layout” e selecione a opção “Páginas”.


2. Feito isso, renomeia a página já existente para “Informações Pessoais”, crie uma nova página, denominada “Anotações”, e em seguida, clique no botão “Incluir” como mostra a imagem abaixo.


3. Agora, ainda na aba de “Layout”, selecione a opção “Blocos”.


4. Feito isso, renomeie o bloco já existente para “Informações Pessoais” e configure o mesmo de acordo com a imagem abaixo.


5. Ainda nas configurações dos blocos, clique no botão “Criar Novo Bloco” e crie um novo bloco intitulados “Endereço”.


6. Após criar o bloco “Endereço”, crie mais um bloco intitulado “Anotações”.

6. Agora, posicione o bloco “Endereço” na “Pag1” e o configure de acordo com a imagem abaixo.


7. Após configurar o bloco anterior, configure o bloco “Anotações” de acordo com a imagem abaixo e mantenha o mesmo na “Pag2”.

8. Feito isso, no menu da aplicação, acesse a aba “Posicionamento dos Campos”.


9. Agora, mova os campos: “employeeid”, “titleofcourtesy”, “homephone”, “photo”, “reportsto”, “photopath” e “extension” para a caixa da esquerda, conforme é mostrado abaixo.

10. Em seguida, organize os campos em seus respectivos blocos e páginas, como mostra a imagem abaixo.

11. Finalmente, selecione o botão “Executar Aplicação” na barra de ferramentas para gerar o Formulário.


Feito isso, após seguir os passos acima, o Formulário ficará desta forma:


Para ver mais exemplos criados usando o Scriptcase, acesse: Exemplos: Sistemas Completos e Aplicações com Scriptcase.
Comente este post