XAML 如何使叠加控件高于所有其他控件?

tez616oj  于 11个月前  发布在  其他
关注(0)|答案(6)|浏览(125)

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

zsbz8rwp

zsbz8rwp1#

如果您在布局中使用CanvasGrid,则给予要放在顶部的控件更高的ZIndex
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>

字符串
如果您没有指定ZIndex,面板的子项将按照指定的顺序呈现(即最后一个在顶部)。
如果你想做一些更复杂的事情,你可以看看ChildWindow是如何在Silverlight中实现的。它在整个RootVisual上覆盖了一个透明的背景和弹出窗口。

hzbexzde

hzbexzde2#

Robert Rossney有一个很好的解决方案。这是我过去使用过的另一种解决方案,它将“Overlay”与其他内容分开。这个解决方案利用附加属性Panel.ZIndex将“Overlay”放置在其他所有内容的顶部。您可以在代码中设置“Overlay”的可见性或使用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>

字符串

kh212irz

kh212irz3#

网格中同一单元格中的控件是从后到前呈现的。因此,将一个控件放在另一个控件之上的一个简单方法是将它们放在同一单元格中。
下面是一个有用的例子,它弹出一个面板,在执行长时间运行的任务时(即BusyMessage绑定属性不为null时),该面板会禁用视图(即用户控件)中的所有内容,并显示忙碌消息:

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

字符串

hk8txs48

hk8txs484#

把你想要的控件放在xaml代码的最前面。

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

字符串

kwvwclae

kwvwclae5#

这是WPF中Adorners的一个常见函数。装饰器通常出现在所有其他控件之上,但其他提到z顺序的答案可能更适合您的情况。
范例:
在控件的构造函数中:

Loaded += (sender, args) =>
{
    AdornerLayer adornerLayer = AdornerLayer.GetAdornerLayer(this);
    GreenOverlayAdorner adorner = new GreenOverlayAdorner(this);
    adornerLayer.Add(adorner);
};

字符串
GreenOverlayAdorner.cs

using System.Windows;
using System.Windows.Documents;
using System.Windows.Media;

public class GreenOverlayAdorner : Adorner
{
    public GreenOverlayAdorner(UIElement adornedElement)
        : base(adornedElement)
    {
    }

    protected override void OnRender(DrawingContext drawingContext)
    {
        Rect adornedElementRect = new Rect(this.AdornedElement.RenderSize);

        // Draw semi-transparent green background
        Brush brush = new SolidColorBrush(Color.FromArgb(128, 0, 255, 0)); // 50% transparent green
        drawingContext.DrawRectangle(brush, null, adornedElementRect);

        // Draw solid green line
        Pen pen = new Pen(Brushes.Green, 2);
        drawingContext.DrawLine(pen, adornedElementRect.TopLeft, adornedElementRect.BottomRight);
    }
}

qlzsbp2j

qlzsbp2j6#

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

字符串

相关问题