Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.

Função

Lista Listas com swipe deslizar são componentes  Item com swipe vinculado a uma Fonte deslizar vinculados a um Componente visual fonte de dados,  Dessa forma, é possível permitindo associar o conteúdo da lista com registros da fonte de dados.. Além disso, a lista com swipe deslizar permite que o usuário realize ações através dos botões que aparecem após arrastar um dos itens da lista para esquerda o componente.do componente, é preciso configurar alguma ação para que esses botões funcionem. 


Image AddedImage Removed

Figura 1 - Exemplo da Lista com swipe deslizar rodando no Aplicativoaplicativo

Principais propriedades

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

Lista com

swipe

deslizar

Nome

Propriedade

Função

Fonte de dados

crn-datasource

Seleciona uma fonte de dados presente no formulário html.

Identificador

id

Gera um ID automaticamente para o componente, mas que pode ser alterado.

EstilostyleAltera o estilo do componente de forma inline.

Exibir

ng-show

Propriedade AngularJS Angular usada para mostrar ou oculta ocultar o componente.

Repetircrn-repeatPropriedade 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

Abre a janela de seleção dos grupos com permissões para visualização ou edição.

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

Classes CSS

class

Adiciona classes CSS que já foram criadas.

Itens-Define a quantidade de Itens e acessa as configurações desses Itens. 
Dica
Para mais detalhes sobre propriedades não descritas
abaixo
acima, acesse a documentação do componente
 Item com swipe.
Item com deslizar.

Aba de Estilos

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

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

Plano de fundo

Background

Estiliza o plano de fundo do componente.

Título

Label

Estiliza o texto do componente.
Botão de Editar

Edit Button

Estiliza o botão de editar
Botão de Excluir

Delete Button

Estiliza o botão de deletar

Vincular fonte de dados

O funcionamento básico do componente é através do vínculo de uma fonte de dados com o componente. Assim, insera insira e configure a Componente visual fonte de dados na área de design, e após isso, adicione a lista com swipe, em propriedades, selecione para fazer o vínculo (Figura 2.1) dessa fonte com o componente.

Image Removed

o componente Lista com deslizar e selecione a fonte de dados que será utilizada no componente.


Image Added

Figura 2 - Vincular Figura 2.1 - Víncular fonte de dados existente no formulário ao componente

Itens

Após selecionar uma fonte Fonte de dados (propriedade Fonte de dados) é necessário apenas 1 item configurado com um dos campos da fonte de dados para exibir uma lista de registros. Para fazer essa configuração, vá na propriedade Itens e clique no subcomponente Item para fazer sua seleção e, assim, pode poder abrir a janela de conteúdo e fazer o vínculo do conteúdo com um campo da fonte de dados.


Image Modified

Figura 2. 2.1 - Víncular Vincular dados ao componente


Ao clicar no botão "+" (Adicionar) da propriedade "Itens

, um Item com swipe será inserido no componente Lista com swipe

", do componente Lista com deslizar, será incluído um novo componenteItem com deslizar (subcomponente) que é vinculado a um registro da fonte de dados (Figura 2.

2.2

1). Clique sobre o novo Item (destaque 1 da figura 2.2

.2

) para selecionar e configurar somente o novo Item

(Figura 2

.

2.3). Perceba na figura abaixo que somente o novo item fica selecionado na área de edição.

Para retornar as configurações da Lista com

swipe

deslizar, clique fora da área selecionada na área de edição.

Para reordenar os itens, clique e arraste (

destaque 2 da figura

2

.2.2

) ou clique no ícone da lixeira para excluir o item.


Image RemovedImage Added

Figura 2.2 .2 - Propriedade Itens da Lista


Após configurar um registro da propriedade Itens, o componente será visualizado como na figura abaixo.


Image RemovedImage Added

Figura 2. 2.3 -  Lista com swipe deslizar com novo registro na propriedade itens

Nome em inglês

List SwipeSwipe List


Nessa página

Índice
maxLevel3
printablefalse


Compatibilidade

  • Formulário mobile


Equivalente web / mobile

Não possuiO link será adicionado no final, após todos os componentes criados.


Botão do Componente

Image Removed

Image Added


Imagem no Editor Visual

Image Removed

Image Added