Question

我有以下示例：

<Window x:Class="WpfOverlayTest.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="400" Width="600">
<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>
    <Grid Grid.Row="0" Width="600" Height="200" Background="LightBlue">
        <Grid Margin="0,125,0,0" Height="75" Width="200" Background="Red">
            <Grid Margin="0,75,0,0" Background="Black" Height="20" Width="200" />
        </Grid>
    </Grid>
    <Grid  Grid.Row="1" Height="200" Width="600" Background="LightGreen" />
</Grid>

如何显示黑色网格？

编辑：为了使问题更清楚：我想在Black Grid内定义Red Grid ，但应在{{1>}上显示。请将Green Grid视为Red Grid，将UserControl视为菜单覆盖。

Answer 1

有时候我在这里看到的问题和答案让我无法相信。如果您想将两个或多个元素放入一个Grid.Row或Column，则只需将其Grid.Row值设置为相同的值即可。元素在XAML中定义的越低，元素前面的元素就越多。因此，要在绿色Grid之上添加黑色Grid，您可以这样做：

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>
    <Grid Grid.Row="0" Width="600" Height="200" Background="LightBlue">
        <Grid Margin="0,125,0,0" Height="75" Width="200" Background="Red">
        </Grid>
    </Grid>
    <Grid Grid.Row="1" Height="200" Width="600" Background="LightGreen" />
    <Grid Grid.Row="1" Background="Black" VerticalAlignment="Center" 
        Height="20" Width="200" /> <!-- This will be on top -->
</Grid>

enter image description here

更新

要弄清楚你真正想要的东西是非常困难的，但在阅读完评论后，似乎你可能会想要这样：

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>
    <Grid Grid.Row="0" Width="600" Height="200" Background="LightBlue">
        <Grid Margin="0,125,0,0" Height="75" Width="200" Background="Red">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>
            <Grid Grid.Row="0" Background="Black" VerticalAlignment="Center" Height="20" Width="200" />
        </Grid>
    </Grid>
    <Grid Grid.Row="1" Height="200" Width="600" Background="LightGreen" />
</Grid>

enter image description here

这是基本的Grid内容。我推荐MSDN上Grid Class页面中的资料。

更新2

既然您已在问题中提供了问题的描述，我终于可以根据您的要求提供正确的XAML：

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>
    <Grid Grid.Row="0" Width="600" Height="200" Background="LightBlue" />
    <Grid Grid.Row="1" Height="200" Width="600" Background="LightGreen" />
    <Grid Grid.Row="1" VerticalAlignment="Center" Height="75" Width="200" Background="Red">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <!-- This will be on top -->
        <Grid Grid.Row="0" Background="Black" VerticalAlignment="Center" Height="20" Width="200" />
    </Grid>
</Grid>

enter image description here

Answer 2

在红色网格上设置RowDefinition并为其指定黑色网格

<Canvas>
    <Grid Width="600" Height="200" Background="LightBlue">
    </Grid>
    <Grid Margin="0,200,0,0" Height="175" Width="600" Background="LightGreen" />
    <Grid Margin="200,125,0,0" Height="100" Width="200" Background="Red">
        <Grid Margin="0,75,0,0" Background="Black" Height="20" Width="200" />
    </Grid>
</Canvas>

enter image description here

编辑：添加了截图

编辑：切换到画布

WPF覆盖外部父母

2 个答案:

更新

更新2