Introdução

O UiPath Form Designer é uma implementação personalizada do mecanismo form.io que fornece uma experiência de criação de formulários de arrastar e soltar no UiPath Studio.

Como desenvolvedor de RPA, você usa o UiPath Form Designer para criar interfaces de formulário necessárias em uma automação assistida ou não assistida. Você define a definição, comportamento e validação para cada campo de formulário.

Para interagir com o Form Designer, selecione Open Form Designer dentro da atividade Create Form .

Componentes de formas

Um componente de formulário fornece a capacidade de coletar dados do usuário. Os componentes da interface do usuário são agrupados em categorias, com base em sua funcionalidade, da seguinte maneira:

Categoria do componente de forma	Description	Componente de formulário
Básica	Contém os campos de formas mais usados.	Campo de texto, Área de texto, Número, Senha, Caixa de seleção , Selecionar caixas, Rótulo/cabeçalho, Arquivo/Pasta, Lista suspensa, Rádio, Botão
Avançado	Contém dados pessoais ou relacionados ao tempo.	Elemento HTML, Conteúdo, Email, Número de telefone, Data/Hora, Dia, Hora, Moeda, Pesquisa
Layout	Contém elementos que alteram o layout da forma.	Colunas, Painel, Tabela, Guias
Dados	Contém grades e contêineres especializados para coletar dados.	Oculto, Contêiner, Grade de dados, Editar grade, Grade

Para criar um formulário personalizado, arraste os componentes da interface gráfica desejados, solte-os no painel direito e organize-os de acordo com a lógica de seu caso de uso.

Consulte a página Sobre componentes de formulário para saber mais sobre cada componente e como configurá-los.

Comparação entre componentes do controle de grade

A tabela abaixo compara os recursos dos controles de grade disponíveis no Form Designer. A tabela também descreve os cenários recomendados para usar cada componente de controle de grade: Grid, Data Gride Edit Grid.

Legenda: ✅ = Disponível ❌ = Não disponível.

Recursos	Grade	Grade de Dados	Editar Grade
Cenários recomendados	Exibição de um grande número de dados para fins somente de leitura (capacidade somente de leitura)	Exibição de um pequeno conjunto de dados que precisam ser editados pelo usuário (capacidade de edição em linha)	Exibição de um pequeno conjunto de dados que precisam ser editados pelo usuário (capacidade de edição em linha de subformulário)
Número de linhas recomendado	Ilimitado (compatibilidade com paginação de 100 linhas)	Não mais do que 100 linhas. Risco de redução do desempenho além dos números recomendados	Não mais do que 100 linhas. Risco de redução do desempenho além dos números recomendados
Número de colunas recomendado	Ilimitado	Máximo de sete colunas para 100 linhas. Risco de redução do desempenho	Máximo de sete colunas para 100 linhas. Risco de redução do desempenho
Editável	❌	✅	✅
Paginação	✅	❌	❌
Classificável	✅	❌	❌
Filtrável	✅	❌	❌
Coluna redimensionável no runtime	✅	❌	❌
Agrupamento de linhas	❌	✅	❌
Lógica e condições	❌	✅	✅
Personalização extensa usando modelos	❌	❌	✅
Pesquisa global	❌	❌	❌

Guias de componentes

Depois de selecionar um componente de formulário, um assistente é aberto exibindo várias guias de configuração para permitir uma personalização adicional para diferentes funcionalidades. Verifique o progresso no painel de visualização do assistente.

Quando estiver satisfeito com o design de um componente, selecione Salvar.

A tabela abaixo descreve as configurações disponíveis para as guias comuns do assistente.

Guia do assistente	Description	Menções especiais
Exibição	Configure a forma como o componente de formulário é exibido.	O nome que você definir no campo Rótulo obrigatório é passado como o NomeDaPropriedade na guia Chave de campo.
Dados	Configure um valor padrão que os usuários finais vejam no campo de texto.	Os componentes que podem conter vários itens (por exemplo, caixas de seleção, guias) podem ser definidos aqui.
Validação	Configure os requisitos de validação para habilitar outros componentes de interface do usuário.
Chave do Campo	Configure o nome do componente que deseja usar posteriormente no fluxo de trabalho.	Por padrão, esse valor é passado do campo Rótulo da guia Exibição.
Condicional	Configure as condições para o componente.	Você pode definir condições avançadas, como Javascript ou JSON.
Lógica	Configure a lógica que aciona as condições.

Confira a página Sobre os controles do Form Designer para saber mais sobre cada guia do assistente.

Importante:

O uso da lógica JavaScript personalizada pode levar a ataques de segurança, portanto, certifique-se de entender o risco envolvido antes de implementar seu código JavaScript.

Alguns componentes de formulário têm guias específicas, como por exemplo:

Component	Guia do assistente	Description
Data/Hora	Data	Configure as datas mínimas e máximas disponíveis para seleção.
	Hora	Configure a etapa incremental para horas e minutos.
Dia	Dia	Configure a maneira como o usuário corporativo seleciona o dia (incremental ou em uma lista suspensa).
	Mês	Configure a forma como o usuário empresarial seleciona o mês (incremental ou em uma lista suspensa).
	Ano	Configure a forma como o usuário empresarial seleciona o ano (incremental ou em uma lista suspensa) e também o ano mínimo e máximo disponíveis para seleção.
Editar Grade	Modelos	Personalize os cabeçalhos e linhas de seus dados de grade de edição.

Gerenciando componentes de formulários

Para reabrir o assistente de configuração, passe o mouse sobre o componente de formulário e selecione Editar.

Para reorganizar os componentes do formulário, selecione Mover e arrastar o componente do formulário para outro local dentro do seu formulário.

Para editar o componente de formulário usando suas configurações JSON, selecione Editar JSON. Isso abre o componente JSON, exibindo todas as configurações disponíveis.

Para copiar um componente dentro do formulário, selecione Copiar e, em seguida, selecione Cole abaixo no mesmo componente ou em outro.

Para remover um componente do seu formulário, selecione Remover.

Gerenciando formulários

A faixa de opções Form Designer tem as seguintes opções:

• Salvar— Salva o formulário que você criou.
• Salvar como modelo - Habilita você a exportar a forma que você projetou como um modelo, que pode ser reutilizado em futuros processos de automação.
• Inserir modelo— permite procurar modelos de formulário existentes e adicioná-los ao projeto atual.
• Apagar formulário - Exclui todos os componentes no formulário atual.
• Pré-visualização - Entra em um modo de pré-visualização, que mostra como a forma se parece no runtime. Essa seção também habilita você a redimensionar o tamanho da exibição do formulário ou a selecionar um tema pré-fabricado.

Personalizando temas

Para personalizar um tema pré-fabricado de acordo com sua preferência:

1. No modo de pré-visualização, vá até o painel Temas.
2. Selecione um tema pré-fabricado.
3. Selecione Personalizar tema atual.
4. Personalize a forma e o botão primário usando as opções disponíveis.
5. Selecione Salvar personalização.
   Observação:

   Renaming a customized theme creates a clone for it. The theme is cloned to avoid breaking workflows that use the same theme, but reference it with the previous name.