2

我有一个 ItemsControl,其中包含一些嵌套容器。我想在主 ItemsControl 的每个元素周围添加一个阴影。但相反,它将它添加到主 ItemsControl 内的某些容器中(创建阴影行)。我已将效果置于多个不同的级别,但结果没有任何变化。我从主 ItemsControl 中项目的最外层容器开始,然后从那里向上。

这是我目前放置阴影效果的地方:

<ItemsControl  >
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <!-- I have tried adding the dropshadow effect within this stackpanel -->
            <StackPanel />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <!-- Where I define the dropshadow -->
    <ItemsControl.Effect>
        <DropShadowEffect BlurRadius="0" ShadowDepth="1" Color="LightGray"/>
    </ItemsControl.Effect>
    <!-- End of dropshadow definition -->    

    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <media:Step5Item />
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

这是 Step5Item 的定义,我添加了阴影出现位置的文档:(编辑)我删除了元素的内容,因为那只是样式等等。

<!-- This is inserted by the above code's DataTemplate -->
<!-- I have tried adding a border here and giving it a dropshadow effect -->
<Grid >

    <!-- I have tried inserting a dropshadow effect here -->

    <TextBlock Grid.Row="0"/>

    <Border BorderBrush="LightGray" BorderThickness="1" >
        <!-- I have tried inserting a dropshadow effect here -->
        <Grid>
            <Border >
                <!-- There is a shadow around this border/grid -->
                <Grid Grid.Row="0" >
                    <TextBlock Grid.Column="0" />
                    <Button Grid.Column="2"/>

                </Grid>
            </Border>

            <!--There is a shadow around each element in this ItemsControl-->
            <ItemsControl Grid.Row="2" >
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <Grid Margin="0,0,0,4" >
                            <Path Grid.Row="0">
                                <Path.Data>
                                    <LineGeometry StartPoint="0,0" EndPoint="1500,0"/>
                                </Path.Data>
                            </Path>
                            <Grid Grid.Row="1">
                                <Image Grid.Column="0" />
                            </Grid>
                        </Grid>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
        </Grid>
    </Border>
</Grid>

底部还有一个阴影,但我不知道它是来自 ItemsControl 中的最后一个元素还是来自最外面的边框。

如果您愿意,我可以进一步清理第二个代码段。我拿出了一些东西,但留在了元素中,认为这可能是最好的可读性。

编辑 我在添加子元素后尝试应用效果,希望因为它们会在效果发挥作用之前创建,所以不会发生问题。我尝试将效果放置在主 ItemsControl 的底部以及 Step5Item 中最外层网格的底部。我还从 Step5Item 中删除了一些内容,以使其更具可读性。

编辑2

这是有和没有效果的两张图片。我将 DropShadow 代码完全放在上面放置的位置,尽管就像我说的那样,我可以将它放置在许多地方以获得相同的效果。

使用阴影

有错误

没有阴影

没有错误 http://img402.imageshack.us/img402/1456/nodropshadowexample.png

编辑 3

这是我在 Erno 的解决方案中使用的边框和阴影效果。我希望能够进一步增加阴影深度,因为右侧没有任何阴影,只有底部。目前,如果我更改 ShadowDepth,它会将阴影的位置更改为距离等于新尺寸的距离,但它的厚度仅为 1。

<Border Margin="0,1,0,0" Height="auto" Width="auto" CornerRadius="5,5,5,5"    BorderThickness="1" BorderBrush="LightGray">
    <Border.Effect>
        <DropShadowEffect BlurRadius="0" ShadowDepth="1" Direction="315" Color="LightGray"/>
    </Border.Effect>
</Border>
4

1 回答 1

2

您是否尝试过以下操作?

我添加了另一个网格并添加了带有效果的 SIBLING 边框。包含行的网格显示在其顶部,但不是边框的子控件。

        <ItemsControl Grid.Row="2" >
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Grid Margin="0,0,0,4" >

                        <Grid> 
                            <Border>
                                <Border.Effect>
                                    <DropShadow />
                                </Border.Effect>
                            </Border>

                            <Path Grid.Row="0">
                                <Path.Data>
                                    <LineGeometry StartPoint="0,0" EndPoint="1500,0"/>
                                </Path.Data>
                            </Path>
                            <Grid Grid.Row="1">
                                <Image Grid.Column="0" />
                            </Grid>
                        </Grid>
                    </Grid>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
于 2011-08-04T16:20:43.983 回答