Time#
Para configurar o widget, é necessário realizar as seguintes ações:
O widget Time exibe um campo para entrada de valor textual pelo Usuário, permitindo o uso de dicas e restrições para a entrada de apenas valores corretos.
Para configurar o elemento, clique no ícone de edição .
Uma janela pop-up “Configurações do elemento” será aberta:
Campos para configuração do widget#
Preencha os campos necessários para configurar o widget.
“Obrigatório” – checkbox, preenchido manualmente com o botão esquerdo do mouse. Destina-se a colorir o campo de vermelho, caso o Usuário não tenha preenchido este widget.
“Nome visível” – campo de texto, preenchido manualmente com o teclado. Permite especificar um nome para o widget.
“Nome do Parâmetro na Tarefa (Task)” – campo de texto, preenchido manualmente com o teclado. Neste campo é exibido o texto que corresponde ao valor do Parâmetro especificado da Tarefa selecionada. O Usuário pode alterar esse valor no campo de texto, e após salvar o formulário, o novo valor será gravado no Parâmetro da Tarefa selecionada. Isso significa que, ao fazer alterações no campo de texto, o Usuário pode atualizar as informações na Tarefa, bastando apenas inserir um novo valor e salvar as alterações.
“Placeholder” – campo de texto, preenchido manualmente com o teclado. Permite especificar um texto de placeholder que será exibido no campo de entrada até que o usuário comece a inserir um valor.
“Classe” – campo de texto, preenchido manualmente com o teclado. Permite especificar uma classe CSS que será aplicada ao elemento. Isso permite alterar o estilo do widget, como cor, tamanho ou fonte.
“Expressão regular (Regexp)” – campo de texto, preenchido manualmente com o teclado. Permite definir uma expressão regular para validação da entrada.
“Mensagem de erro de validação” – campo de texto, preenchido manualmente com o teclado. Permite especificar um texto que será exibido ao Usuário caso o valor inserido não passe na validação.
“Dica” – campo de texto, preenchido manualmente com o teclado. Permite especificar uma dica adicional que ajudará o usuário a entender o que exatamente deve ser inserido.
“Valor padrão” – campo de texto, preenchido manualmente com o teclado. Permite especificar um valor que será exibido no campo de entrada por padrão.
Exemplo de preenchimento#
| Nome do campo | Valor |
| Checkbox "Obrigatório" | |
| Nome visível | Hora de início da aula |
| Nome do Parâmetro na Tarefa (Task) | start_time |
| Placeholder | HH:MM |
| Classe | time-input |
| Expressão regular (Regexp) | ^([01]?\d|2[0-3]):([0-5]\d)$ |
| Mensagem de erro de validação | Por favor, insira a hora no formato HH:MM (por exemplo, 14:30) |
| Dica | Informe a hora de início da aula no formato HH:MM. |
| Valor padrão | 09:00 |
Resultado:
Exemplo de seleção de hora#
A seleção de hora é possível apenas por meio de um elemento gráfico da interface que exibe horas e minutos. Permite ao Usuário escolher a hora usando uma roda especial (spinner) para girar as escalas de horas e minutos:
O Usuário pode navegar pelas horas e minutos usando as escalas de tempo. Uma interface conveniente e intuitiva, especialmente para Usuários que não estão familiarizados com o formato de tempo.