Ir para o conteúdo

Tipos de Controle

Controles são conjuntos definidos de dados que são exibidos em um Painel em App Builder, e Tipo de Controle determina como os dados serão exibidos e, mais especificamente, como eles se parecerão. Enquanto a maioria dos Tipos de Controle exigem a seleção de um objeto de dados, alguns não. As diferentes opções para um Tipo de Controle são as seguintes:

Nome Descrição
Autocompletar Ao editar um campo, uma lista suspensa com outras entradas na coluna aparecerá. Se um objeto de dados específico for usado para a lista, ele pode ser especificado selecionando-o no menu suspenso Agrupar por, caso contrário, o controle será definido como padrão para itens na coluna. Há três opções de filtro para a lista:
  • Qualquer: Todas as entradas que contêm o caractere digitado aparecerão.
  • Exato: Somente entradas que correspondem exatamente ao texto inserido no campo aparecerão.
  • Começa com: Somente entradas que começam com o texto inserido no campo aparecerão.
Botão Os botões podem ser usados para acionar um evento, para criar um link para uma nova página dentro do aplicativo ou para criar um link para uma URL externa.
Grupo de botões Um elemento de controle gráfico com abas que permite ao usuário escolher apenas uma de um conjunto predefinido de opções. Semelhante ao Tipo de controle de rádio. Este tipo de controle requer uma fonte para extrair os valores de chave e título. Veja abaixo mais informações sobre o Tipo de controle de grupo de botões.
Caixa de seleção Exibe um campo de caixa de seleção. A caixa de seleção está vinculada a uma coluna de fonte de dados Boolean/Bit. A caixa de seleção mostrará preenchida se o valor for 1/true e vazia se 0/false. Se a opção Invert estiver habilitada, a caixa de seleção estará vazia se o valor for 1/true e preenchida se 0/false. As colunas Boolean são normalmente definidas para não permitir nulos e o padrão é 0.
ColorPicker Exibe uma caixa com a cor apropriada de um código de cor hexadecimal fornecido. Por exemplo, uma coluna de tabela com o código hexadecimal #000000 exibirá uma caixa preta. Quando uma linha do seletor de cores é editada, uma roda de cores será aberta.
Data Ao criar um controle de Data, os usuários podem escolher se o controle exibe a data, a hora ou ambos. A opção padrão é Detectar, que determinará o subtipo de controle com base no tipo de dados lógicos da coluna de dados. Quando um controle de Data é editado em um aplicativo, um calendário aparecerá e permitirá que os usuários selecionem uma data. Para controles de Data com hora e data habilitadas, clicar no ícone Hora exibirá um relógio.
Controle Dinâmico Um Controle Dinâmico pode alterar seu tipo com base nos dados que recebe. Isso é especialmente útil para formulários que usam vários tipos de entrada. Tipos de Controle Compatíveis com Controle Dinâmico:
  • Lista
  • Texto
  • Área de Texto
  • Numérico
  • Caixa de Seleção
  • Botões - requer a configuração do valor do Subtipo de Controle Dinâmico
  • Data - requer a configuração do valor do Subtipo de Controle Dinâmico
  • ColorPicker
  • HTML
  • Senha
  • Rádio
Incorporar Incorpora um arquivo de uma URL que está em uma coluna de tabela (pode ser um objeto binário/painel de linha única).
Arquivo Permite que um arquivo seja carregado. A coluna de objeto de dados na qual um tipo de controle de arquivo é construído precisa ser binária para que esse tipo de controle funcione corretamente.
Para referência, consulte o tutorial Generic File Container.
Grupo Selecionar Grupo permite que o usuário crie um grupo para o painel, onde os Controles selecionados podem ser colocados em agrupamentos lógicos.
HTML O tipo de controle HTML tem vários modelos que podem ser usados para concluir várias tarefas. Por exemplo, o modelo Painel Centralizado criará uma página que permite ao usuário inserir uma imagem e escrever uma breve descrição. Imagem de Painel Completo insere uma imagem da tabela usando codificação HTML. O modelo Google Maps pega um endereço na tabela de dados e o exibe por visualização de mapa ou por visualização de rua. Valores de mapa também podem ser usados para exibir uma visualização de rua do Google. O LinkedIn permite vincular a um perfil do LinkedIn.
Ícone Seleciona uma imagem a ser exibida junto com outros controles no painel.
Imagem Exibe uma imagem do App Builder banco de dados. Pode ser formatado para 'ícone' ou 'foto' em Image Purpose, dependendo da saída desejada.
Linha Exibe uma linha fina e horizontal quando adicionada a um painel. O Tipo de Controle de Linha é projetado principalmente para uso em um Painel de Linha Única em App Builder. O valor Width para o Line Control Type define quão larga, horizontalmente, na tela a linha é exibida. Se você deixar Width nulo, ou em branco (mas não 0), a linha ocupará 100% do seu espaço alocado. Se você fornecer um valor numérico Width, como 25, ela ocupará 25 "Zudy's" do espaço alocado.
Lista Permite que um usuário selecione de uma lista de valores válidos. O Objeto de Dados de Origem é a tabela ou objeto de negócios que contém os valores necessários para a lista suspensa, bem como a Chave e o Título necessários para o Controle.
Numérico Exibe números.
Senha Criptografa o texto alterando o texto para pontos.
Barra de progresso Insere uma barra de progresso, que pode ser usada para ilustrar visualmente o progresso em uma tarefa ou processo. A visibilidade do status de um sistema ou processo é importante para os usuários em um bom design de UI/UX, pois fornece a eles feedback sobre o que está acontecendo. Veja abaixo mais informações sobre o tipo de controle de barra de progresso.
Rádio Um elemento de controle gráfico que permite ao usuário escolher apenas uma de um conjunto predefinido de opções. Este tipo de controle requer uma fonte para extrair os valores de chave e título, e está disponível para painéis de quadro, painéis de faixa e tipos de painel padrão.
Espaço Insere espaço em branco visual, sem precisar fazer isso em HTML. Este recurso é projetado principalmente para uso em um Painel de Linha Única em App Builder.
Texto Exibe texto. Este texto também pode ser usado para disparar um evento: excluir ou salvar, vincular a uma nova página dentro do aplicativo ou vincular a uma URL externa.
Área de texto Exibe o texto em um contêiner de tamanho maior e permite quebras de linha.
Modelo Tipo de controle que possui vários modelos diferentes que podem ser usados para realizar várias tarefas, incluindo HTML e JSON.

A configuração Edge Case > Sort Column permite que um usuário classifique os dados em qualquer controle em uma coluna diferente de sua coluna de origem.

Barra de Progresso

Um tipo de controle Barra de progresso pode ser usado para indicar visualmente an App Builder usuário o quão avançado em um processo ele está, ou progresso ou conclusão em uma tarefa específica. Por exemplo, você pode querer exibir uma Barra de Progresso para indicar o quão completas as informações que você está tentando capturar estão atualmente. A porcentagem preenchida em uma determinada Barra de Progresso depende da necessidade de um valor do banco de dados que esteja entre 0 e 1, onde 1 = 100% (0,4 seria exibido como 40%).

A Barra de Progresso suporta os seguintes Subtipos:

  • Empilhado = exibe o rótulo e o valor percentual abaixo da barra
  • Barra normal = exibe a porcentagem dentro da barra

Você pode formatar a maneira como o texto aparece na Barra de Progresso usando String de Formato (disponível em Edge Case) e pode personalizar ainda mais o controle usando Estilos.

stackedprogressbar.png

Grupo de Botões

O tipo de controle Button Group obtém dados como os Radio Controls fazem hoje, mas produzem botões que são clicáveis para definir o valor correspondente. Eles suportarão o Modo Excel e aparecerão como botões se o fizerem (semelhante a como as caixas de seleção salvam automaticamente o valor quando clicadas se você usar o Modo Excel). Alguns estilos são controlados por Temas que você pode aplicar ao campo.

Grupo de botões