Layouts: Configuração da grade de campo
Uma grade de campos coleta vários campos em um único layout, mas, ao contrário de um conjunto, ela pode fazer referência a outras linhas.
Uma grade de campos apresenta vários campos em um layout matricial. Estes são úteis quando você precisa solicitar o mesmo conjunto de informações um número predeterminado de vezes. As grades de campo permitem que os usuários criem uma tabela de valores repetidos. Em uma grade de campo, as linhas podem fazer referência a outras linhas, enquanto em um conjunto um usuário não pode escrever regras entre índices.
As grades de campo podem ser expandidas na direção colunar ou de linha (ou seja, horizontal ou verticalmente).
Defina todos os campos que devem ser exibidos na grade de campos. O Matrix Loader é uma boa ferramenta para isso. Associe os campos ao blueprint no qual eles serão usados.
Configuração do layout da grade de campo
Para adicionar uma grade de campo ao layout, um conjunto de colunas não é necessário porque a grade de campo cria as linhas e colunas. Em vez disso, os seguintes tipos de linha são necessários:
- fieldgrid: este tipo informa ao layout que uma grade de campo será usada no layout
- fieldgriddata: este tipo é usado para cada coluna da grade de campos
- field: este tipo é necessário para cada célula na grade de campos (não para cada linha)
As primeiras três imagens mostram o arquivo CSV. A última imagem mostra o layout do usuário correspondente. Os números acima se alinham com os números nas imagens abaixo. (Como o número 3 é mostrado várias vezes, uma letra é adicionada para maior clareza.) As células individuais na grade de campos não podem ter um rótulo e um campo de entrada. Observe que, pelo 3C, um rótulo e um campo de entrada são adicionados ao arquivo CSV de layout. No entanto, somente o campo de entrada entra no layout.
Controles de IU da grade de campo
Vários aspectos da IU da grade de campo podem ser controlados atualizando o campo de valor no arquivo CSV de layout:
- Visibilidade da linha de grade
- Cabeçalhos de coluna dinâmicos
- Largura do campo da grade de campo
Elementos da Fieldgrid
Os seguintes valores podem ser adicionados à coluna Valor dos elementos fieldgrid:
- indexPreValor da cadeia de caracteres a ser exibido na coluna de índice antes do número de índice. opcional
- indexPostValor da cadeia de caracteres a ser exibido na coluna de índice após o número de índice. opcional
- indexVisible: verdadeiro | falso, se o número de índice e a coluna devem ser exibidos no layout de grade de campo. Padrão: Verdadeiro
- maximumHeight: Altura máxima a ser definida em px CSS. Ou seja, "180px". opcional
- gridlines: todos | horizontal | vertical | nenhum, controla como as linhas de grade são exibidas entre as células. Opcional, o padrão é Todos.
Elementos fieldgriddata
Os seguintes valores podem ser adicionados à coluna Valor dos elementos fieldgriddata:
- fieldIndex: nome do campo a ser usado como valor de cabeçalho. Opcional. Se incluído, o rótulo do elemento fieldgriddata deve ficar em branco.
- width: largura dos campos. Opcional. Se incluídos, exemplos de valor válido são auto, 300(px são presumidos aqui), 300px, 20vwe. calc(100% - 100px).
O padrão das grades de campo é 100% de largura, mas se mesmo um valor de largura for especificado para um componente fieldgriddata contido, a largura da grade de campo mudará para autopara que uma largura especificada possa ser aplicada.
Exemplo de cabeçalhos dinâmicos de grade de campo e arquivo CSV de linhas de grade