WPF 启动项目 Grid、StackPanel 布局

WPF 启动项目



<Application x:Class="WPF_Study.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:local="clr-namespace:WPF_Study"
             StartupUri="MainWindow.xaml">
    
    
    <Application.Resources>
         
    Application.Resources>
Application>

1
2
3
4
5
6
7
8
9
10
11
12
13
14

<!--x:Class="WPF_Study.App"  对应类：WPF_Study.App-->
<!--xmlns:local="clr-namespace:WPF_Study"  命名空间：WPF_Study-->
<!--StartupUri="MainWindow.xaml"  启动界面：MainWindow.xaml-->
1
2
3

Grid布局

<Window x:Class="WPF_Study.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:WPF_Study"
        mc:Ignorable="d"
        Title="WPF入门" Height="600" Width="800">
    <Grid>
        <Button HorizontalAlignment="Left" VerticalAlignment="Top" Width="200" Height="40" Content="你好"/>
        <Button HorizontalAlignment="Right" VerticalAlignment="Top" Width="200" Height="40" Content="你好"/>
        <Button HorizontalAlignment="Center" VerticalAlignment="Top" Width="200" Height="40" Content="你好"/>

        <Button HorizontalAlignment="Left" VerticalAlignment="Center" Width="200" Height="40" Content="你好"/>
        <Button HorizontalAlignment="Right" VerticalAlignment="Center" Width="200" Height="40" Content="你好"/>
        <Button HorizontalAlignment="Center" VerticalAlignment="Center" Width="200" Height="40" Content="你好"/>

        <Button HorizontalAlignment="Left" VerticalAlignment="Bottom" Width="200" Height="40" Content="你好"/>
        <Button HorizontalAlignment="Right" VerticalAlignment="Bottom" Width="200" Height="40" Content="你好"/>
        <Button HorizontalAlignment="Center" VerticalAlignment="Bottom" Width="200" Height="40" Content="你好"/>
    Grid>
Window>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

模拟布局

在这里插入图片描述

<Window x:Class="WPF_Study.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:WPF_Study"
        mc:Ignorable="d"
        Title="WPF入门" Height="600" Width="800">
    <Grid ShowGridLines="True" Background="DimGray">
        <Grid.RowDefinitions>
            <RowDefinition Height="20"/>
            <RowDefinition Height="20"/>
            <RowDefinition/>
            <RowDefinition Height="20"/>
        Grid.RowDefinitions>

        <StackPanel Grid.Row="0" Grid.Column="0" Orientation="Horizontal">
            <Button Content="‡文件" Width="70" Height="20"/>
            <Button Content="编辑" Width="70" Height="20"/>
            <Button Content="查看" Width="70" Height="20"/>

            <Button Content="外观" Width="70" Height="20"/>
            <Button Content="设置" Width="70" Height="20"/>
            <Button Content="帮助" Width="70" Height="20"/>
        StackPanel>

        <StackPanel Grid.Row="1" Grid.Column="0" Orientation="Horizontal">
            <Button Content="‡1" Width="20" Height="20"/>
            <Button Content="2" Width="20" Height="20"/>
            <Button Content="3" Width="20" Height="20"/>

            <Button Content="4" Width="20" Height="20"/>
            <Button Content="5" Width="20" Height="20"/>
            <Button Content="6" Width="20" Height="20"/>
        StackPanel>

        <Grid Background="Gray" Grid.Row="2" Grid.Column="0">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="70"/>
                <ColumnDefinition/>
            Grid.ColumnDefinitions>

            <StackPanel Grid.Row="0" Grid.Column="0">
                <Button Height="20" Content="1"/>
                <Button Height="20" Content="2"/>
                <Button Height="20" Content="3"/>
                <Button Height="20" Content="4"/>
                <Button Height="20" Content="5"/>
                <Button Height="20" Content="6"/>
            StackPanel>

            <TextBox Grid.Row="0" Grid.Column="1" TextWrapping="Wrap"/>
        Grid>

        <Grid Grid.Row="3" Grid.Column="0">
            <Grid.ColumnDefinitions>
                <ColumnDefinition/>
                <ColumnDefinition/>
                <ColumnDefinition/>
                <ColumnDefinition/>
                <ColumnDefinition/>
                <ColumnDefinition/>
                <ColumnDefinition/>
                <ColumnDefinition/>
                <ColumnDefinition/>
                <ColumnDefinition/>
                <ColumnDefinition/>
                <ColumnDefinition/>
            Grid.ColumnDefinitions>

            <Button Grid.Row="0" Grid.Column="0" Content="行 8/11" />
            <Button Grid.Row="0" Grid.Column="1" Content="列 3/2" />
            <Button Grid.Row="0" Grid.Column="2" Content="字符 3/2" />
            <Button Grid.Row="0" Grid.Column="3" Content="求值 --" />
            <Button Grid.Row="0" Grid.Column="4" Content="选定 --" />
            <Button Grid.Row="0" Grid.Column="5" Content="选行 --" />
            <Button Grid.Row="0" Grid.Column="6" Content="匹配 --" />

            <Button Grid.Row="0" Grid.Column="7" Content="求值 --" />
            <Button Grid.Row="0" Grid.Column="8" Content="选定 --" />
            <Button Grid.Row="0" Grid.Column="9" Content="选行 --" />
            <Button Grid.Row="0" Grid.Column="10" Content="匹配 --" />
            <Button Grid.Row="0" Grid.Column="11" Content="字符 3/2" />
        Grid>
    Grid>
Window>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87

设置布局

1.固定像素布局 Width = “200”
2.比例布局 Width = “1*”
3.内容长度自动布局 Width = “AUTO”
在这里插入图片描述

<Window x:Class="WPF_Study.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:WPF_Study"
        mc:Ignorable="d"
        Title="WPF入门" Height="600" Width="800">
    <Grid ShowGridLines="True">
        
        <Grid.RowDefinitions>
            
            <RowDefinition Height="1*"/>
            
            <RowDefinition Height="2*"/>
        Grid.RowDefinitions>

        
        <Grid.ColumnDefinitions>
            
            <ColumnDefinition Width="AUTO"/>
            <ColumnDefinition/>
            <ColumnDefinition/>
        Grid.ColumnDefinitions>

        <Button Grid.Column="0" Grid.Row="0" Content="0,0" Width="100" />
        <Button Grid.Column="2" Grid.Row="1" Content="1,2" />
    Grid>
Window>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

相关阅读:
【算法|动态规划No30】leetcode5. 最长回文子串
 《吐血整理》进阶系列教程-拿捏Fiddler抓包教程(12)-Fiddler设置IOS手机抓包，你知多少？？？
同等参数中最强，在苹果15Pro上也能运行！谷歌又“卷”出了端侧小模型 Gemma 2 2B...
Oracle修改表空间文件位置
 在线webp转换jpg免费转换教程
 MySQL基础篇【子查询】
win10下pycocotools安装及问题解决
 Android开发笔记（一百八十七）利用估值器实现弹幕动画
 java计算机毕业设计小说阅读网站系统源代码+数据库+系统+lw文档
 uniapp 小程序canvas插入网络图片
原文地址：https://blog.csdn.net/weixin_45875105/article/details/136202967