Control de contenedor de cuadrícula en Power Apps

El control contenedor Grid proporciona una manera de diseñar componentes secundarios en un patrón de cuadrícula. Obtiene un control preciso sobre dónde va cada componente en términos de filas y columnas.

Este contenedor funciona como cuadrículas de estilo CSS. Defina las filas y columnas y establezca la posición exacta de cada componente secundario mediante sus propiedades.

Description

El control contenedor Grid ofrece un sistema de diseño flexible para aplicaciones de lienzo. Le permite:

  • Colocar componentes secundarios en un patrón de cuadrícula
  • Especificar el inicio y la columna de fila y fin para cada elemento secundario
  • Realizar ajustes con capacidad de respuesta cuando cambia el tamaño de la pantalla o el contenedor
  • Alineación de control, espaciado y desbordamiento dentro de la cuadrícula

Con este enfoque, no es necesario colocar manualmente cada componente. Las aplicaciones se vuelven más fáciles de mantener y responder.

Display properties

  • Espacio : espaciado en píxeles entre componentes secundarios dentro de la cuadrícula.
  • Columnas : número de columnas en el diseño de cuadrícula.
  • Filas : número de filas en el diseño de cuadrícula.

Tamaño y posición

  • X : distancia horizontal desde el borde izquierdo del contenedor primario (o pantalla si no hay ningún elemento primario).
  • Y : distancia vertical desde el borde superior del contenedor primario (o pantalla si no hay ningún elemento primario).
  • Ancho : distancia entre los bordes izquierdo y derecho de un control.
  • Alto : distancia entre los bordes superior e inferior de un control.
  • Espaciado: espaciado entre los bordes del contenedor y sus componentes secundarios.

Color y borde

  • Color : color de primer plano del contenedor, que se usa para bordes y texto si procede.
  • Border
    • Estilo : tipo de borde: Sólido, Guión, Punto o Ninguno.
    • Grosor : ancho del borde en píxeles.
    • Color : color del borde.
  • Radio de borde : grado en el que se redondean las esquinas del contenedor. Puede aplicar esta configuración a todas las esquinas uniformemente o dividirla en esquinas individuales en la configuración avanzada.
  • Sombra de colocación : efecto de sombra aplicado al contenedor. Opciones: Ninguno, Claro, Medio o Pesado.

Visibility

  • Visible : indica si se muestra el contenedor de cuadrícula. Activar odesactivar.

Propiedades de diseño de cuadrícula (específicas del elemento secundario)

  • Inicio de columna/ Fin de columna : define las columnas iniciales y finales de un componente secundario.
  • Inicio de fila/Fin de fila : define las filas iniciales y finales de un componente secundario.

Example

  1. Cree una aplicación de lienzo en blanco desde cero con un diseño dinámico .

  2. Cree una nueva pantalla.

  3. En el panel Insertar en Diseño, seleccione Contenedor de cuadrícula.

  4. Establezca las propiedades del contenedor para ocupar la pantalla completa:

    • X = 0
    • Y = 0
    • Ancho = Parent.Width
    • Altura = Padre. Altura
  5. Agregue varios componentes secundarios, como botones, entradas de texto, iconos y medios. Para cada elemento secundario, establezca las propiedades de selección de ubicación de cuadrícula:

    • Inicio y finalización de columnas
    • Inicio y finalización de la fila
    • Alinear en celda
  6. Presione F5 para obtener una vista previa. Cambie el tamaño de la pantalla y observe cómo los componentes secundarios permanecen en sus posiciones de cuadrícula y ajustan la capacidad de respuesta.