Apresentação e controles da interface do usuário
Os elementos da interface do usuário (como entradas de texto e layouts) apresentam informações e itens executáveis na interface do usuário.
Elementos da interface do usuário na Pega Platform
Na Pega Platform, o sistema emparelha o campo automaticamente com o controle ideal pronto para uso. Ao combinar automaticamente os campos com o controle ideal, a Pega melhorou muito o processo de manutenção e atualização de aplicativos para nossos clientes.
Os elementos de IU da Pega Platform™ incluem controles básicos prontos para uso, incluindo:
- Controles de conclusão automática
- Caixas de seleção
- Listas suspensas
- Controles de URL
- Editores de rich-text
- Entrada de texto
Nota: Para obter mais informações sobre os controles de interface do usuário disponíveis, consulte Configuração de campos.
Ao emparelhar automaticamente os campos com o controle ideal, a Pega melhorou drasticamente o processo de manutenção e atualização de aplicativos da Pega para nossos clientes. Como Business Architect da Pega, parte de sua função em um projeto que usa a Pega Platform é educar os clientes sobre essa e outras vantagens do design prescrito.
Tipos de controle
Os controles são elementos de IU que determinam como dados, texto, imagens e outras informações aparecem nos formulários do usuário tanto para exibição quando para entrada do usuário. Cada tipo de controle tem uma aparência única e oferece diferentes funções aos usuários. O sistema atribui um controle padrão quando um novo campo é definido.
O uso do tipo de controle correto para um propósito específico garante que os usuários insiram valores válidos. A tabela a seguir mostra o exemplo de casos de uso para diferentes tipos de controle:
| Tipo de controle | Como o controle ajuda na validação | Caso de uso |
|---|---|---|
| Data e Hora | A seleção de uma data a partir de um ícone de calendário garante que os usuários insiram uma data em formato válido. | Os usuários devem inserir uma data que inclua dia, mês e ano. |
| Radio buttons | Restringe as escolhas a um conjunto de valores válidos e permite aos usuários selecionar somente um valor. É possível usar radio buttons (botões de opção) quando somente um pequeno número de opções (por exemplo, menos do que cinco) está disponível. | Os usuários devem selecionar um dos três tipos possíveis de empréstimo. O usuário deve ver todos os tipos no formulário. |
| Dropdown | Restringe os valores válidos aos que aparecem na lista. Uma lista do dropdown apresenta as opções somente quando os usuários clicam no controle. Isso ajuda a reduzir a quantidade de informações no formulário. | Os usuários devem selecionar um dos 10 tipos de cadeiras de escritório em uma lista. As opções não precisam ser exibidas no formulário. |
| Autocompletar | Quando os usuários inserem um ou mais valores no controle, o controle filtra as opções disponíveis. Isto ajuda os usuários a encontrar uma opção em uma lista caso haja um grande número (por exemplo, mais de 20) de opções possíveis. | Os usuários devem selecionar o país no qual residem em uma lista. O usuário pode inserir texto no controle para ajudar a encontrar o país correto. |
| Checkbox | Os usuários podem marcar a caixa de seleção ou deixá-la em branco. Essa opção assegura que uma propriedade verdadeira/falsa seja verdadeira (selecionada) ou falsa (não selecionada). | Os usuários selecionam uma opção para adquirir seguro de viagem adicional. |
Configurações editáveis
As configurações editáveis podem ser usadas nos controles para restringir os valores de entrada aos formatos válidos. As configurações são específicas ao tipo de controle. Por exemplo, é possível especificar se os usuários não podem inserir datas como texto. No caso, eles devem selecionar uma data a partir do ícone de calendário. É uma melhor prática fazer com que os usuários especifiquem datas utilizando um ícone de calendário para garantir que a data inserida corresponda ao formato esperado pelo aplicativo. Também é possível especificar o mínimo e o máximo de caracteres permitidos em um controle de entrada de texto. A imagem a seguir mostra mensagens de erro ao inserir uma data de nascimento em formato e inválido e uma senha que não atende aos caracteres mínimos:
Estilizar elementos da interface do usuário
Você pode usar temas para configurar o estilo dos elementos da interface do usuário, como botões, links ou cabeçalhos. As alterações em um tema valem para todos os elementos da interface do usuário no aplicativo. Estabelecer uma aparência consistente nos elementos de IU do aplicativo poupa tempo de desenvolvimento, cria uma interface de usuário mais previsível e facilita o preenchimento dos formulários para os usuários.
O tema pronto Pegasus é exibido na figura abaixo:
Nota: Para saber mais sobre como estilizar um aplicativo, consulte Definir temas.
Verifique seu conhecimento com a seguinte interação:
This Topic is available in the following Module:
If you are having problems with your training, please review the Pega Academy Support FAQs.
Quer nos ajudar a melhorar esse conteúdo?