Nota:
El acceso a esta página requiere autorización. Puede intentar iniciar sesión o cambiar directorios.
El acceso a esta página requiere autorización. Puede intentar cambiar los directorios.
Las tarjetas de datos son los bloques de construcción que permiten que los formularios funcionen en las aplicaciones de lienzo. En este artículo se muestra cómo personalizar las tarjetas para mostrar y recopilar datos exactamente cómo lo necesita.
Los controles Mostrar formulario y Editar formulario en aplicaciones de lienzo son contenedores para registros completos. Cada formulario tiene varios controles de tarjeta, que son los componentes fundamentales del formulario. Cada tarjeta muestra o permite editar un único campo del registro y está vinculada a ese campo a través de su propiedad DataField. El formulario muestra el registro completo y cada tarjeta se centra en un campo, por lo que se controla cómo se muestran o actualizan los datos.
Lo que aprenderá:
- Personalización de tarjetas de datos existentes
- Cómo desbloquear tarjetas para modificaciones avanzadas
- Cómo crear interacciones de tarjetas personalizadas
Requisitos previos: Si no está familiarizado con los formularios, empiece por leer agregar un formulario y comprender los formularios de datos.
Pruébelo: Cambiar un tipo de tarjeta
Puede intentar personalizar inmediatamente las tarjetas en cualquier aplicación. Power Apps ofrece tarjetas predefinidas para cadenas, números y otros tipos de datos.
Para cambiar una tarjeta:
- Abra la aplicación para editarla en Power Apps Studio.
- Seleccione un control de formulario en la vista de árbol.
- En el panel Propiedades , busque el campo que desea modificar.
- Seleccione la lista desplegable Tipo de tarjeta para ver las opciones disponibles.
En el panel derecho, verá los tipos disponibles y puede cambiar la tarjeta de un campo.
En este ejemplo, se selecciona una tarjeta de texto de una sola línea, pero el texto de la URL es más largo que lo que cabe en una sola línea. Cambie esta tarjeta a una tarjeta de texto de varias líneas para que los usuarios tengan más espacio para editar.
Algunos de los campos de este origen de datos no se muestran, pero puede mostrar u ocultar un campo seleccionando su casilla. En este ejemplo se muestra cómo mostrar el campo SecurityCode .
Personalizar una tarjeta
Las tarjetas contienen varios controles. En un control Editar formulario, el usuario escribe datos en un control Entrada de texto estándar que se agrega desde la pestaña Insertar.
En este artículo se explica cómo cambiar la apariencia de una tarjeta cambiando los controles en él.
Vuelva a la tarjeta que insertó más recientemente para el campo SecurityCode . Para seleccionar esta tarjeta, selecciónela una vez:
Seleccione el control Entrada de texto dentro de la tarjeta seleccionando el propio control de entrada.
Mueva el control dentro de la tarjeta arrastrando el cuadro de selección y redimensionándolo arrastrando los controladores a lo largo del borde del cuadro de selección.
Puede cambiar el tamaño, mover y realizar otras modificaciones en los controles de una tarjeta, pero no puede eliminar un control sin desbloquearlo primero.
Desbloquear una tarjeta
Además de contener controles, las tarjetas son controles con propiedades y fórmulas, que puede usar para la personalización avanzada. Al elegir mostrar un campo en un formulario, el panel derecho crea automáticamente la tarjeta y genera las fórmulas necesarias, lo que le ahorra tiempo y esfuerzo. Puede ver estas fórmulas en la pestaña Opciones avanzadas del panel derecho:
Inmediatamente vemos una de las propiedades más importantes de la tarjeta: la propiedad DataField. Esta propiedad indica qué campo del origen de datos puede ver y editar el usuario en esta tarjeta.
En la pestaña Avanzado, el banner que aparece en la parte superior indica que las propiedades de esta tarjeta están bloqueadas. También aparece un icono de bloqueo junto a las propiedades DataField, DisplayName y Required. El panel derecho fue el que creó estas fórmulas y el bloqueo impide que se realicen cambios accidentales en estas propiedades.
Seleccione la pancarta que aparece en la parte superior para desbloquear la tarjeta y poder modificar estas propiedades:
Modifique DisplayName para agregar un espacio entre Asset e ID. Al realizar este cambio, estás alterando lo que se generó para ti. En el panel derecho, esta tarjeta tiene una etiqueta distinta:
Ahora toma el control de esta tarjeta y puede modificarla aún más para satisfacer sus necesidades. Pero pierdes la capacidad de cambiar la tarjeta de una representación a otra (por ejemplo, de texto de una sola línea a texto de varias líneas), como antes podías. Has transformado la tarjeta predefinida en una "tarjeta personalizada" que ahora está bajo tu control.
Importante
Si ha desbloqueado una tarjeta, no podrá volver a bloquearla. Para volver al estado de bloqueo, quite la tarjeta y vuelva a insertarla en el panel derecho.
Puede cambiar la apariencia y el comportamiento de una tarjeta desbloqueada de varias formas como, por ejemplo, con la adición y eliminación de los controles dentro de ella. Por ejemplo, puede agregar una forma de estrella desde el menú Iconos de la pestaña Insertar.
La estrella es ahora una parte de la tarjeta y viaja con ella si, por ejemplo, reordena las tarjetas dentro del formulario.
Como otro ejemplo, desbloquee la tarjeta ImageURL y, a continuación, agregue un control Imagen en ella mediante la pestaña Insertar:
En la barra de fórmulas, establezca la propiedad Imagen de este control en TextBox.Text, en la que TextBox es el nombre del control Entrada de texto que contiene la URL:
Ahora ya podemos ver las imágenes y editar sus direcciones URL. Podría haber usado Parent.Default como la propiedad Image , pero no habría actualizado si el usuario cambió la dirección URL.
Puedes hacer lo mismo en la segunda pantalla de esta aplicación, donde usas un control Formulario de visualización para mostrar los detalles de un registro. En este caso, es posible que desee ocultar la etiqueta (establezca la propiedad Visible de la etiqueta, no la tarjeta, en false) porque el usuario no editará la dirección URL en esa pantalla:
Interactuar con un formulario
Después de desbloquear una tarjeta, puede cambiar la forma en que interactúa con el formulario que la contiene.
Más adelante se muestran directrices sobre cómo deben funcionar los controles con su tarjeta y cómo deben funcionar las tarjetas con el formulario. Estas directrices le ayudan a comprender cómo crear fórmulas que hagan referencia a otros controles, incluidas las tarjetas y los controles dentro de tarjetas. Ser creativo: puede crear una aplicación de muchas maneras para satisfacer sus necesidades específicas.
Propiedad DataField
La propiedad más importante de la tarjeta es DataField. Esta propiedad controla la validación, qué campo se actualiza y otros aspectos de la tarjeta.
Información que entra
Como contenedor, el formulario pone ThisItem a disposición de todas las tarjetas que incluye. Este registro contiene todos los campos del registro actual de interés.
Establezca la propiedad Default de cada tarjeta en ThisItem. FieldName. En algunos casos, puede transformar este valor a medida que entra. Por ejemplo, es posible que desee dar formato a una cadena o traducir el valor de un idioma a otro.
Cada control de la tarjeta debe hacer referencia a Parent.Default para obtener el valor del campo. Esta estrategia encapsula la tarjeta, lo que permite que la propiedad Default de la tarjeta cambie sin afectar a sus fórmulas internas.
De forma predeterminada, los metadatos del origen de datos establecen las propiedades DefaultValue y Required en función de la propiedad DataField . Puede reemplazar estas fórmulas con su propia lógica, integrando los metadatos del origen de datos mediante el uso de la función DataSourceInfo.
Información que sale
Después de que el usuario modifique un registro usando los controles de las tarjetas, la función SubmitForm guarda esos cambios en el origen de datos. Cuando se ejecuta esa función, el control de formulario lee los valores de la propiedad DataField de cada tarjeta para saber qué campo debe cambiar.
El control de formulario también lee el valor de la propiedad Update de cada tarjeta. Este valor se almacenará en el origen de datos para este campo. Este es el lugar para aplicar otra transformación, quizás para invertir la transformación que aplicó en la fórmula Predeterminada de la tarjeta.
La propiedad Valid se toma de los metadatos del origen de datos, basándose en la propiedad DataField. También depende de la propiedad Required y de si la propiedad Update contiene un valor. Si el valor de la propiedad Update no es válido, la propiedad Error proporciona un mensaje de error descriptivo.
Si la propiedad DataField de una tarjeta está en blanco, la tarjeta sencillamente es un contenedor de controles. Sus propiedades Valid y Update no participan cuando se envía el formulario.
Examinar un ejemplo
Vamos a explorar los controles que componen una tarjeta de entrada de datos básica. Se aumenta el espacio entre controles para mostrar cada uno más claramente, lo que le ayuda a comprender cómo cada componente contribuye a la funcionalidad de la tarjeta:
En este gráfico, los controles de la tarjeta de datos están etiquetados.
Cuatro controles hacen que esta tarjeta funcione:
| Nombre | Tipo | Descripción |
|---|---|---|
| TextRequiredStar | Control Label | Muestra una estrella, que se utiliza habitualmente en los formularios de entrada de datos para indicar que un campo es obligatorio. |
| TextFieldDisplayName | Control Label | Muestra el nombre descriptivo de este campo. Este nombre puede diferir de lo que aparece en el esquema del origen de datos. |
| InputText | Control Input text | Muestra el valor inicial del campo y permite al usuario cambiar dicho valor. |
| TextErrorMessage | Control Label | Muestra un mensaje de error descriptivo al usuario si se produce un problema con la validación. También garantiza que el campo tiene un valor si es necesario. |
Para rellenar estos controles con datos, se pueden tomar sus propiedades de las propiedades de la tarjeta a través de estas fórmulas claves. Las fórmulas se refieren a un campo específico. En su lugar, toda la información procede de la tarjeta.
| Propiedad de control | Fórmula | Descripción |
|---|---|---|
| TextRequiredStar.Visible | Parent.Required | La estrella solo aparece si el campo es obligatorio. Se requiere una fórmula que usted establezca o los metadatos del origen de datos. |
| TextFieldDisplayName.Text | Parent.DisplayName | El control de cuadro de texto muestra el nombre descriptivo, proporcionado por usted o los metadatos del origen de datos, y que se establece en la propiedad DisplayName de la tarjeta. |
| InputText.Default | Parent.Default | Inicialmente, el control de entrada de texto muestra el valor del campo del origen de datos, según lo proporcionado por el valor predeterminado de la tarjeta. |
| TextErrorMessage.Text | Parent.Error | Si se produce un problema de validación, la propiedad Error de la tarjeta proporciona el correspondiente mensaje de error. |
Nota
La propiedad Parent.Error es una propiedad de solo salida que no se puede establecer mediante una fórmula. Esta propiedad no aparecerá en la lista de propiedades cerca de la esquina superior izquierda o en las pestañas Propiedades o Avanzado cerca del borde derecho. La barra de fórmulas sugiere esta propiedad si está escribiendo una fórmula que podría hacer referencia a la propiedad.
Para extraer información de estos controles y volver a insertarla en el origen de datos, tenemos las siguientes fórmulas clave:
| Nombre del control | Fórmula | Descripción |
|---|---|---|
| DataCard.DataField | "ApproverEmail" | El nombre del campo que el usuario puede mostrar y editar en esta tarjeta. |
| DataCard.Update | InputText.Text | El valor que se valida y se vuelve a insertar en el origen de datos cuando se ejecuta SubmitForm. |