WPF学习总结和记录(九)-Grid仿VS的界面

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/fffanpei/article/details/8778824

XAML源码

 

<Window x:Class="WPF012_Grid_.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <ScrollViewer Visibility="Visible">
    <Grid Background="LightBlue">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
        </Grid.RowDefinitions>
       
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>
       
        <Label Grid.ColumnSpan="2" Grid.Row="0" Grid.Column="0" Background="Blue" Foreground="White" HorizontalContentAlignment="Center">start page</Label>
        <GroupBox Grid.Row="1" Grid.Column="0" Background="White" Header="recent project">_</GroupBox>
        <GroupBox Grid.Row="2" Grid.Column="0" Background="White" Header="Getting started">_</GroupBox>
        <GroupBox Grid.Row="3" Grid.Column="0" Background="White" Header="Headlines">_</GroupBox>

        <GroupBox Grid.RowSpan="3" Grid.Row="1" Grid.Column="1" Background="White" Header="Online Articles">
            <ListBox>
                <ListBoxItem>Article #1</ListBoxItem>
                <ListBoxItem>Article #2</ListBoxItem>
                <ListBoxItem>Article #3</ListBoxItem>
            </ListBox>
        </GroupBox>
        </Grid>
    </ScrollViewer>
</Window>

效果图

 

使用grid首先定义RowDefinitions和ColumnDefinitions,定义行数和列数。

使用Row和Column来定义元素,从0开始。

 

可是使用RowSpan和ColumnSpan来跨行和跨列。

如程序Grid.RowSpan = “3” 和 Grid.ColumnSpan = "2"

 

可以设置自动尺寸监控。

如<RowDefinition Height = “Auto” />

 

 

展开阅读全文

没有更多推荐了,返回首页