2010-07-09 18 views
74

Soy muy nuevo en WPF. Me utilizan los formularios de Windows, creo un panel, coloco controles dentro de él y les doy DockStyle.Fill para maximizar su tamaño en el panel circundante.Cómo usar DockStyle.Fill para controles estándar en WPF?

En WPF Quiero tener lo mismo. Tengo un control de pestañas y quiero que su tamaño complete la mayor cantidad de la forma posible. Tengo un control de cinta (RibbonControlsLibrary) y quiero que el resto del formulario se rellene con el control de pestaña en el tamaño máximo.

(no quiero para atracar controles como soporte en Visual Studio, sólo viejos mecanismos de acoplamiento)

Respuesta

157

El equivalente de WPF WinForms DockStyle.Fill es:

HorizontalAlignment="Stretch" VerticalAlignment="Stretch" 

Este es el valor por defecto para casi controles, por lo , en general, usted no tiene que hacer nada para tener un control WPF llene su contenedor principal: Lo hacen de forma automática. Esto es cierto para todos los contenedores que no exprimen a sus hijos al tamaño mínimo.

errores comunes

Ahora voy a explicar algunos errores comunes que impiden HorizontalAlignment="Stretch" VerticalAlignment="Stretch" de trabajar como se esperaba.

1. explícita alto o ancho

Un error común es especificar explícitamente una anchura o altura para un control. Así que si usted tiene esto:

<Grid> 
    <Button Content="Why am I not filling the window?" Width="200" Height="20" /> 
    ... 
</Grid> 

Basta con retirar la atributos de anchura y altura:

<Grid> 
    <Button Content="Ahhh... problem solved" /> 
    ... 
</Grid> 

2. panel que contiene aprieta control al mínimo

Otro error común es tener la que contiene el panel apretando tu control tan fuerte como sea posible.Por ejemplo, un StackPanel vertical, siempre va a exprimir su contenido verticalmente tan pequeño como van a ir:

<StackPanel> 
    <Button Content="Why am I squished flat?" /> 
</StackPanel> 

cambio a otro panel y usted será bueno para ir:

<DockPanel> 
    <Button Content="I am no longer squished." /> 
</DockPanel> 

Además, cualquier fila de la cuadrícula o la columna cuya altura es "Auto" comprimirá su contenido de manera similar en esa dirección.

Algunos ejemplos de envases que no aprieten sus hijos son:

  • ContentControls No presionar a sus hijos (esto incluye Frontera, Button, CheckBox ScrollViewer, y muchos otros)
  • cuadrícula con una sola fila y columna
  • cuadrícula con "*" filas y columnas de tamaño
  • DockPanel no exprime su último hijo
  • TabControl no exprimir su contenido

Algunos ejemplos de envases que exprimir sus hijos son:

  • StackPanel se contrae en su dirección de orientación
  • cuadrícula con un "Auto" fila de tamaño o columna aprieta en esa dirección
  • DockPanel aprieta todo menos su último hijo en su dirección de base
  • TabControl comprime su encabezado (lo que se muestra en la pestaña)

3. Altura explícita o Ancho más lejos

Es sorprendente cuántas veces veo cuadrícula o DockPanel les da la altura y la anchura explícita, así:

<Grid Width="200" Height="100"> 
    <Button Content="I am unnecessarily constrainted by my containing panel" /> 
</Grid> 

En general nunca se quiere otorgar a cualquier Panel un Alto o Ancho explícito. Mi primer paso al diagnosticar problemas de diseño es eliminar cada alto o ancho explícito que puedo encontrar.

4. Ventana es SizeToContent cuando no debería ser

Cuando se utiliza SizeToContent, su contenido será extraída al mínimo. En muchas aplicaciones, esto es muy útil y es la elección correcta. Pero si su contenido no tiene un tamaño "natural", es probable que desee omitir SizeToContent.

+0

Dejé una [pregunta relacionada con el diseño nuevo] bastante compleja aquí (http://stackoverflow.com/questions/3326623/multiple-grid-layout-wpf). Después de leer tu respuesta, estoy pensando que puedes resolverlo. Cheers – Berryl

+5

¡Excelente respuesta! Ojalá pudiera darte puntos de bonificación de alguna manera. :) –

+0

@Jim Raden: Puede agregar una recompensa a esta pregunta y asignar los puntos a Ray Burns;) – citronas

4

acaba de envolver sus controles en una cuadrícula con dos filas. La grilla usará automáticamente todo el espacio que se le haya asignado y podrá definir las filas para ocupar todo el espacio que quede al darles una altura de "*". La primera fila en mi ejemplo (Height = "Auto") ocupará tanto espacio como necesite la cinta. Espero que ayude.

<Grid> 
    <Grid.RowDefinitions> 
    <RowDefinition Height="Auto" /> 
    <RowDefinition Height="*" /> 
    </Grid.RowDefinitions> 

    <Ribbon Grid.Row="0" /> 

    <TabPage Grid.Row="1" /> 
</Grid> 

Al añadir el atributo "Grid.Row = .." a los controles secundarios de la red que se asignan a las filas de la cuadrícula. Entonces la grilla dimensionará sus hijos según lo definen las definiciones de fila.

+0

Entra en la dirección correcta, gracias. Logré insertar la Grilla, pero ahora necesito decirle a TabControl que debería usar todo el tamaño que todavía está disponible? ¿Cómo puedo lograr eso? – citronas

+0

Debe agregar el atributo "Grid.Row" para TabControl y otorgar a la definición de fila correspondiente una altura de "*", tal como se muestra en el ejemplo. – andyp

6

Puede hacer lo que quiera con solo decir DockPanelLastChildFill="True" y luego asegurarse de que el que desea ser el rellenador sea en realidad el último hijo.

La cuadrícula es la bestia de un diseño que puede hacer casi cualquier cosa, pero el DockPanel suele ser la elección correcta para su panel de diseño más externo. Este es un ejemplo psuedocode:

<DockPanel LastChildFill="True"> 
    <MyMenuBar DockPanel.Dock="Top"/> 
    <MyStatus DockPanel.Dock="Bottom"/> 

    <MyFillingTabControl /> 
</DockPanel> 
+0

gracias por su ayuda – citronas

0

He intentado muchos métodos aquí pero no puedo resolver mi problema.(Llenar otro control en el control)

hasta que encontré it

<Name_Control Height="auto" Width="auto"/> 
//default 
//HorizontalAlignment="Stretch" 
//VerticalAlignment="Stretch" 

Ejemplo:

//UserControl: 
<UserControl Name="UC_Test" Height="auto" Width="auto" /> 
//Grid: 
<Grid Name="Grid_test" Grid.ColumnSpan="2" Grid.Row="2" /> 
//Code: 
Grid_test.Children.Add(UC_Test); 

para diseñar fácilmente

<UserControl Name="UC_Test" Height="100" Width="100" /> 
//Code 
Grid_test.Children.Add(UC_Test); 
UC_Test.Width = Double.NaN; 
UC_Test.Height = Double.NaN; 
Cuestiones relacionadas