在 WPF 中的网格中显示对其他控件的控件

Displaying a control over other controls in a grid in WPF

提问by user1139666

I am developing a WPF application.
Main window's child controls are contained in a grid.
The bottom row contains a status bar.

我正在开发一个 WPF 应用程序。
主窗口的子控件包含在网格中。
底行包含一个状态栏。

The application must notify the user.
I want to programmatically display a notification in a user control in the bottom right corner of the main window.
I want the notification user control to be displayed over the status bar and the control in the above row.

应用程序必须通知用户。
我想以编程方式在主窗口右下角的用户控件中显示通知。
我希望通知用户控件显示在状态栏和上一行中的控件上。

How can I display a control over other controls contained in a grid ?
Any help will be greatly appreciated

如何显示对包含在网格中的其他控件的控件？
任何帮助将不胜感激

采纳答案by user1139666

I have solved my problem.
I have modified the main window's XAML markup.
I have declared the notification user control and the grid containing main window's child controls in the same cell of a new grid.

我已经解决了我的问题。
我修改了主窗口的 XAML 标记。
我已经在新网格的同一单元格中声明了通知用户控件和包含主窗口子控件的网格。

I have set some properties in the notification user control's opening tag :

我在通知用户控件的开始标记中设置了一些属性：

• Grid.ZIndex="1"
• HorizontalAlignment="Right"
• VerticalAlignment="Bottom"
• Margin="0 0 20 20"

• Grid.ZIndex="1"
• 水平对齐=“右”
• 垂直对齐=“底部”
• 边距="0 0 20 20"

When the notification user control is visible :

当通知用户控件可见时：

• The notification user control is over the grid containing main window's child controls
• The notification user control is in the bottom right corner of the main window

• 通知用户控件位于包含主窗口子控件的网格上
• 通知用户控件位于主窗口的右下角

回答by Vishal

Grid has a property called ZIndex. Have a look at this example:

Grid 有一个名为 ZIndex 的属性。看看这个例子：

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" WindowTitle="ZIndex Sample">
  <Grid>

    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>

    <Rectangle Grid.Row="0" Grid.ZIndex="3" Fill="blue"/>
    <Rectangle Grid.Row="0" Grid.ZIndex="1" Fill="yellow"/>
    <Rectangle Grid.Row="0" Grid.ZIndex="2" Fill="green"/>

    <!-- Reverse the order to illustrate z-index property -->

    <Rectangle Grid.Row="1" Grid.ZIndex="1" Fill="green"/>
    <Rectangle Grid.Row="1" Grid.ZIndex="3" Fill="yellow"/>
    <Rectangle Grid.Row="1" Grid.ZIndex="2" Fill="blue"/>

  </Grid>

If you don't specify ZIndex, the the children of a panel are rendered in the order they are specified (i.e. last one on top).

如果您不指定 ZIndex，面板的子项将按照指定的顺序呈现（即最后一个在顶部）。

回答by Raghulan Gowthaman

Try this,

尝试这个，

using Panel.ZIndex you can achieve this.

使用 Panel.ZIndex 您可以实现这一点。

<Expander Name="expander_options" Header="Options"  Margin="330,10,0,182" Panel.ZIndex="1">
            <StackPanel Margin="10,4,0,0" Panel.ZIndex="2" Background="Aqua">
                <CheckBox Margin="4" Content="Option 1" />
                <CheckBox Margin="4" Content="Option 2" />
                <CheckBox Margin="4" Content="Option 3" />
            </StackPanel>
        </Expander>

回答by Manish Basantani

Or, you can make use of Popup(always stays on top of other controls). And toggle it's IsOpen state when you want to show some updates.

或者，您可以使用Popup（始终位于其他控件之上）。当你想显示一些更新时，切换它的 IsOpen 状态。

 <Popup IsOpen="True">
                  <TextBlock Text="Important update!!" Background="White" Foreground="Black"></TextBlock>
                </Popup>

There are several ways you can stick popup to bottom-right position - Dockpanel, stackpanel (with right alignment), Grid. The sample for grid is below:

有几种方法可以将弹出窗口粘贴到右下角位置 - Dockpanel、stackpanel（右对齐）、Grid。网格示例如下：

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*"></RowDefinition>
        <RowDefinition Height="Auto"></RowDefinition>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"></ColumnDefinition>
        <ColumnDefinition Width="Auto"></ColumnDefinition>
    </Grid.ColumnDefinitions>

    <StackPanel Grid.Row="0" Grid.ColumnSpan="2">
        <!--Place any control here-->
    </StackPanel>
    <StackPanel x:Name="BottomRightPanel" Grid.Row="1" Grid.Column="1">
        <Popup IsOpen="True" Placement="">
            <TextBlock Text="Important update!!" Background="White" Foreground="Black"></TextBlock>
        </Popup>
    </StackPanel>
</Grid>