Wpf 为什么XAML网格不能正确显示所有面板？

我正在学习WPF和XAML。我正在试验不同的布局，所以我把所有东西都放在一个

中，每个单元格都有不同的布局

在我将

和

包装在

中之后，由于某种原因，当我指定它位于第1行第1列时，它隐藏了

。它还将

放在第二行，当我指定它放在第一行时。为什么网格如此不寻常地放置和隐藏所有内容

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition />
        <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition />
        <RowDefinition />
    </Grid.RowDefinitions>
    <StackPanel Grid.Column="1" Grid.Row="1">
        <Button Name="Button" Click="button_Click">Click me!</Button>
    </StackPanel>
    <DockPanel Grid.Column="2" Grid.Row="1">
        <TextBox DockPanel.Dock="Top">Dock = "Top"</TextBox>
        <TextBox DockPanel.Dock="Bottom">Dock = "Bottom"</TextBox>
        <TextBox DockPanel.Dock="Left">Dock = "Left"</TextBox>
        <TextBox DockPanel.Dock="Right">Dock = "Right"</TextBox>
        <TextBox Background="White">This TextBox "fills" the remaining space.</TextBox>
    </DockPanel>
    <Canvas Grid.Row="2" Grid.ColumnSpan="2">
        <Polygon Points="50, 100 200, 100 200, 200 300, 30" Stroke="Black" StrokeThickness="4" Fill="Yellow" />
    </Canvas>
</Grid>

点击我！
Dock=“Top”
Dock=“底部”
Dock=“左”
Dock=“右”
此文本框“填充”剩余空间。

点击我！
Dock=“Top”
Dock=“底部”
Dock=“左”
Dock=“右”
此文本框“填充”剩余空间。

Grid.Row

和

Grid.Column

值从

0

开始，而不是

1

在XAML中，您可以将

StackPanel

和

DockPanel

的

Grid.Row

设置为

1

。所以，

Grid

将这两个元素放在了一起。这就是为什么您只看到

DockPanel

而不看到

StackPanel

要获得所需的输出，您需要将

StackPanel的
Grid.Row
设置为
0

这里更新了XAML，为
Grid.Row
和
Grid.Column
属性设置了正确的值

<Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition />
        </Grid.RowDefinitions>
        <StackPanel Grid.Column="0" Grid.Row="0">
            <Button Name="Button">Click me!</Button>
        </StackPanel>
        <DockPanel Grid.Column="2" Grid.Row="1">
            <TextBox DockPanel.Dock="Top">Dock = "Top"</TextBox>
            <TextBox DockPanel.Dock="Bottom">Dock = "Bottom"</TextBox>
            <TextBox DockPanel.Dock="Left">Dock = "Left"</TextBox>
            <TextBox DockPanel.Dock="Right">Dock = "Right"</TextBox>
            <TextBox Background="White">This TextBox "fills" the remaining space.</TextBox>
        </DockPanel>
        <Canvas Grid.Row="1" Grid.ColumnSpan="2">
            <Polygon Points="50, 100 200, 100 200, 200 300, 30" Stroke="Black" StrokeThickness="4" Fill="Yellow" />
        </Canvas>
    </Grid>


点击我！
Dock=“Top”
Dock=“底部”
Dock=“左”
Dock=“右”
此文本框“填充”剩余空间。

您可能需要参考以了解有关网格的更多信息。
您的
网格.Row
和
网格.Column
属性值设置不正确，这就是您看到该行为的原因。它们从索引
0
开始，而不是
1
@Suresh噢，我没有意识到，因为它在文档中没有说出来，但在他们的示例代码中说出来了。谢谢
<Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition />
        </Grid.RowDefinitions>
        <StackPanel Grid.Column="0" Grid.Row="0">
            <Button Name="Button">Click me!</Button>
        </StackPanel>
        <DockPanel Grid.Column="2" Grid.Row="1">
            <TextBox DockPanel.Dock="Top">Dock = "Top"</TextBox>
            <TextBox DockPanel.Dock="Bottom">Dock = "Bottom"</TextBox>
            <TextBox DockPanel.Dock="Left">Dock = "Left"</TextBox>
            <TextBox DockPanel.Dock="Right">Dock = "Right"</TextBox>
            <TextBox Background="White">This TextBox "fills" the remaining space.</TextBox>
        </DockPanel>
        <Canvas Grid.Row="1" Grid.ColumnSpan="2">
            <Polygon Points="50, 100 200, 100 200, 200 300, 30" Stroke="Black" StrokeThickness="4" Fill="Yellow" />
        </Canvas>
    </Grid>