wpf 如何使覆盖控件高于所有其他控件？

How to make overlay control above all other controls?

提问by user626528

I need to make a control appear above all other controls, so it will partially overlay them.

我需要让一个控件出现在所有其他控件之上，因此它会部分覆盖它们。

采纳答案by foson

If you are using a Canvasor Gridin your layout, give the control to be put on top a higher ZIndex.

如果您在布局中使用Canvas或Grid，请将控件放在更高的ZIndex.

From MSDN:

从MSDN：

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" WindowTitle="ZIndex Sample">
  <Canvas>
    <Rectangle Canvas.ZIndex="3" Width="100" Height="100" Canvas.Top="100" Canvas.Left="100" Fill="blue"/>
    <Rectangle Canvas.ZIndex="1" Width="100" Height="100" Canvas.Top="150" Canvas.Left="150" Fill="yellow"/>
    <Rectangle Canvas.ZIndex="2" Width="100" Height="100" Canvas.Top="200" Canvas.Left="200" Fill="green"/>

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

    <Rectangle Canvas.ZIndex="1" Width="100" Height="100" Canvas.Top="300" Canvas.Left="200" Fill="green"/>
    <Rectangle Canvas.ZIndex="3" Width="100" Height="100" Canvas.Top="350" Canvas.Left="150" Fill="yellow"/>
    <Rectangle Canvas.ZIndex="2" Width="100" Height="100" Canvas.Top="400" Canvas.Left="100" Fill="blue"/>
  </Canvas>
</Page>

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

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

If you are looking to do something more complicated, you can look at how ChildWindowis implemented in Silverlight. It overlays a semitransparent background and popup over your entire RootVisual.

如果您希望做一些更复杂的事情，您可以查看ChildWindowSilverlight 中的实现方式。它覆盖了一个半透明的背景，并在整个RootVisual.

回答by Metro Smurf

Robert Rossneyhas a good solution. Here's an alternative solution I've used in the past that separates out the "Overlay" from the rest of the content. This solution takes advantage of the attached property Panel.ZIndexto place the "Overlay" on top of everything else. You can either set the Visibility of the "Overlay" in code or use a DataTrigger.

罗伯特罗斯尼有一个很好的解决方案。这是我过去使用的另一种解决方案，它将“覆盖”与其余内容分开。此解决方案利用附加属性Panel.ZIndex将“覆盖”放置在其他所有内容之上。您可以在代码中设置“覆盖”的可见性或使用DataTrigger.

<Grid x:Name="LayoutRoot">

 <Grid x:Name="Overlay" Panel.ZIndex="1000" Visibility="Collapsed">
    <Grid.Background>
      <SolidColorBrush Color="Black" Opacity=".5"/>
    </Grid.Background>

    <!-- Add controls as needed -->
  </Grid>

  <!-- Use whatever layout you need -->
  <ContentControl x:Name="MainContent" />

</Grid>

回答by Robert Rossney

Controls in the same cell of a Grid are rendered back-to-front. So a simple way to put one control on top of another is to put it in the same cell.

Grid 的同一单元格中的控件从后到前呈现。因此，将一个控件置于另一个控件之上的一种简单方法是将其放在同一个单元格中。

Here's a useful example, which pops up a panel that disables everything in the view (i.e. the user control) with a busy message while a long-running task is executed (i.e. while the BusyMessagebound property isn't null):

这是一个有用的示例，它弹出一个面板，在执行长时间运行的任务时（即，当BusyMessage绑定属性不为空时）使用忙消息禁用视图中的所有内容（即用户控件）：

<Grid>

    <local:MyUserControl DataContext="{Binding}"/>

    <Grid>
        <Grid.Style>
            <Style TargetType="Grid">
                <Setter Property="Visibility"
                        Value="Visible" />
                <Style.Triggers>
                    <DataTrigger Binding="{Binding BusyMessage}"
                                 Value="{x:Null}">
                        <Setter Property="Visibility"
                                Value="Collapsed" />
                    </DataTrigger>

                </Style.Triggers>
            </Style>
        </Grid.Style>
        <Border HorizontalAlignment="Stretch"
                VerticalAlignment="Stretch"
                Background="DarkGray"
                Opacity=".7" />
        <Border HorizontalAlignment="Center"
                VerticalAlignment="Center"
                Background="White"
                Padding="20"
                BorderBrush="Orange"
                BorderThickness="4">
            <TextBlock Text="{Binding BusyMessage}" />
        </Border>
    </Grid>
</Grid>

回答by artos

Put the control you want to bring to front at the end of your xaml code. I.e.

将您想要放在前面的控件放在 xaml 代码的末尾。IE

<Grid>
  <TabControl ...>
  </TabControl>
  <Button Content="ALways on top of TabControl Button"/>
</Grid>

回答by CodeNaked

This is a common function of Adornersin WPF. Adorners typically appear above all other controls, but the other answers that mention z-order may fit your case better.

这是WPF中Adorner的一个常用功能。装饰器通常出现在所有其他控件之上，但提到 z-order 的其他答案可能更适合您的情况。

回答by Devam Mehta

<Canvas Panel.ZIndex="1" HorizontalAlignment="Left" VerticalAlignment="Top" Width="570">
  <!-- YOUR XAML CODE -->
</Canvas>