適用場景:自行寫的小工具、系統監控介面、後台管理介面

主要是利用RowDefinition、ColumnDefinition、GridSplitter做到窗格分割
| AA (Grid.Row="0" Grid.Column="0") | AB (Grid.Row="0" Grid.Column="1") |
| BA (Grid.Row="1" Grid.Column="0") | BB (Grid.Row="1" Grid.Column="1") |
| CA (Grid.Row="2" Grid.Column="0") | CB (Grid.Row="2" Grid.Column="1") |
XAML:
<Window x:Class="Sample.MainWindow"
<!-- -->
Title="MainWindow" Height="990" Width="1760">
<Grid>
<Grid.RowDefinitions>
<RowDefinition x:Name="RowDef1" Height="300"/>
<RowDefinition x:Name="RowDef2" Height="350"/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition x:Name="ColumnDef" Width="750"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<GridSplitter Grid.Row="0" Grid.Column="0" Grid.RowSpan="3" HorizontalAlignment="Right" VerticalAlignment="Stretch" Width="6" Background="Blue"/>
<GridSplitter Grid.Row="0" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Bottom" Height="6" Background="Blue"/>
<GridSplitter Grid.Row="0" Grid.Column="1" HorizontalAlignment="Stretch" VerticalAlignment="Bottom" Height="6" Background="Blue"/>
<GridSplitter Grid.Row="1" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Bottom" Height="6" Background="Blue"/>
<GridSplitter Grid.Row="1" Grid.Column="1" HorizontalAlignment="Stretch" VerticalAlignment="Bottom" Height="6" Background="Blue"/>
<Border Grid.Row="0" Grid.Column="0" Margin="2">
<Grid Background="#FFE5E5E5" x:Name="GridAA">
<!-- 其他介面描述可以添加在此 -->
<StatusBar DockPanel.Dock="Bottom" VerticalAlignment="Bottom" Height="28">
<StatusBarItem>
<TextBlock x:Name="StatusBarItemAA1" Text="AA1"/>
</StatusBarItem>
<Separator/>
<StatusBarItem>
<TextBlock x:Name="StatusBarItemAA2" Text="AA2"/>
</StatusBarItem>
</StatusBar>
</Grid>
</Border>
<Border Grid.Row="1" Grid.Column="0" Margin="2">
<Grid Background="#FFE5E5E5" x:Name="GridBA">
<!-- 其他介面描述可以添加在此 -->
<StatusBar DockPanel.Dock="Bottom" VerticalAlignment="Bottom" Height="28">
<StatusBarItem>
<TextBlock x:Name="StatusBarItemBA1" Text="BA1"/>
</StatusBarItem>
<Separator/>
<StatusBarItem>
<TextBlock x:Name="StatusBarItemBA2" Text="BA2"/>
</StatusBarItem>
</StatusBar>
</Grid>
</Border>
<Border Grid.Row="2" Grid.Column="0" Margin="2">
<Grid Background="#FFE5E5E5" x:Name="GridCA">
<!-- 其他介面描述可以添加在此 -->
<StatusBar DockPanel.Dock="Bottom" VerticalAlignment="Bottom" Height="28">
<StatusBarItem>
<TextBlock x:Name="StatusBarItemCA1" Text="CA1"/>
</StatusBarItem>
<Separator/>
<StatusBarItem>
<TextBlock x:Name="StatusBarItemCA2" Text="CA2"/>
</StatusBarItem>
</StatusBar>
</Grid>
</Border>
<Border Grid.Row="0" Grid.Column="1" Margin="2">
<Grid Background="#FFE5E5E5" x:Name="GridAB">
<!-- 其他介面描述可以添加在此 -->
<StatusBar DockPanel.Dock="Bottom" VerticalAlignment="Bottom" Height="28">
<StatusBarItem>
<TextBlock x:Name="StatusBarItemAB1" Text="AB1"/>
</StatusBarItem>
<Separator/>
<StatusBarItem>
<TextBlock x:Name="StatusBarItemAB2" Text="AB2"/>
</StatusBarItem>
</StatusBar>
</Grid>
</Border>
<Border Grid.Row="1" Grid.Column="1" Margin="2">
<Grid Background="#FFE5E5E5" x:Name="GridBB">
<!-- 其他介面描述可以添加在此 -->
<StatusBar DockPanel.Dock="Bottom" VerticalAlignment="Bottom" Height="28">
<StatusBarItem>
<TextBlock x:Name="StatusBarItemBB1" Text="BB1"/>
</StatusBarItem>
<Separator/>
<StatusBarItem>
<TextBlock x:Name="StatusBarItemBB2" Text="BB2" Background="Pink"/>
</StatusBarItem>
</StatusBar>
</Grid>
</Border>
<Border Grid.Row="2" Grid.Column="1" Margin="2">
<Grid Background="#FFE5E5E5" x:Name="GridCB">
<!-- 其他介面描述可以添加在此 -->
<StatusBar DockPanel.Dock="Bottom" VerticalAlignment="Bottom" Height="28">
<StatusBarItem>
<TextBlock x:Name="StatusBarItemCB1" Text="CB1"/>
</StatusBarItem>
<Separator/>
<StatusBarItem>
<TextBlock x:Name="StatusBarItemCB2" Text="CB2" Background="Pink"/>
</StatusBarItem>
</StatusBar>
</Grid>
</Border>
</Grid>
</Window>
請先 登入 以發表留言。