Wpf 对OpacityMask使用控件

我正在写申请书。我希望有一个教程模式，应用程序的屏幕变暗，并且允许应用程序的单个功能发光。在我的实际应用程序中，我有许多数据网格和列表框，因此我认为实现这一点的最简单方法可能是用半透明面板覆盖整个屏幕，然后使用不透明遮罩查看某些区域的遮罩，以在我的应用程序中突出显示它们，而教程解释了它们的作用。唯一的问题是，我无法让不透明遮罩与visualbrush一起工作，并拾取特定的对象，如列表框。下面是我编写的一个示例程序，它简单地演示了我正在尝试做的事情

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

    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>

    <TextBlock Text="Two different text listboxes"/>

    <ListBox Grid.Row="1" Name="myListBox1" Grid.Column="0" VerticalAlignment="Top">
        <ListBoxItem Content="Item 1" Margin="3" Background="Tan"/>
        <ListBoxItem Content="Item 2" Margin="3" Background="Aqua"/>
        <ListBoxItem Content="Item 3" Margin="3" Background="Gold"/>
    </ListBox>

    <ListBox Grid.Row="1" Name="myListBox2" Grid.Column="1" VerticalAlignment="Top">
        <ListBoxItem Content="Item A" Margin="3" Background="Magenta"/>
        <ListBoxItem Content="Item B" Margin="3" Background="Chartreuse"/>
        <ListBoxItem Content="Item C" Margin="3" Background="Chocolate"/>
        <ListBoxItem Content="Item D" Margin="3" Background="Pink"/>
    </ListBox>


    <Button Grid.Row="2" Height="40" Margin="5" Content="Click me" Grid.ColumnSpan="2"/>

    <DockPanel Grid.RowSpan="3" Background="#55000000" Grid.ColumnSpan="2">
        <DockPanel.OpacityMask>
            <VisualBrush Visual="{Binding ElementName=myListBox1}"/>
        </DockPanel.OpacityMask>
    </DockPanel>
</Grid>

---

有谁能给我一些关于如何简单地完成这个面具的建议吗？

这里有一个我过去是如何做到这一点的例子。我打算再做一步，制作一个故事板动画，通过一个对象上的

Clip

属性更改进行排序，向您展示它如何在教程场景中工作（在我上一个项目中，它做得很好。）除了周五，我已经很晚离开办公室了。：）

PS:忘了提到，最初我只是将命名矩形折叠在每个控件的顶部，我想用-5的边距来展示。一旦将它们的可见性切换为visible并返回，您就可以使用xaml为几何体绑定

Rect

或者。。。如果你不需要它的动态，你也不介意在你最外层的父母x层。你可以在混合->将矩形放在最上面的z-索引中加载它，这样它就可以用不透明度覆盖所有内容，在突出显示区域上绘制一个矩形->选择两者->选择对象->选择路径->选择“生成复合路径”，然后，瞧，你有一个形状，你可以切换可见性，并在故事板上循环

如果您有任何问题或希望我向您展示如何更多地利用该概念，请告诉我，您可以手动更改“PresenterForeground”上的

StaticResource

上的框1、框2、框3等，以查看该概念的实际应用

<Window x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="350">
    <Window.Resources>
        <!-- These guys are for example, you could change the StaticResource on the Clip of the Rectangle
             below to reflect the changes here with a property change in a storyboard, or from a trigger, whatever -->
        <Geometry x:Key="Box1">M0,0 L280,0 L280,280 L0,280 z M10,10 L130,10 L130,130 L10,130 z</Geometry>
        <Geometry x:Key="Box2">M0,0 L280,0 L280,280 L0,280 z M150,10 L270,10 L270,130 L150,130 z</Geometry>
        <Geometry x:Key="Box3">M0,0 L280,0 L280,280 L0,280 z M10,150 L130,150 L130,270 L10,270 z</Geometry>
        <Geometry x:Key="Box4">M0,0 L280,0 L280,280 L0,280 z M150,150 L270,150 L270,270 L150,270 z</Geometry>
    </Window.Resources>

        <Grid HorizontalAlignment="Center" VerticalAlignment="Center">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>
            <Grid.Resources>
                <Style TargetType="Rectangle">
                    <Setter Property="Width" Value="100"/>
                    <Setter Property="Height" Value="100"/>
                    <Setter Property="Margin" Value="20"/>
                </Style>
            </Grid.Resources>

            <Rectangle Fill="Red"/>
            <Rectangle Grid.Column="1" Fill="Blue"/>
            <Rectangle Grid.Row="1" Fill="Green"/>
            <Rectangle Grid.Row="1" Grid.Column="1" Fill="Orange"/>

            <!-- This guy is our main foreground to cut visibility to everything else -->
            <Rectangle Name="PresenterForeground" Grid.ColumnSpan="2" Grid.RowSpan="2"
                Fill="#77000000" 
                Height="Auto"
                Width="Auto" 
                Margin="0"
                Clip="{StaticResource Box1}"/>

        </Grid>

</Window>

M0,0 L280,0 L280280 L0280 z M10,10 L130,10 L130130 L10130 z
M0,0 L280,0 L28080 L0280 z M150,10 L270,10 L270130 L50130 z
M0,0 L280,0 L280280 L0280 z M10150 L130150 L130270 L10270 z
M0,0 L280,0 L280280 L0280 z M150150 L270150 L270270 L150270 z

---

希望这对你有帮助，祝你周末愉快，干杯

显然，从长远来看，我需要能够修改哪个控件正在使用遮罩，但现在，我很高兴知道如何让遮罩工作。我将向您展示一个巧妙的技巧，只需使用几个矩形和剪辑，稍后我回到家中。我想最简单的方法是添加

Panel.ZIndex=“1”

to

myListBox1

Oh-hey@SzabolcsDézsi也有一个很好的主意，设置你想要在半透明背景上弹出的对象的最高z索引+1:）是的，那可能真的有用。。。我想我也可以在更大的应用程序中使用它。我得看看。谢谢。我真的很喜欢你的解决方案。由于我的窗口重新调整了大小，我将需要使用它们显示的控件调整矩形大小。我试图通过绑定到与要高亮显示的对象位于同一空间的几何体来实现这一点，但没有成功。我基本上是这样做的：在要高亮显示的对象和窗口底部。我做错了什么？@JonD-Hmm，把第一个的填充去掉，因为你刚刚抓取了Rect，如果你希望它是Fill=“{x:Null}”，这样HittesVisibility就可以通过这个区域，我这周很忙，但我会看看我是否能晚一点在这里给出一个更详细的例子，只要我不必重新编写所有的lol，我希望proj没有NDA，或者我会尝试查找源代码并分享它，lol，这会让它变得更容易。