2009-02-17 23 views
6

Estoy empezando en Silverlight con la versión 2.0. Quería mostrar algunas cuadrículas de datos en la página y hacer que esto funcionara bien al colocar cada una en una celda de la grilla. entonces yo pensaba que iba a intentar añadir un separador de rejilla mediante el siguiente marcado:Silverlight Grid Splitter Comportamiento inesperado

<UserControl xmlns:basics="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls" xmlns:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data" x:Class="SilverlightApplication1.Page" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
Loaded="UserControl_Loaded"> 
    <Grid x:Name="LayoutRoot" Background="White"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition></ColumnDefinition> 
      <ColumnDefinition Width="Auto"></ColumnDefinition> 
      <ColumnDefinition></ColumnDefinition> 
     </Grid.ColumnDefinitions> 
     <Grid.RowDefinitions> 
      <RowDefinition></RowDefinition> 
      <RowDefinition></RowDefinition> 
     </Grid.RowDefinitions> 
     <basics:GridSplitter Grid.RowSpan="2" Grid.Row="0" Grid.Column="1" HorizontalAlignment="Left" Width="5" VerticalAlignment="Stretch" ></basics:GridSplitter> 
     <data:DataGrid Name="TLGrid" Grid.Row="0" Grid.Column="0"> 
     </data:DataGrid> 
     <data:DataGrid Name="TRGrid" Grid.Row="0" Grid.Column="2"> 
     </data:DataGrid> 
     <data:DataGrid Name="BLGrid" Grid.Row="1" Grid.Column="0"> 
     </data:DataGrid> 
     <data:DataGrid Name="BRGrid" Grid.Row="1" Grid.Column="2"> 
     </data:DataGrid> 
    </Grid> 
</UserControl> 

que esperaba para ser capaz de arrastrar el divisor en torno a cambiar el tamaño de las otras dos columnas. Cuando arrastro la barra, las otras columnas se encogen. ¿Alguien puede explicar por qué?

Respuesta

7

No necesita la columna central para el divisor de grillas. El divisor de cuadrícula se vinculará al borde derecho de la columna 0 si coloca el divisor en la columna 0. Puede agregar un pequeño margen a las cuadrículas en el lado izquierdo para que no pierda los últimos 5 píxeles.

<Grid x:Name="LayoutRoot" Background="White"> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="1*"/> 
     <!--<ColumnDefinition Width="Auto"/>--> 
     <ColumnDefinition Width="1*"/> 
    </Grid.ColumnDefinitions> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="1*"/> 
     <RowDefinition Height="1*"/> 
    </Grid.RowDefinitions> 

    <data:DataGrid Name="TLGrid" Grid.Row="0" Grid.Column="0" /> 
    <data:DataGrid Name="BLGrid" Grid.Row="1" Grid.Column="0"/> 

    <!-- Moved the grid splitter to column 0 --> 
    <basics:GridSplitter Grid.RowSpan="2" Grid.Row="0" Grid.Column="0" Width="5" /> 

    <data:DataGrid Name="TRGrid" Grid.Row="0" Grid.Column="2" /> 
    <data:DataGrid Name="BRGrid" Grid.Row="1" Grid.Column="2" />   
</Grid> 
+0

Gracias, eso funciona a la perfección. –

8

La razón por la que las células cambian de tamaño en la forma que ha experimentado se debe a los valores y la ColumnDefinitionHorizontalAlignment del GridSplitter. Como no ha especificado una altura, el ancho de las columnas es por defecto Star. Esto significa que tienen espaciamiento igual. El GridSplitterHorizontalAlignment luego especifica en qué dirección cambia el tamaño. Si lo centra o estira, obtendrá un cambio de tamaño en ambos lados, pero si lo alinea en un borde u otro, solo cambiará el tamaño de ese borde, pero debido a que las celdas comparten el espacio por igual, ambos lados se contraen en lugar de uno solo.

Aunque la respuesta aceptada proporciona un enfoque alternativo para que funcione, en realidad no explica por qué ocurre el problema. Es perfectamente aceptable colocar un divisor en sus propias celdas; de hecho, a menudo se lo recomienda.

+0

Gracias por la explicación. También resolvió mi problema. – beaudetious

+0

@beaudetious: me alegro de poder ayudar. :) –

Cuestiones relacionadas