El widget expandible es un contenedor de diseño que puede utilizar para organizar otros widgets en un menú apilado verticalmente con botones de expandir y contraer. Cada widget que coloque en un widget expandible se convierte en un encabezado con un estado expandido y contraído. Puede personalizar los encabezados, los botones de expandir y contraer, así como los paneles de widgets.
Ejemplos
Use este widget para apoyar los requisitos de diseño de la aplicación como por ejemplo los siguientes:
- Desea organizar elementos como texto, leyendas y listas de capas.
- Desea ahorrar espacio en las páginas de aplicaciones en las que no es necesario que todo el contenido esté visible al mismo tiempo.
- Desea mostrar titulares y permitir a los usuarios elegir si desean ampliar y ver más información.
Notas de uso
Al agregar un widget expandible, aparece el menú Estilo rápido. Puede elegir entre cuatro estilos predeterminados. Las principales diferencias entre los cuatro estilos son la forma y el contenido de los encabezados. Puede personalizar todos estos elementos en la configuración del widget.
Para agregar widgets al widget expandible, arrastre en él widgets del panel Insertar widget.
Para reordenar los widgets en el widget expandible, haga clic en ellos y arrástrelos por sus encabezados. También puede hacer clic en un widget y utilizar los botones Mover hacia abajo y Mover hacia arriba que aparecen en la barra de herramientas del widget.
Para eliminar un widget del widget expandible, haga clic en su cabecera y arrástrelo hacia fuera.
Para cambiar el icono y el nombre de un widget en el encabezado, seleccione el widget y cambie el icono y el nombre en la parte superior del panel de configuración del widget.
Configuración
El widget expandible incluye los siguientes ajustes:
- Diseño: estos ajustes afectan al espaciado de los elementos del encabezado, en relación con los demás y con los bordes del panel del widget expandible.
- Espacio: defina el espacio vertical entre los encabezados expresado en píxeles (px).
- Relleno: cambie el tamaño de los espacios de relleno, que son los espacios entre los encabezados y los bordes del panel del widget, ya sea todos a la vez o por separado. Puede especificar los valores de tamaño en píxeles (px).
- Configuración generales: incluye los ajustes relacionados con la expansión de los encabezados.
- Cuántos elementos se pueden expandir: elija si los usuarios pueden expandir solo uno o varios encabezados a la vez.
- Expandir elementos al cargar: si lo desea, elija uno o más widgets para que se expandan automáticamente cuando el widget se cargue por primera vez.
- Botones Expandir/contraer todos: agregue botones al panel del widget para expandir y contraer todos los encabezados.
- Encabezado: puede hacer clic en las tres partes diferentes del editor del encabezdo para revelar los ajustes relacionados con el fondo y el borde, el relleno y el contenido.
- Fondo y borde: modifique los ajustes relacionados con el fondo y el borde del encabezado.
- Fondo: elija colores de fondo que se mostrarán cuando los encabezados estén contraídos y cuando estén expandidos.
- Borde: cambie el color de relleno, el trazo y el tamaño del borde del encabezado en píxeles (px). Puede cambiar todos estos atributos para todo el borde o para los cuatro lados individualmente.
- Radio del borde: cambie la longitud de los radios de los bordes, todos a la vez o de forma independiente para las cuatro esquinas. Puede especificar los valores de radio en píxeles (px) o en forma de porcentaje (%). Establezca un radio mayor para que las esquinas del encabezado sean más redondeadas.
- Relleno:cambie el tamaño de los espacios de relleno, que son los espacios entre los cuatro bordes del encabezado y su contenido de la cabecera, todos a la vez o por separado. Puede especificar los valores en píxeles (px).
- Contenido: modifique los ajustes relacionados con el contenido de los encabezados.
- Icono: incluya iconos de widget en los encabezados. Puede cambiar el tamaño de los iconos y su color. Puede configurar los iconos de los widgets en la parte superior del panel de configuración de cada widget.
Nota:
Si carga iconos personalizados, es posible que no pueda cambiar su color con esta configuración.
- Texto: aplique formato de negrita, cursiva, tachado y subrayado al texto de los encabezados. También puede cambiar el color de la fuente y ajustar su tamaño en píxeles (px).
- Botones: establezca los iconos para el botón de expansión y el botón de contracción.
- Alternar posición: indique dónde desea colocar los botones de expansión y contracción: a la izquierda (Inicio) o a la derecha (Final) de cada encabezado.
- Icono: incluya iconos de widget en los encabezados. Puede cambiar el tamaño de los iconos y su color. Puede configurar los iconos de los widgets en la parte superior del panel de configuración de cada widget.
- Fondo y borde: modifique los ajustes relacionados con el fondo y el borde del encabezado.
- Panel: modifique los ajustes relacionados con los paneles de widgets, que son los paneles que se abren y cierran con los botones de expandir y contraer.
- Relleno: cambie el tamaño de los espacios de relleno, que son los espacios entre el contenido del widget y los cuatro bordes del panel del widget, ya sea todos a la vez o por separado. Puede especificar los valores de tamaño en píxeles (px).
- Relleno: elija un color para los paneles de widget.
- Borde: cambie el color de relleno, el trazo y el tamaño del borde del panel en píxeles (px). Puede cambiar todos estos atributos para todo el borde o para los cuatro lados individualmente.
- Radio del borde: cambie la longitud de los radios de los bordes, todos a la vez o de forma independiente para las cuatro esquinas. Puede especificar los valores de radio en píxeles (px) o en forma de porcentaje (%). Establezca un radio mayor para que las esquinas del panel sean más redondeadas.