WPF覆盖外部父母

时间:2014-05-08 12:47:08

标签: c# wpf user-controls overlay

我有以下示例:

<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视为菜单覆盖。

2 个答案:

答案 0 :(得分:2)

有时候我在这里看到的问题和答案让我无法相信。如果您想将两个或多个元素放入一个Grid.RowColumn,则只需将其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

答案 1 :(得分:0)

在红色网格上设置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

编辑:添加了截图

编辑:切换到画布