2009-02-17 60 views
6

我刚刚开始使用2.0版的Silverlight。我想在页面上显示一些数据网格,并通过将每个数据网格放入网格单元格中来实现这一点。那么我想我会尝试使用下面的标记添加网格分流:Silverlight Grid Splitter意外的行为

<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> 

我希望能够拖动分离器来调整其他两列。当我拖动栏时,其他栏都缩小。谁能解释为什么?

回答

7

您不需要网格的中间栏。如果将分离器放在第0列中,则Gridsplitter将绑定到第0列的右边缘。可以在左边的网格中添加一个小的边距,以便不丢失最后5个像素。

<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

谢谢,那完美的作品。 – 2009-02-17 14:16:55

8

细胞在你所经历过的方式调整的原因是下到ColumnDefinition值和GridSplitterHorizontalAlignment。由于您尚未指定高度,因此列宽度默认为Star。这意味着它们具有相等的间距。然后指定其调整大小的方向。如果您居中或拉伸它,那么您将双方调整大小,但如果将它与一个边或另一个边对齐,则只会调整边的大小,但由于单元共享空间,所以两边缩小而不是一个。

虽然接受的答案提供了一种替代方法来实现这个工作,但实际上并没有解释问题出现的原因。在自己的电池中放置一个分光器是完全可以接受的 - 事实上,它通常是推荐的。

+0

感谢您的解释。它也解决了我的问题。 – beaudetious 2010-04-21 20:51:29