Editor de Janelas#
O botão “Editor de Janelas” (editor de formulários) no menu de desenvolvimento permite criar suas próprias janelas e exibi-las em modo modal e não modal, incluindo de forma assíncrona em relação ao fluxo do script.
O trabalho com o Editor de Janelas é demonstrado aqui.
Uma janela modal não permite continuar o trabalho do aplicativo até que seja fechada. Uma janela não modal permite que o Usuário mude para outros modos de operação do aplicativo sem fechá-lo, mas está sempre visualmente sobreposta ao aplicativo. Além disso, as janelas criadas podem ser vinculadas a elementos personalizados em outros aplicativos.
O Editor de Janelas permite usar tanto um layout fixo quanto um layout responsivo.
O layout responsivo altera o design da página dependendo do comportamento do Usuário, da plataforma, do tamanho da tela e da orientação do dispositivo, e é uma parte integrante do desenvolvimento web moderno. Ele permite economizar significativamente e não redesenhar um novo design para cada resolução, mas mudar tamanhos e posições de elementos individuais.
O layout fixo é um tipo de layout em que a largura do conteúdo é rigidamente definida em pixels e não muda dependendo do tamanho da janela do navegador.
A interface do Usuário do Editor de Janelas consiste nas seguintes áreas principais:
- Menu principal (barra superior);
- Elementos gerais e contêineres;
- Área de trabalho central;
- Painel de propriedades dos elementos.
| № p/p | Elemento da interface | Descrição |
| 1. | menu “Arquivo” | Permite usar funções básicas para gerenciar formulários de usuário no editor de janelas. |
| 2. | menu “Edição” | Permite realizar ações de desfazer, refazer, copiar, etc. |
| 3. | botão “Nova Janela” | Permite abrir um novo formulário para edição. |
| 4. | botão “Visualizar” | Permite ver a versão que estará disponível após o layout. Além disso, pode-se usar a tecla F5. |
| 5. | botão “Editar Propriedades da Janela” | Permite ajustar as configurações do formulário. Além disso, pode-se usar a tecla F8. |
| 6. | botão “Editar Eventos da Janela” | Permite ajustar as configurações do formulário. Além disso, pode-se usar a combinação de teclas Ctrl+F8. |
| 7. | botão | Permite desfazer a ação. |
| 8. | botão | Permite refazer a ação. |
| 9. | botão | Permite excluir o elemento selecionado. |
| 10. | botão | Permite alinhar o elemento selecionado à esquerda. |
| 11. | botão | Permite alinhar o elemento selecionado ao centro. |
| 12. | botão | Permite alinhar o elemento selecionado à direita. |
| 13. | botão | Permite alinhar o elemento selecionado ao topo. |
| 14. | botão | Permite alinhar o elemento selecionado ao meio. |
| 15. | botão | Permite alinhar o elemento selecionado na parte inferior. |
| 16. | botão | Permite alinhar o elemento selecionado à largura. |
| 17. | botão | Permite alinhar o elemento selecionado à altura. |
| 18. | botão | Permite alinhar o elemento selecionado às dimensões. |
O menu "Arquivo" do Editor de Janelas contém as seguintes funções:
| № p/p | Elemento da interface | Descrição |
| 1. | item “Nova janela” | Permite abrir um novo formulário para edição. |
| 2. | item “Exportar para arquivo” | Permite exportar o formulário para um arquivo json. Também é possível usar a combinação de teclas Ctrl+E. |
| 3. | item “Importar de arquivo” | Permite importar o formulário de um arquivo json. Também é possível usar a combinação de teclas Ctrl+I. |
| 4. | item “Pré-visualização da janela” | Permite ver a versão que estará disponível após a formatação. Também é possível usar a tecla F5. |
| 5. | item “Editar propriedades da janela” | Permite ajustar as configurações do formulário. Também é possível usar a tecla F8. |
| 6. | item “Editar eventos da janela” | Permite ajustar as configurações do formulário. Também é possível usar a combinação de teclas Ctrl+F8. |
| 7. | item “Fechar” | Permite fechar o Editor de janelas. |
A janela “Editar configurações do formulário” pode ser aberta de várias maneiras:
- No menu “Arquivo” através dos itens “Editar propriedades da janela” ou “Editar eventos da janela”.
- No menu principal através dos botões “Editar propriedades da janela” ou “Editar eventos da janela”.
- Usando as teclas de atalho “F8” e “Ctrl+F8” para abrir o Editor de configurações do formulário na aba “Propriedades” e na aba “Eventos”, respectivamente.
A aba "Propriedades" da janela "Editar configurações do formulário" contém as seguintes funções:
| № p/p | Elemento da interface | Descrição |
| 1. | botão “Adicionar elemento” | Permite adicionar um elemento da lista de elementos comuns através da seleção de um menu suspenso. |
| 2. | botão “Mover para cima” | Permite mover o elemento selecionado para cima. |
| 3. | botão “Mover para baixo” | Permite mover o elemento selecionado para baixo. |
| 4. | coluna “Nome da vinculação” | Permite selecionar a variável à qual outra variável será vinculada. |
| 5. | coluna “Tipo de vinculação” | Tipo de vinculação, comparação ou atribuição. |
| 6. | coluna “Valor da vinculação” | Permite selecionar a variável à qual o valor será vinculado. |
A aba "Eventos" da janela "Editar configurações do formulário" contém as seguintes funções:
| № p/p | Elemento da interface | Descrição |
| 1. | botão “Adicionar elemento” | Permite adicionar um elemento da lista de elementos comuns que já estão instalados na janela (formulário) através da seleção de um menu suspenso. |
| 2. | botão “Adicionar eventos de botões” | Permite adicionar eventos de botões. |
| 3. | coluna “Nome” | Nome do elemento adicionado. |
| 4. | coluna “Valor” | Valor do evento. |
O menu "Edição" do Editor de janelas oferece as seguintes opções:
| № p/p | Elemento da interface | Descrição |
| 1. | item “Desfazer” | Permite desfazer a ação. Também é possível usar a combinação de teclas Ctrl+Z. |
| 2. | item “Refazer” | Permite refazer a ação. Também é possível usar a combinação de teclas Ctrl+Y. |
| 3. | item “Copiar” | Permite copiar o elemento. Também é possível usar a combinação de teclas Ctrl+C. |
| 4. | item “Colar” | Permite colar o elemento. Também é possível usar a combinação de teclas Ctrl+V. |
| 5. | item “Excluir” | Permite excluir o elemento. Também é possível usar a tecla Delete. |
Ao usar o Editor de janelas, uma série de elementos e ferramentas estão disponíveis:
- formatação de tabelas em múltiplos níveis;
- botões, caixas de seleção, campos de texto;
- listas comuns e suspensas, bem como listas com marcadores;
- botões de opção e grupos de opção;
- calendários;
- campos de senha e outros tipos especiais de campos;
- imagens;
- barras de progresso;
- editor de texto com formatação;
- divisores, abas, barras de rolagem;
- tabelas de dados editáveis;
- outros elementos de controle.
Cada elemento de controle possui mais de 50 propriedades configuráveis que determinam sua aparência e comportamento. Os valores de cada uma delas, assim como as ações dos usuários na janela, podem ser vinculados à alteração dos valores das variáveis selecionadas, e vice-versa - a alteração dos valores das variáveis resulta na alteração dos valores dos elementos de controle correspondentes. Essa funcionalidade permite desenvolver, dentro do cenário do robô, sistemas de diálogo e especialistas ramificados, janelas de configurações do robô, dicas interativas e assistentes, bem como aplicativos inteiros com múltiplas janelas.
Importante! Para demonstrar o funcionamento dessa funcionalidade, foi adicionando na pasta Project o jogo "Jogo da Velha" - o primeiro jogo da velha do mundo, implementado com os recursos da plataforma RPA.
| № p/p | Elemento da interface | Descrição |
| 1. | Elementos gerais | |
| 1.1. | Cursor | Permite selecionar um elemento no formulário para sua configuração/movimento. |
| 1.2. | Label | Permite definir um rótulo de texto na janela editável (formulário). |
| 1.3. | Button | Permite definir um botão. |
| 1.4. | CheckBox | Permite definir uma caixa de seleção. |
| 1.5. | TextBox | Permite definir um campo de texto. |
| 1.6. | ComboBox | Permite selecionar um item de uma lista de opções pré-definidas. |
| 1.7. | CheckedListBox | Permite definir uma lista simples com caixas de seleção. |
| 1.8. | DateTimePicker | Permite definir um elemento para seleção de data e hora. |
| 1.9. | LinkLabel | Permite definir um elemento com hyperlink. |
| 1.10. | ListBox | Permite definir uma lista simples. |
| 1.11. | MaskedTextBox | Permite definir um campo de texto com controle de entrada e verificação automática de erros. |
| 1.12. | MonthCalendar | Permite definir um elemento com data que pode ser selecionada através de um calendário visual mensal. |
| 1. |