Làm cách nào để tạo điều khiển lớp phủ trên tất cả các điều khiển khác?

Tôi cần làm cho một điều khiển xuất hiện trên tất cả các điều khiển khác, vì vậy nó sẽ che phủ một phần chúng.

Nếu bạn đang sử dụng một Canvashoặc Gridtrong bố cục của mình, hãy đưa điều khiển lên cao hơn ZIndex.

Từ 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>

Nếu bạn không chỉ định ZIndex, phần con của bảng được hiển thị theo thứ tự chúng được chỉ định (tức là phần cuối cùng trên cùng).

Nếu bạn đang tìm cách làm một cái gì đó phức tạp hơn, bạn có thể xem cách ChildWindowtriển khai trong Silverlight. Nó phủ lên một nền bán trong suốt và cửa sổ bật lên trên toàn bộ của bạn RootVisual.

Robert Rossney có một giải pháp tốt. Đây là một giải pháp thay thế mà tôi đã sử dụng trong quá khứ tách biệt "Lớp phủ" khỏi phần còn lại của nội dung. Giải pháp này tận dụng lợi thế của tài sản đính kèm Panel.ZIndexđể đặt "Lớp phủ" lên trên mọi thứ khác. Bạn có thể đặt Hiển thị của "Lớp phủ" trong mã hoặc sử dụng a 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>

Các điều khiển trong cùng một ô của Lưới được hiển thị ngược về phía trước. Vì vậy, một cách đơn giản để đặt một điều khiển lên trên một điều khiển khác là đặt nó trong cùng một ô.

Đây là một ví dụ hữu ích, bật lên một bảng điều khiển vô hiệu hóa mọi thứ trong chế độ xem (tức là điều khiển người dùng) với một thông báo bận trong khi tác vụ chạy dài được thực thi (nghĩa là trong khi thuộc tính BusyMessagebị ràng buộc không có giá trị):

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

Đặt điều khiển bạn muốn đưa ra phía trước ở cuối mã xaml của bạn. I E

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

Đây là một chức năng phổ biến của Adorners trong WPF. Trang sức thường xuất hiện trên tất cả các điều khiển khác, nhưng các câu trả lời khác đề cập đến thứ tự z có thể phù hợp với trường hợp của bạn hơn.

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