前往
大廳
主題

將視窗拆成1+2*3的窗格

Yang | 2022-08-26 10:41:03 | 巴幣 0 | 人氣 200

接續之前"將視窗拆成2*3的窗格",要在上面多一行Menu沒想到有點複雜,設定上有些眉角,一點小錯就可能讓排版走位

關鍵在把視窗切割成2*4,再把上面2格合併,配置給Menu
Menu (Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2")
AA (Grid.Row="1" Grid.Column="0") AB (Grid.Row="1" Grid.Column="1")
BA (Grid.Row="2" Grid.Column="0") BB (Grid.Row="2" Grid.Column="1")
CA (Grid.Row="3" Grid.Column="0") CB (Grid.Row="3" Grid.Column="1")

XAML:
<Grid>
    <Grid.RowDefinitions>
        <RowDefinition x:Name="RowDef0" Height="20"/>
        <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>
    <DockPanel Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2">
        <Menu DockPanel.Dock="Top">
            <MenuItem Header="_File">
                <MenuItem x:Name="MenuItemExit" Header="E_xit" InputGestureText="Alt+F4" Click="MenuItemExit_Click"/>
            </MenuItem>
        </Menu>
    </DockPanel>
    <GridSplitter Grid.Row="1" Grid.Column="0" Grid.RowSpan="3" HorizontalAlignment="Right" VerticalAlignment="Stretch" Width="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"/>
    <GridSplitter Grid.Row="2" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Bottom" Height="6" Background="Blue"/>
    <GridSplitter Grid.Row="2" Grid.Column="1" HorizontalAlignment="Stretch" VerticalAlignment="Bottom" Height="6" Background="Blue"/>
    <Border Grid.Row="1" 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="2" 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="3" 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="1" 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="2" 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="3" 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>

MenuItem的設計和程式的結束事件(MenuItemExit_Click)也有需要小心的地方,這部分之後補充
送禮物贊助創作者 !
0
留言

創作回應

更多創作