WPF页面基础布局源码实例

首次发布:2025-12-11

效果图

WPF页面基础布局效果图

<Window x:Class="WpfApp1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp1"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <!--分成两列,第一列200像素,第二列自适应剩余宽度-->
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="200"/>
            <ColumnDefinition Width="1*"/>
        </Grid.ColumnDefinitions>
        <!--第一列-->
        <Grid Grid.Column="0"
                Width="200"
                Background="Gray">
            <TextBlock Text="左侧"></TextBlock>
        </Grid>
        <!--第二列里面又分两行-->
        <Grid Grid.Column="1">
            <!--分成两行,第一行高80像素,第二行自适应剩余高度-->
            <Grid.RowDefinitions>
                <RowDefinition Height="80"/>
                <RowDefinition Height="1*"/>
            </Grid.RowDefinitions>
            <!--第二列里面的第一行-->
            <Grid Grid.Row="0" Background="Green">
                <TextBlock Text="右侧上方"></TextBlock>
            </Grid>
            <!--第二列里面的第二行-->
            <Grid Grid.Row="1">
                <TextBlock Text="右侧内容"></TextBlock>
            </Grid>
        </Grid>
    </Grid>
</Window>

本文来自 www.luofenming.com