Crear un formulario de resumo nunha aplicación de lenzo

Artigo
03/14/2023

Siga as instrucións paso a paso para crear unha formulario de resumo nunha aplicación de lenzo para xestionar datos ficticios na base de datos de Northwind Traders. Este tema forma parte dunha serie que explica como compilar unha aplicación empresarial con datos relacionais en Microsoft Dataverse. Para obter os mellores resultados, explore estes temas nesta secuencia:

Crear unha galería de pedidos.
Crear un formulario de resumo (este tema).
Crear unha galería de detalles.

Definición das áreas da pantalla.

Requisitos previos

Instalar a base de datos e as aplicacións de Northwind Traders.
Revise a visión xeral da aplicación de lenzo de Northwind Traders.
Cree a galería de pedidos ou abra a aplicación Pedidos de Northwind (lenzo): comezar a segunda parte, que xa contén esa galería.

Engada unha barra de título

Na parte superior da aplicación, cree unha barra de título, que manterá os botóns de acción ao final deste tema.

No panel Visualización en árbore, seleccione Pantalla1 para asegurarse de non engadir un control accidentalmente á galería de pedidos:
No separador Inserir, seleccione Etiqueta para inserir un control Etiqueta:

A nova etiqueta debería aparecer unha soa vez, enriba da galería. Se aparece en cada elemento da galería, elimine a primeira instancia da etiqueta, asegúrese de que a pantalla está seleccionada (como se describe no paso anterior) e logo volva introducir a etiqueta.
Mova e redimensione a nova etiqueta para expandir a parte superior da pantalla:
Prema dúas veces no texto da etiqueta e logo escriba Pedidos de Northwind.

Como alternativa, modifique a propiedade Texto na barra de fórmulas para obter o mesmo resultado:
No separador Inicio, formate a etiqueta:
- Aumente o tamaño do tipo de letra en 24 puntos.
- Poña o texto en negra.
- Poña o texto en branco.
- Centre o texto.
- Engada un recheo azul escuro ao fondo.

Engadir un control Editar formulario

Nesta sección, engadirá controis para mostrar un resumo de calquera pedido que o usuario seleccione na galería.

No separador Inserir, insira un control Editar formulario:

Por defecto, o formulario aparece na esquina superior esquerda, onde outros controis poden dificultar a busca:
Mova e redimensione o formulario para cubrir a esquina superior dereita da pantalla baixo a barra de título:
No panel Propiedades, seleccione o menú despregable Orixe de datos.
Seleccione a orixe de datos Pedidos.

Engadir e organizar campos

No separador Propiedades, preto do bordo dereito, seleccione Editar campos para abrir o panel Campos.
Se o panel Campos non está baleiro, elimine os campos que xa se inseriron.
Despois de que a lista de campos estea baleira, seleccione Engadir campo e logo seleccione as caixas de verificación para os campos Cliente e Empregado.
Desprácese cara abaixo ata que aparezan estes campos e logo seleccione as súas caixas de verificación:
- Notas
- Data do pedido
- Número de pedido
- Estado do pedido
- Data de pagamento
Na parte inferior do panel Campos, seleccione Engadir e logo peche o panel Campos.

O formulario mostra sete campos, que poden estar nunha orde diferente:
Nota

Se algún campo mostra unha icona de erro vermella, podería terse producido un problema cando se extraeron os datos da orixe. Para resolver o erro, actualice os datos:
1. No separador Visualización, seleccione Orixes de datos.
2. No panel Datos, seleccione Orixes de datos.
3. Preto de Pedidos, selecciona os puntos suspensivos (...), seleccione Actualizar e logo peche o panel Datos.
Se a caixa de combinación do nome do cliente ou empregado aínda mostra un erro, marque o Texto primario e o valor de SearchField de cada caixa seleccionándoa e logo abrindo o panel Datos. Para a caixa do cliente, os dous campos deberían estar configurados en nwind_company. Para a caixa do empregado, os dous campos deberían estar configurados en nwind_lastname.
Co formulario seleccionado, cambie o número de columnas do formulario de 3 a 12 no separador Propiedades xunto ao bordo dereito.

Este paso engade flexibilidade a medida que organiza os campos:

Moitos deseños de interface de usuario dependen de esquemas de 12 columnas porque poden acomodar uniformemente filas de 1, 2, 3, 4, 6 e 12 controis. Neste tema, creará filas que conteñan 1, 2 ou 4 controis.
Mova e redimensione os campos arrastrando os seus indicadores, do mesmo xeito que faría calquera outro control, para que cada fila conteña estes cartóns de datos na orde especificada:
- Primeira fila: Número do pedido, Estado do pedido, Data do pedido e Data de pagamento
- Segunda liña: Cliente e Empregado
- Terceira fila: Notas
Nota

Pode que sexa máis sinxelo ensanchar os cartóns de datos de Notas, Cliente e Empregado antes de organizalos.

Máis información acerca de como organizar campos nun formulario: Comprender o esquema do formulario de datos para aplicacións de lenzo.

Ocultar controis de tempo

Neste exemplo, non precisa as partes horarias dos campos de data porque ese nivel de granularidade pode distraer ao usuario. Se os elimina, pode causar problemas nas fórmulas que dependen deses controis para actualizar os valores da data ou determinar a posición doutro control no cartón de datos. No seu lugar, ocultará os controis de tempo configurando a propiedade Visible.

No panel Visualización en árbore, seleccione o cartón de datos Data do pedido.

O cartón pode ter un nome diferente, pero contén a Data do pedido.
Mentres mantén premida a tecla MAIÚS, seleccione os controis de hora, minuto e separación de dous puntos no cartón de datos Data do pedido.
Estableza a propiedade Visible dos controis en false.

Todos os controis seleccionados desaparecen do formulario:
Redimensione o control Selector de datas para mostrar a data completa:

A continuación, repetirá os últimos pasos para o campo Data de pagamento.
No panel Visualización en árbore, seleccione os controis de tempo no cartón de datos Data de pagamento:
Estableza a propiedade Visible dos controis seleccionados en false:
Redimensione o selector de datas no cartón Data de pagamento:

Conectar a galería de pedidos

No panel Visualización en árbore, contraia o formulario para atopar máis facilmente o nome da galería de pedidos e, se é necesario, cámbieo para Galería1.
Configurar a propiedade Elemento do formulario do resumo nesta expresión:
```
Gallery1.Selected
```
O formulario mostra un resumo de calquera pedido que o usuario da aplicación seleccione na lista.

Substituír un cartón de datos

Número de pedido é un identificador que Dataverse atribúe automaticamente cando se crea un rexistro. Este campo ten un control de Entrada de texto por defecto, pero substituirase por unha etiqueta para que o usuario non poida editar este campo.

Seleccione o formulario e seleccione Editar campos no separador Propiedades preto do bordo dereito e logo seleccione o campo Número de pedido:
Abra a lista Tipo de control:
Seleccione o cartón de datos Ver texto:
Pechar o panel Campos.

O usuario xa non pode cambiar o número de pedido:
No separador Inicio, cambie o tamaño do tipo de letra do número de pedido a 20 puntos para que o campo sexa máis sinxelo de atopar:

Usar unha relación de varios a un

A táboa Pedidos ten unha relación de varios a un coa táboa Empregados: cada empregado pode crear varios pedidos, pero cada pedido pode asignarse só a un empregado. Cando o usuario selecciona un empregado no control de caixas de Combo, a súa propiedade seleccionada proporciona todo o rexistro do empregado da táboa de empregados . Como resultado, pode configurar un control Imaxe para mostrar a imaxe de calquera empregado que o usuario seleccione na caixa de combinación.

Seleccione o cartón de datos Empregado:
No separador Avanzado preto do bordo dereito, desbloquee o cartón de datos para que poida editar fórmulas que antes eran só de lectura:
No cartón de datos, reduza o largo da caixa de combinación para deixar espazo á imaxe do empregado:
No separador Inserir, seleccione Multimedia > Imaxe:

No cartón de datos aparece unha imaxe que se expande para acomodala:
Redimensione a imaxe e móvaa á dereita da caixa de combinación:
Establecer a propiedade Imaxe da imaxe nesta fórmula, substituíndo o número ao final de DataCardValue se é necesario:
```
DataCardValue7.Selected.Picture
```
Aparece a imaxe do empregado seleccionado.
Mentres mantén premida a tecla ALT, seleccione un empregado diferente na caixa de combinación para confirmar que a imaxe tamén cambia.

Engadir unha icona Gardar

No panel Visualización en árbore, seleccione Pantalla1 e logo seleccione Inserir > Iconas > Comprobar:

Por defecto, a icona Comprobar aparece na esquina superior esquerda, onde outros controis poden dificultar a busca da icona:
No separador Inicio, cambie a propiedade Cor da icona a branca, redimensione a icona e móvaa preto do bordo dereito da barra do título:
No panel Visualización en árbore, confirme que o nome do formulario é Formulario1 e, a seguir, configure a propiedade OnSelect nesta fórmula:
```
SubmitForm( Form1 )
```
Cando o usuario selecciona a icona, a función SubmitForm recompila todos os valores modificados do formulario e envíaos á orixe de datos. Os puntos marchan pola parte superior da pantalla a medida que se envían os datos e a galería de pedidos reflicte os cambios unha vez finalizado o proceso.
Axuste a propiedade DisplayMode da icona nesta fórmula:
```
If( Form1.Unsaved, DisplayMode.Edit, DisplayMode.Disabled )
```
Se se gardaron todos os cambios no formulario, a icona está desactivada e aparece en DisabledColor, que establecerá a continuación.
Axuste a propiedade DisabledColor da icona neste valor:
```
Gray
```
O usuario pode gardar cambios nun pedido seleccionando a icona Comprobar, que despois se desactiva e escurece ata que o usuario faga outro cambio:

Engadir unha icona Cancelar

No separador Inserir, seleccione Iconas > Cancelar:

Por defecto, a icona aparece na esquina superior esquerda, onde outros controis poden dificultar a busca da icona:
No separador Inicio, cambie a propiedade Cor da icona a branca, redimensione a icona e móvaa á esquerda da icona Comprobar:
Axuste a propiedade OnSelect da icona nesta fórmula:
```
ResetForm( Form1 )
```
A función ResetForm rexeita todos os cambios no formulario, que o devolve ao seu estado orixinal.
Axuste a propiedade DisplayMode da icona nesta fórmula:
```
If( Form1.Unsaved Or Form1.Mode = FormMode.New, DisplayMode.Edit, DisplayMode.Disabled )
```
Esta fórmula difire lixeiramente da icona Comprobar. A icona Cancelar está desactivada se se gardaron todos os cambios ou se o formulario está en modo Novo, que activará a continuación. Nese caso, ResetForm rexeita o novo rexistro.
Axuste a propiedade DisabledColor da icona Cancelar neste valor:
```
Gray
```
O usuario pode cancelar os cambios nun pedido e as iconas Comprobar e Cancelar desactívanse e escurécense se se gardaron todos os cambios:

Engadir unha icona Engadir

No separador Inserir, seleccione Iconas > Engadir.

Por defecto, a icona Engadir aparece na esquina superior esquerda, onde outros controis poden dificultar a súa busca:
No separador Inicio, estableza a propiedade Cor da icona Engadir en branca, redimensione a icona e móvaa á esquerda da icona Cancelar:
Axuste a propiedade OnSelect da icona Engadir nesta fórmula:
```
NewForm( Form1 )
```
A función NewForm mostra un rexistro en branco no formulario.
Axuste a propiedade DisplayMode da icona Engadir nesta fórmula:
```
If( Form1.Unsaved Or Form1.Mode = FormMode.New, DisplayMode.Disabled, DisplayMode.Edit )
```
A fórmula desactiva a icona Engadir nestas condicións:
- O usuario fai cambios pero non os garda nin os cancela, o que é o comportamento contrario das iconas Comprobar e Cancelar.
- O usuario selecciona a icona Engadir, pero non fai cambios.
Axuste a propiedade DisabledColor da icona Engadir neste valor:
```
Gray
```
O usuario pode crear un pedido se non realiza ningún cambio ou se garda ou cancela calquera cambio que faga. (Se o usuario selecciona esta icona, non poderá seleccionala de novo ata que realice un ou máis cambios e logo garde ou cancele eses cambios):

Nota

Se crea e garda un pedido, pode que necesite desprazarse cara abaixo na galería de pedidos para mostrar o seu novo pedido. Non terá un prezo total porque aínda non engadiu ningún dato de pedido.

Engadir unha icona Papeleira

No separador Inserir, seleccione Iconas > Papeleira.

Por defecto, a icona Papeleira aparece na esquina superior esquerda, onde outros controis poden dificultar a súa busca:
No separador Inicio, cambie a propiedade Cor da icona Papeleira a branca, redimensione a icona e móvaa á esquerda da icona Engadir:
Axuste a propiedade OnSelect da icona Papeleira nesta fórmula:
```
Remove( Orders, Gallery1.Selected )
```
A función Remove elimina un rexistro dunha orixe de datos. Nesta fórmula, a función elimina o rexistro seleccionado na galería de pedidos. A icona Papeleira aparece preto do formulario de resumo (non da galería de pedidos) porque o formulario mostra máis detalles acerca do rexistro, polo que o usuario pode identificar máis facilmente o rexistro que a fórmula eliminará.
Axuste a propiedade DisplayMode da icona Papeleira nesta fórmula:
```
If( Form1.Mode = FormMode.New, DisplayMode.Disabled, DisplayMode.Edit )
```
Esta fórmula desactiva a icona Papeleira se o usuario está a crear un rexistro. Ata que o usuario garde o rexistro, a función Remove non ten ningún rexistro para eliminar.
Axuste a propiedade DisabledColor da icona Papeleira neste valor:
```
Gray
```
O usuario pode eliminar un pedido.

Resumo

Para recapitular, engadiu un formulario no que o usuario pode mostrar e editar un resumo de cada pedido, e utilizou estes elementos:

Un formulario que mostra datos da táboa Pedidos: Form1.DataSource = Orders
Conexión entre o formulario e a galería de pedidos: Form1.Item = Gallery1.Selected
Control alternativo para o campo Número de pedido: Ver texto
Relación de varios a un para mostrar a imaxe do empregado no cartón de datos Empregado: DataCardValue1.Selected.Picture
Icona para gardar os cambios nun pedido: SubmitForm( Form1 )
Icona para cancelar os cambios nun pedido: ResetForm( Form1 )
Icona para crear un pedido: NewForm( Form1 )
Icona para eliminar un pedido: Remove( Orders, Gallery1.Selected )

Seguinte paso

No seguinte tema, engadirá outra galería para mostrar os produtos en cada pedido e cambiará eses detalles coa función Patch.

Crear a galería de detalles