wake-up-neo.com

Wie mache ich Overlay-Kontrolle über alle anderen Kontrollen?

Ich muss ein Steuerelement über allen anderen Steuerelementen anzeigen, damit es sie teilweise überlagert.

wpfxamlcontrolsoverlay
152
user626528

Wenn Sie in Ihrem Layout ein Canvas oder Grid verwenden, geben Sie dem Steuerelement, das übergeordnet werden soll, ein höheres ZIndex.

Von 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>

Wenn Sie ZIndex nicht angeben, werden die untergeordneten Elemente eines Panels in der angegebenen Reihenfolge gerendert (d. H. Das letzte oben).

Wenn Sie etwas Komplizierteres tun möchten, können Sie sich ansehen, wie ChildWindow in Silverlight implementiert ist. Es überlagert den gesamten RootVisual mit einem semitransparenten Hintergrund und einem Popup.

150
foson

Robert Rossney hat eine gute Lösung. Hier ist eine alternative Lösung, die ich in der Vergangenheit verwendet habe und die "Überlagerung" vom Rest des Inhalts unterscheidet. Diese Lösung nutzt die angehängte Eigenschaft Panel.ZIndex, um das "Overlay" über alles andere zu legen. Sie können entweder die Sichtbarkeit der "Überlagerung" im Code festlegen oder ein DataTrigger verwenden.

<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>
64
Metro Smurf

Steuerelemente in derselben Zelle eines Rasters werden von hinten nach vorne gerendert. Eine einfache Möglichkeit, ein Steuerelement über ein anderes zu legen, besteht darin, es in derselben Zelle abzulegen.

Hier ist ein nützliches Beispiel, das ein Fenster öffnet, in dem alle Elemente in der Ansicht (dh das Benutzersteuerelement) mit einer Besetztmeldung deaktiviert werden, während eine lang laufende Aufgabe ausgeführt wird (dh während die gebundene Eigenschaft BusyMessage nicht null ist ):

<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>
39
Robert Rossney

Platzieren Sie das Steuerelement, das Sie in den Vordergrund stellen möchten, am Ende Ihres XAML-Codes. Das heißt.

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

Dies ist eine häufige Funktion von Adorners in WPF. Adorners werden in der Regel vor allen anderen Steuerelementen angezeigt, aber die anderen Antworten, in denen die Z-Reihenfolge angegeben ist, passen möglicherweise besser zu Ihrem Fall.

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