Função

O componente Alcance é usado para obter do usuário um valor dentre uma sequência grande de valores finitos, por exemplo de 0 a 100.

Figura 1 - Exemplo de imagem rodando no aplicativo

Principais propriedades

Na tabela abaixo estão descritas as principais propriedades para o funcionamento básico do componente.

Nome

Propriedade

Função

Ícone inicial/esquerdaclassSeleciona o ícone para representar o início do range.
Cor do íconeicon-theme

Altera a cor do ícone.

Ícone final/direitaclassSeleciona o ícone para representar o fim do range.
Valor mínimominDefine o valor mínimo que pode ser selecionado.
Valor máximomaxDefine o valor máximo que pode ser selecionado.

Valor

ng-model

Propriedade Angular que pode ser usada para obter e alimentar o conteúdo pelo bloco de programação.

IdentificadoridAtributo que especifica um ID exclusivo para o componente. Por padrão um id é gerado automaticamente e atribuído ao componente.

Estilo

style

Altera o estilo do componente da forma inline.

Exibirng-showPropriedade Angular usada para mostrar ou oculta o componente.

Repetir

crn-repeat

Propriedade que seleciona uma fonte de dados contida na tela e repete o componente baseado no número de itens dessa fonte de dados.

Segurança

cronapp-security

Propriedade do Cronapp que trata as permissões de segurança da aplicação. Usado para permitir ou não edição e visualização do componente com base nos perfis selecionados.

Skincrn-skinPermite selecionar um skin que afetará apenas o componente selecionado.

Classes CSS

class

Adiciona classes CSS que já foram criadas.


Aba de Estilos

Na tabela abaixo estão descritos os tipos de estilos disponíveis para o componente Alcance.

Nome em portuguêsNome em inglêsDescrição

Plano de fundo

Background

Estiliza plano de fundo do componente.
Ícone inicial/esquerda

First/left icon

Estiliza o ícone do ponto inicial.
Ícone final/direita

Last/right icon

Estiliza o ícone do ponto final.

Cor do ícone

Essa propriedade irá exibir 2 grupos de cores em sua lista, as primeiras são as cores definidas pelo tema e, em seguida, uma seleção fixa de cores pré-definidas.

As cores definidas pelo tema (Padrão do tema, Secundário, Sucesso, Informação, Aviso, Perigo, Claro, Editável, Real e Escuro) podem variar a partir das seguintes situações:

  1. Alteração do tema do projeto (menor prioridade);
  2. Adição da Skin do projeto através do campo "Skin do Tema Mobile" na janela de Configurações do Projeto.
  3. Seleção da Skin na propriedade "Skin" do componente visual (maior prioridade).

Nome em inglês

Range


Nessa página


Compatibilidade

  • Formulário mobile


Equivalente web

Slider


Botão do Componente


Imagem no Editor Visual