内容控制阴影

Question

我们有一个应用程序的设计规范，其中我们为每个对话框屏幕定义了一个标题。

表头控件通常添加到表格中的对话框窗口中，表头位于第 0 行，内容位于第 1 行，有时页脚位于第 2 行。

设计要求标题有一个框阴影，落入窗口的内容中：

我认为这就像在边框上添加阴影一样简单，但是当我添加内容时，这不会显示（暂时忽略颜色，我试图确保我可以看到我添加的内容：

<ControlTemplate x:Key="DialogHeader" TargetType="{x:Type ContentControl}">

<Border x:Name="bdrOuter"
        Height="72"
        Style="{DynamicResource DialogHeader.Border}">

    <Border.Effect>

        <DropShadowEffect ShadowDepth="5"
                          Color="Yellow"
                          Direction="270"
                          BlurRadius="0.04" />

    </Border.Effect>

    <Grid Margin="4">

任何人都可以就此提出建议吗？

Answer 1

这样你就有了标题和内容。

如果您的内容容器有自己的背景，它可以禁用上方标题的阴影投射。在这种情况下，您可以尝试将 Panel.ZIndex 属性设置为内容容器部分，如下例所示。

您也可以尝试将内容的背景保持透明，然后设置Panel.ZIndex也许就没有必要了。

以下代码对我有用：

<StackPanel>
    <Border x:Name="MyBorder" Width="50" Height="15" Background="LightBlue">
        <Border.Effect>
            <DropShadowEffect ShadowDepth="4" Direction="270" Opacity="0.5"/>
        </Border.Effect>
        <TextBlock Text="Test"/>
    </Border>

    <StackPanel x:Name="MyContentContainer" Background="Yellow" Panel.ZIndex="-1">
        <TextBlock Text="Test2"></TextBlock>
    </StackPanel>
</StackPanel>