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

GridSplitter.jpg

主要是利用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>

創作者介紹
創作者 GNAySolution 的頭像
Yang

GNAySolution

Yang 發表在 痞客邦 留言(0) 人氣( 3 )