2009-02-17 61 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