# Quadros (Kanban) No agilityflow, a visualização padrão é por listas. Cada linha da lista corresponde a um registro do formulário. As colunas exibidas são as que foram definidas na configuração do formulário, na [listagem principal de dados](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/listagem-principal-de-dados "Listagem principal de dados"). Entretanto, dependendo da natureza das informações armazenadas no formulário, um outro tipo de visualização seja mais adequado. A visualização em quadros do agilityflow, visa melhorar a maneira de interação do usuário com os registros. Para isso, usamos o método Kanban, que é um método consagrado de mercado, e que é conhecido por ser um método de gestão visual para o controle de tarefas, processos e demandas. ### Usando Um Quadro #### Opções Ao abrir um quadro, as opções principais estão no menu do canto superior direito: ![](http://wiki.agilityflow.io/uploads/images/gallery/2019-05-May/scaled-840-0/image-1557164415147.png) ##### Listagem Padrão Alterna a visualização do formulário para o modo padrão. ##### Visualização Favorita Ao clicar no ícone ![](http://wiki.agilityflow.io/uploads/images/gallery/2019-05-May/scaled-840-0/image-1557165098840.png) ao lado de uma visualização, ela se torna a padrão do formulário. Com isso, sempre que o formulário for acessado, a primeira visualização será a que for definida como favorita. ##### Criar Outro Quadro Abre a opção para se criar um novo quadro como explicado no capítulo [criando um quadro](#bkmrk-criando-um-quadro "Criando um Quadro") abaixo. #### Reordenar as colunas É possível reordenar as colunas de um quadro. Basta clicar na coluna e arrastar para a posição desejada. O salvamento é feito de forma automática, e a ordem das colunas será sempre o último configurado. #### Arrastando os Cards Ao arrastar um card, o valor do campo que é usado para definir as colunas é alterado no registro também. Na prática, arrastar um card para outra coluna é o mesmo que abrir o registro e alterar o campo.

É possível também re-ordenar os cards dentro de uma mesma coluna, mudando assim a ordem em que os cards são exibidos.

#### Rascunhos Os rascunhos podem ser exibidos em dois locais: ##### Na coluna a qual o registro pertence Caso o registro já possua o campo da coluna preenchido, ele será exibido na coluna respectiva, com uma marcação de rascunho, como mostra a figura abaixo: ![](http://wiki.agilityflow.io/uploads/images/gallery/2019-05-May/scaled-840-0/image-1557165566319.png) ##### Na coluna Rascunhos Não Salvos Caso não seja possível definir a coluna, o registro será mostrado em uma coluna chamada "Rascunhos Não Salvos". ![](http://wiki.agilityflow.io/uploads/images/gallery/2019-05-May/scaled-840-0/image-1557165725836.png) #### Coluna "Não Definido" Os registros que já foram salvos, mas o campo usado para definir as colunas do quadro não tenha sido preenchido, serão colocados em uma coluna chamada "Não Definido". ![](http://wiki.agilityflow.io/uploads/images/gallery/2019-05-May/scaled-840-0/image-1557165857121.png) #### Adicionar Lista Essa opção cria novas colunas na visualização. Na prática, é adicionado um registro na tabela dinâmica que o campo usado como base para colunas utiliza. #### Configurar Ações É possível criar ações pré-definidas, como explicadas [aqui](http://wiki.agilityflow.io/link/69#bkmrk-%E2%A0-0 "Ações Customizadas (Menu Interno)"). #### Filtro Os filtros funcionam da mesma [forma](http://wiki.agilityflow.io/link/55#bkmrk-consultar-os-registr "Consultar os Registros") que na visualização padrão. ### Criando um quadro A criação do quadro pode ser através do [devcenter](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/chapter/devcenter---customizar-o-agilityflow "Devcenter - Customizar o Agilityflow"), na opção Quadros (kanban), ou dentro do próprio formulário (caso o usuário tenha permissão) clicando no canto superior esquerdo onde é mostrada o tipo de listagem, e em seguida em "Criar Quadro": ![](http://wiki.agilityflow.io/uploads/images/gallery/2019-05-May/scaled-840-0/image-1557158748754.png) Em seguida, é necessário informar qual o formulário será usado como origem dos dados. ![](http://wiki.agilityflow.io/uploads/images/gallery/2019-05-May/scaled-840-0/image-1557158733819.png) Ao selecionar o formulário, outras opções serão apresentadas para configurar o novo quadro: ![](http://wiki.agilityflow.io/uploads/images/gallery/2019-05-May/scaled-840-0/image-1557161744881.png) #### Campos de apresentação do card Devido ao espaço limitado desse método, não é possível exibir todos os campos como na forma de listagem padrão. A exibição é limitada a dois campos, que serão apresentados como título e descrição. Abaixo, um exemplo de um cartão com os dois campos ![](http://wiki.agilityflow.io/uploads/images/gallery/2019-05-May/scaled-840-0/image-1557161278164.png) ##### Título do card É o campo que será usado como título do card. Esse campo é mostrado em negrito, no topo. ##### Descrição do card É o campo que virá abaixo do título. ### Divisão das colunas/listas do quadro O método Kanban utiliza colunas para separar e exibir os registros. Nessa opção, é possível definir o critério em que as colunas serão baseadas. ##### As colunas serão baseadas nas etapas do fluxo do formulário? Quando o formulário informado na origem dos dados for um fluxo com etapas, essa opção estará disponível e as colunas serão as etapas do fluxo. Caso queira outro campo, é possível selecionar a opção "Não". Outros campos aparecerão para definir as colunas. ##### As colunas serão baseadas em um campo existente no formulário? Deixar como sim padrão. ##### As colunas serão baseadas em qual campo Selecione o campo do formulário utilizado para a definição das colunas. Nessa opção, apenas os campos com origem em uma lista dinâmica são permitidos, tais como [Lista de Seleção](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/lista-de-sele%C3%A7%C3%A3o-%28combo%29 "Lista de seleção (Combo)"), [Lista com Autocompletar](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/pesquisa-com-auto-completar "Pesquisa com auto completar") e [Radio](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/lista-aberta-com-escolha-%C3%BAnica-%28radio%29 "Lista aberta com escolha única (Radio)"). #### Outras configurações ##### Nome do quadro Defina um nome para o quadro.

Como é possível ter vários quadros pro mesmo formulário, é importante a definição de um nome que explique o propósito do quadro

##### Ao clicar no card deverá abrir inicialmente a aba São duas opções: formulário e [acompanhamento](http://wiki.agilityflow.io/books/manual-do-usu%C3%A1rio/page/acompanhamento "Acompanhamento"). ##### Permitir o usuário criar outras listas/colunas (mostrar botão: "adicionar lista") O botão adicionar lista fica na extrema direita, no final do quadro, e permite que o usuário crie novas colunas no Kanban. Ao clicar em adicionar lista, na prática, abre o formulário para a criação de um novo registro no formulário usado como fonte pelo campo informado na definição das colunas do quadro.

Seja cuidadoso na criação de um quadro kanban. Após a configuração inicial, não é possível alterá-lo. Caso seja necessário, será preciso criar um novo quadro.