Cómo: Crear un diseño dinámico
WPF Designer for Visual Studio proporciona muchos controles Panel que admiten la posición dinámica. Los controles de panel se pueden combinar agregando un control de panel como elemento secundario de otro control. Puede usar los siguientes controles de panel para colocar los elementos en sus aplicaciones dinámicamente:
Grid define un área donde puede colocar los elementos secundarios en filas y columnas. StackPanel y WrapPanel colocan automáticamente los elementos secundarios en filas o columnas. DockPanel coloca automáticamente los elementos secundarios a lo largo de los bordes. Para obtener información acerca de los distintos tipos de paneles, vea Diseño con posición absoluta y dinámica.
Importante |
---|
Siempre que sea posible, es preferible usar un diseño dinámico. Los diseños dinámicos son los más flexibles, se adaptan a los cambios realizados en el contenido, por ejemplo, cuando se localizan y permiten que el usuario final pueda controlar al máximo el entorno. Para ver un ejemplo de un diseño absoluto, vea Cómo: Crear un diseño basándose en la posición absoluta. |
Establecer las propiedades de la ventana para obtener un comportamiento dinámico
Cuando cree una nueva ventana, podrá establecer propiedades para maximizar la flexibilidad de un diseño dinámico.
Para establecer las propiedades de la ventana para obtener un comportamiento dinámico
En la Vista de diseño, seleccione la ventana.
En la ventana Propiedades, defina las propiedades siguientes para Window:
Propiedad
Valor
Efecto
Esto permite al usuario cambiar el tamaño de la ventana para dejar más espacio para los controles.
Esto permite cambiar automáticamente el tamaño de la ventana cuando su contenido se expande.
Establecer las propiedades del panel para obtener un comportamiento dinámico
Al agregar un nuevo panel (como Grid, DockPanel o StackPanel) a una ventana, o a otro panel, puede establecer propiedades con el fin de maximizar la flexibilidad de un diseño dinámico.
Para establecer las propiedades del panel para obtener un comportamiento dinámico
En la Vista de diseño, seleccione el panel.
En la ventana Propiedades, establezca las siguientes propiedades de Panel:
Propiedad
Valor
Efecto
Auto
El panel se ajusta para rellenar el ancho de la ventana o panel primarios.
Automático
El panel se ajusta para rellenar el alto de la ventana o panel primarios.
Establecer las propiedades de la cuadrícula para obtener un comportamiento dinámico
Puede usar el ajuste del tamaño Automático o mediante asterisco para facilitar la creación de cuadrículas que se dimensionen dinámicamente en función de su contenido. El ajuste del tamaño Automático se usa para que los controles se ajusten a su contenido, incluso si el contenido cambia de tamaño. El ajuste de tamaño mediante asterisco se usa para distribuir el espacio disponible en proporciones ponderadas. Para obtener más información, vea Star.
Si usa la Vista de diseño para crear nuevas filas y columnas, éstas se crearán con el ajuste de tamaño Star de forma predeterminada. Para obtener más información, vea Cómo: Agregar filas y columnas a una cuadrícula.
Sugerencia |
---|
Es posible que le resulte más fácil agregar filas y columnas en el Editor de colecciones y, a continuación, establecer los altos de fila y los anchos de columna en el editor de XAML. |
Para establecer las propiedades de la cuadrícula para obtener un comportamiento dinámico
En la Vista de diseño, seleccione la cuadrícula.
En la ventana Propiedades, busque la propiedad ColumnDefinitions y haga clic en el botón de puntos suspensivos en la columna de valores de propiedad.
Aparecerá el Editor de colecciones.
Seleccione o agregue una nueva definición de columna.
Use el ajuste del tamaño Automático o mediante asterisco para establecer los anchos de columna para obtener una flexibilidad máxima.
Haga clic en Aceptar para cerrar el Editor de colecciones y volver a WPF Designer.
Nota
Las columnas cuya propiedad Width está establecida en Automático se ocultan temporalmente porque no tienen ningún contenido. Para evitar esto, puede usar el ajuste del tamaño mediante asterisco mientras trabaja y cambiar a Automático cuando haya terminado.
En la ventana Propiedades, busque la propiedad RowDefinitions y haga clic en el botón de puntos suspensivos en la columna de valores de propiedad.
Aparecerá el Editor de colecciones.
Seleccione o agregue una nueva definición de fila.
Use el ajuste del tamaño Automático o mediante asterisco para establecer los altos de fila para obtener una flexibilidad máxima.
Haga clic en Aceptar para cerrar el Editor de colecciones y volver a WPF Designer.
Nota
Las filas cuya propiedad Height está establecida en Automático se ocultan temporalmente porque no tienen ningún contenido. Para evitar esto, puede usar el ajuste del tamaño mediante asterisco mientras trabaja y cambiar a Automático cuando haya terminado.
Establecer las propiedades del control para obtener un comportamiento dinámico
Al agregar un nuevo control a una ventana o panel, puede establecer propiedades para maximizar la flexibilidad de un diseño dinámico. Debe evitar establecer tamaños concretos para los controles con el fin de asegurarse de que los controles cambiarán de tamaño dinámicamente cuando la ventana o el contenido cambien.
Para establecer las propiedades del control para obtener un comportamiento dinámico
En la Vista de diseño, seleccione un control.
En la ventana Propiedades, defina las siguientes propiedades para el control:
Propiedad
Valor
Efecto
Auto
El control se expande horizontalmente para ajustar su contenido.
Auto
El control se expande verticalmente para ajustar su contenido.
0
El control se puede reducir horizontalmente cuanto sea necesario.
0
El control se puede reducir verticalmente cuanto sea necesario.
Infinity
El control se puede expandir horizontalmente cuanto sea necesario.
Infinity
El control se puede expandir verticalmente cuanto sea necesario.
Nota
Los valores que se muestran son los valores predeterminados.
Vea también
Tareas
Tutorial: Crear un diseño dinámico
Conceptos
Información general sobre WPF y Silverlight Designer