DropShadowEffect на Rectangle с небольшой прозрачностью - как сделать так, чтобы тень не отображалась внутри заливки?

Question

У меня есть DropShadowEffect на прямоугольник с немного прозрачной заливкой.Проблема в том, что тень также отображается внутри заливки, чего я не хочу.В любом случае, чтобы решить это?Я пытался это , но у меня это не работает: /

Answer 1

Это очень сложно.

Хорошо, я не знаю точного ответа. Но вот что даст вам практически желаемый эффект. Попробуй.

Это образец Grid с желтым фоном. Я нарисовал два пересекающихся прямоугольника размером 100x100. Возможно, вам придется настроить размер в соответствии с вашими потребностями. Один прямоугольник - серый прямоугольник (для отображения тени), а другой - красный прямоугольник (фактический полупрозрачный прямоугольник, который вы хотите отобразить). Глубина тени здесь жестко задана как 5 пикселей. Пожалуйста, настройте его по адресу:

• RectangleGeometry Rect = "5,5 100 100"

• RectangleGeometry Rect = "0,0,95,95"

Итак, сетка выглядит так:

<Grid Background="Yellow">
    <!-- A rectangle for shadow -->
    <Rectangle Fill="Gray" Width="100" Height="100" Opacity=".7">
        <Rectangle.Clip>
            <CombinedGeometry GeometryCombineMode="Exclude">
                <CombinedGeometry.Geometry1>
                    <RectangleGeometry Rect="5,5,100,100"/>
                </CombinedGeometry.Geometry1>
                <CombinedGeometry.Geometry2>
                    <RectangleGeometry Rect="0,0,95,95"/>
                </CombinedGeometry.Geometry2>
            </CombinedGeometry>
        </Rectangle.Clip>
        <Rectangle.Effect>
            <!-- For nice soft shadow effect -->
            <BlurEffect Radius="5" />
        </Rectangle.Effect>
    </Rectangle>

    <!-- Actual rectangle which is translucent -->
    <Rectangle Fill="Red" Width="100" Height="100" Opacity=".6" >
        <Rectangle.Clip>
            <RectangleGeometry Rect="0,0,95,95"/>
        </Rectangle.Clip>
    </Rectangle>
</Grid>

Обновление (8.11.11):

Вы можете заменить жестко запрограммированные ширину и высоту, привязав их к ширине и высоте родителя. Проверьте эту SO тему для множественного связывания, которое вам понадобится. Больше учебных материалов по переплету: здесь .

Пример того, как будет выглядеть фрагмент XAML:

<Rectangle Width="{Binding RelativeSource={RelativeSource Self}, Path=Parent.ActualWidth}"
        Height="{Binding RelativeSource={RelativeSource Self}, Path=Parent.ActualHeight}">
</Rectangle>

Поскольку я не специалист по связыванию данных, вам нужно самостоятельно провести здесь исследования. Я чувствую, что вам понадобятся ваши собственные конвертеры значений для назначения высоты рекламы специальной ширины (ActualWidth - ShadowDepth вид материала (ShadowDepth составляет 5 пикселей здесь)).