WPF, ¡Obtención de la verticalstretch funcionando como se esperaba!

Question

Estoy tratando de hacer que el estiramiento vertical funcione como se esperaba en WPF, pero por alguna razón solo toma el espacio que necesita y no el espacio disponible.

Primero, estoy usando WPF con C# y Prisma.

En Shell.xaml (xaml principal para la aplicación) tengo una cuadrícula con 2 columnas y una fila. La idea es tener un panel lateral y un área de aplicación principal. La cuadrícula del área de la aplicación principal está configurada en Ancho automático y Altura automática. Esto funciona como se esperaba, y escala para ajustarse a toda la aplicación en Alto y Ancho.

Luego estoy usando prisma para insertar la vista (como un componente UserControl) en el área principal de la aplicación. UserControl también se establece en Ancho y alto automáticos, y al observar los ajustes predeterminados en Expression Blend, ¡HorizontalAlignment y VerticalAlignment se establecen en stretch!

Sin embargo, el UserControl cargado con prismas solo se extiende en ancho y no en altura. Al darle un color de fondo para la retroalimentación visual, puedo ver que solo toma el espacio vertical según sea necesario, ¡y no toda el área disponible!

¿Cuál podría ser la solución para esto? He intentado ir a través de todos los ajustes y anularlos manualmente a Anchura y Altura Auto, Alineación Horizontal y Vertical a Estirar, pero nada parece funcionar como se esperaba!

Algunos código: (Shell.xaml)

<Window Height="1140" Width="1450"> 
    <Grid Margin="0" Background="White"> 
     <Grid> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="250" /> 
       <ColumnDefinition Width="*" /> 
      </Grid.ColumnDefinitions> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="*" /> 
      </Grid.RowDefinitions> 
      <Grid Background="#FFEEEEEE" Grid.Column="0" Grid.Row="0"> 
      </Grid>   
      <ItemsControl Width="Auto" Height="Auto" Grid.Row="0" Grid.Column="1" Name="MainRegion" cal:RegionManager.RegionName="MainRegion" Padding="10" Margin="10, 0, 0, 0" Background="#FFFFFFD5" /> 
     </Grid> 
    </Grid> 
</Window> 

(opinión de que debería heredar la altura de los padres):

<UserControl Width="Auto" Height="Auto" Background="Red" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"> 
    <!-- I want this to take the full width and height of the parent --> 
</UserControl> 

Así que este es un limitaion en la forma de las vistas se cargan en la xaml principal, o es esta una limitación de UserControl, o algo más que no entiendo?

Solo para aclarar; Veo el color de fondo de ItemsControl definido en Shell.xaml que se extiende horizontal y verticalmente, pero no el fondo de la vista cargada en ItemsControl.

¡Tenga en cuenta que he eliminado algunos de los xaml para hacer que el punto sea más fácil de entender!

Gracias!

Answer 1

Encontré una solución. Tengo que anular la plantilla ItemsPanel utilizar una cuadrícula (o recipiente similar):

<ItemsControl> 
    <ItemsControl.ItemsPanel> 
    <ItemsPanelTemplate> 
     <Grid/> 
    </ItemsPanelTemplate> 
    </ItemsControl.ItemsPanel> 
</ItemsControl> 

también en este caso he eliminado algunos de los xaml para que sea más readble!

Gracias

Answer 2

Ha intentado establecer HorizontalContentAlignment y VerticalContentAlignment de estiramiento en la ItemsControl?

Answer 3

El valor predeterminado para ItemsControl.ItemsPanelTemplate es StackPanel, que comprime la totalidad de sus niños dando verticalmente los síntomas que usted describe.

La solución code-zoop dio los cambios esto a <Grid>. Esto funcionará bien siempre que haya solo una vista en la región.Pero si la región tiene más de una vista, se colocarán una sobre otra en lugar de estar una junto a la otra.

Si desea una región que puede manejar múltiples puntos de vista, pero permiten vistas a estirar al tamaño total de la región, utilice un DockPanel lugar:

<ItemsControl> 
    <ItemsControl.ItemsPanel> 
    <ItemsPanelTemplate> 
     <DockPanel /> 
    </ItemsPanelTemplate> 
    </ItemsControl.ItemsPanel> 
</ItemsControl> 

Esto pondrá la primera vista en un panel sobre la lado izquierdo, el siguiente al lado, y así sucesivamente hasta la última vista que llenará todo el espacio restante.

Si usted prefiere tener las vistas múltiples se apilan verticalmente como lo hicieron con StackPanel, que tendrá que poner esto en marcha en ItemContainerStyle:

<ItemsControl> 
    <ItemsControl.ItemsPanel> 
    <ItemsPanelTemplate> 
     <DockPanel /> 
    </ItemsPanelTemplate> 
    </ItemsControl.ItemsPanel> 
    <ItemsControl.ItemContainerStyle> 
    <Style> 
     <Setter Property="DockPanel.Dock" Value="Top" /> 
    </Style> 
    </ItemsControl.ItemContainerStyle> 
</ItemsControl>