Rating
Configuração Geral
Este tipo de campo permite que o desenvolvedor crie de forma rápida um campo de avaliação com estrelas (ou alguma outra imagem), onde o usuário final poderá selecionar a classificação de acordo com a escala previamente configurada.
Descrição dos atributos disponíveis para configuração.
Tipo do Dado
Define o tipo do campo na aplicação. Neste caso devemos selecionar o tipo Rating
Label
Define o título que será exibido no campo ao executar a aplicação. A terminologia utilizada na interface é fundamental para que seu sistema tenha uma boa usabilidade, devemos utilizar nomes e termos familiares para o usuário final da aplicação, ao invés de utilizarmos termos originados no sistema.
Por exemplo, este campo rating que na tabela possui o nome cmp_rating, o cliente teria um entendimento melhor da funcionalidade do campo ao definirmos a label como Avaliação do Produto.
Alem de um texto fixo, o atributo Label permite a utilização de lang para definir o título do campo, possibilitando assim a internacionalização de sua Aplicação.
Etiqueta abaixo do campo
Define a mensagem a ser exibida abaixo do campo.
Legenda
Define a legenda que será exibida no campo, a baixo das avaliações. Por exemplo: “Agradecemos pelo seu feedback!”.
Assim como a Label, o atributo Legenda também permite utilizarmos lang para a internacionalização de sua Aplicação
Quantidade de Ícones
Define a quantidade de itens que serão exibidos no campo. O valor informado neste atributo deve está de acordo com a forma que a avaliação será realizada.
Para avaliações com estrelas são utilizadas normalmente cinco estrelas, então devemos informar 5 neste atributo. Após informarmos as imagens que serão exibidas nos atributos ícone habilitado e ícone desabilitado o resultado será este:
Para utilizarmos Like/Dislike, por exemplo, devemos informar 1 na quantidade de ícones, para que apenas uma imagem seja exibida e alternada de acordo com o clique.
Neste caso, o armazenamento na base de dados será 1 para Like(ícone habilitado) e 0 para dislike(ícone desabilitado) Confira o resultado abaixo de um rating configurado com like/dislike:
Ícone Habilitado
Define o ícone que será exibido para a quantidade selecionada. Seguindo o exemplo anterior do Like/Dislike, nesta opção devemos inserir o Like .
O mesmo serve para uma avaliação por estrelas, onde por padrão devemos adicionar a estrela preenchida
Ícone Desabilitado
Define o ícone que será exibido para a quantidade que não estiver selecionada. Neste atributo devemos adicionar uma imagem que represente o negativo da imagem anterior, ícone habilitado.
Ainda referenciado o exemplo do Like/Dislike, nesta opção deveríamos inserir o Dislike
Bem como no exemplo das estrelas, devemos adicionar a estrela sem preenchimento
Valor Inicial(tipo)
Possibilita a definição de um valor inicial para o campo quando o formulário estiver em modo de inclusão. A única opção disponível para este tipo de campo é Valor Definido. Ao selecionar esta opção, o atributo Valor Inicial será disponibilizado, onde devemos informar o valor inicial do campo.
Por exemplo, meu valor inicial é 3, ao inserir um novo registro, o campo Avaliação do Produto será iniciado com 3 estrelas selecionadas.
O valor definido neste atributo sobrepõe demais valores definidos previamente.
Gravar Variável
Permite gravar uma variável de sessão(variável global) com o valor do campo, para ser utilizado em outras aplicações.
Por exemplo, no formulário de login o nome do usuário pode ser salvo em sessão e exibido no cabeçalho de outras aplicações.
Nome da Variável
Neste atributo devemos definir o nome da variável de sessão, habilitado no item anterior, que receberá o valor do campo.
Devemos informar apenas o nome da variável, - var_rating.
A recuperação do valor é feita em forma de variável global.
Tipo HTML
Objeto HTML usado para exibir o campo no formulário.
Tipo SQL
Informa o tipo do campo no banco de dados.
Configuração da Visualização
A Configuração da Visualização permite definir valores de CSS para campos individualmente. Para cada Esquema de Visualização do Scriptcase existem os mesmos atributos disponíveis nesta Interface.
Interface de configuração da visualização.
- CSS do Título
- Fonte : Permite escolher o tipo de fonte, que será aplicado no campo da aplicação.
- Tamanho : Permite escolher o tamanho da fonte, que será aplicado no objeto da aplicação.
- Cor da fonte :Permite escolher a cor utilizando uma paleta de cores para ser aplicada a fonte.
- Cor de fundo : Permite escolher a cor, utilizando uma paleta de cores para ser aplicada como plano de fundo do campo da aplicação.
- Negrito : Permite aplicar o tipo negrito na fonte.
- Sublinhado : Permite aplicar o tipo sublinhado na fonte.
- Tamanho da Borda : Permite aumenta o tamanho da borda do título.
- Cor da Borda : Permite escolher a cor da borda, utilizando uma paleta de cores para ser aplicada no título.
- Alinhamento Horizontal : Permite posicionar o label do filtro no local desejado (left,rigth,center e justify).
- Alinhamento Vertical : Permite posicionar o label do fitro no local desejado (baseline, sub, super, top, text-top, middle, bottom, text-bottom).
- Largura : Para definir a largura do título.
- Altura : Para definir a altura do título.
- CSS do Campo
- Fonte : Permite escolher o tipo de fonte, que será aplicado no campo da aplicação.
- Tamanho : Permite escolher o tamanho da fonte, que será aplicado no título da aplicação.
- Cor da fonte :Permite escolher a cor utilizando uma paleta de cores para ser aplicada a fonte.
- Cor de fundo : Permite escolher a cor, utilizando uma paleta de cores para ser aplicada como plano de fundo do campo da aplicação.
- Negrito : Permite aplicar o tipo negrito na fonte.
- Sublinhado : Permite aplicar o tipo sublinhado na fonte.
- Tamanho da Borda : Permite aumenta o tamanho da borda do campo.
- Cor da Borda : Permite escolher a cor da borda, utilizando uma paleta de cores para ser aplicada no campo.
- Alinhamento Horizontal : Permite posicionar o label do filtro no local desejado (left rigth, center e justify).
- Alinhamento Vertical : Permite posicionar o label do fitro no local desejado (baseline, sub, super, top, text-top, middle, bottom, text-bottom).
- Largura : Para definir a largura do campo.
- Altura : Para definir a altura do campo.
- CSS do Objeto Input
- Fonte : Permite escolher o tipo de fonte, que será aplicado no objeto input. Por exemplo: Radio, Select, Text, etc
- Tamanho : Permite escolher o tamanho da fonte, que será aplicado no título da aplicação.
- Cor da fonte : Permite escolher a cor utilizando uma paleta de cores para ser aplicada a fonte.
- Cor de fundo : Permite escolher a cor, utilizando uma paleta de cores para ser aplicada como plano de fundo do objeto input.
- Negrito : Permite aplicar o tipo negrito na fonte.
- Sublinhado : Permite aplicar o tipo sublinhado na fonte.
- Tamanho da Borda : Permite aumenta o tamanho da borda do objeto input.
- Cor da Borda : Permite escolher a cor da borda, utilizando uma paleta de cores para ser aplicada no objeto input.
- Alinhamento Horizontal : Permite posicionar o label do filtro no local desejado (left, rigth, center e justify).
- Alinhamento Vertical : Permite posicionar o label do fitro no local desejado (baseline, sub, super, top, text-top, middle, bottom, text-bottom).
- Largura : Para definir a largura do objeto input.
- Altura : Para definir a altura do objeto input.
Configuração de Ajuda
Permite que o desenvolvedor adicione instruções e dicas de utilização no campo, permintindo assim que o desenvolvedores auxiliem os usuários no entendimento e na utilização do sistema.
Descrição dos atributos da configuração.
Descreva Ajuda
Area destinada a inclusão do texto que será apresentado na aplicação de acordo com o tipo selecionado abaixo.
Tipo do Help
Pop-up - Exibe um ícone padrão ? ao lado do campo. Para exibir a mensagem basta clicar no ícone, um pop-up será exibido contendo o texto.
Hint - Exibe um ícone padrão ? ao lado do campo. Ao posicionar o mouse sobre o ícome, a mensagem será exibida.
O ícone exibido ao selecionar os tipos Hint ou Popup variam de acordo com o tema que está sendo utilizado. Este ícone pode ser alterado no [css dos botoes].
Texto - Exibe o texto dentro de um <span></span>
ao lado do campo.
Posição do botão ajuda
Define onde o botão ajuda irá aparecer no campo da aplicação em execução. As opções são:
Ao lado: O ícone de ajuda irá aparecer ao lado do campo. Na coluna: O ícone de ajuda irá aparecer ao lado do label do campo.
Exemplos relacionados
- Grid Editável View com Modal
- Formulário Simples
- Múltiplos Registros
- Grid Editável View
- Grid Editável
Layout
Exportação
Mestre Detalhe
Filtro
Barra de Ferramentas
Botão
Ligações
Campos
- Marca d'agua
- Formatar ao digitar
- Combobox Multi-selecionável
- Upload de múltiplas imagens
- Formulário com campos especiais
- Editando um campo Select utilizando um formulário
- Autocomplete