Эффекты

WPF --- Графика и анимация WPF --- Эффекты

В WPF реализованы визуальные эффекты, которые можно применять к любому элементу. Целью эффектов является обеспечение простым декларативным способом улучшить визуальную привлекательность текста, изображений, кнопок и прочих элементов управления. Вместо того чтобы писать собственный код рисования, просто используется один из классов, унаследованных от Effect (из пространства имен System.Windows.Media.Effects), для получения мгновенных эффектов, таких как размытие, блеск и отбрасывание теней. В таблице перечислены доступные эффекты:

Классы-наследники Effect, перечисленные в таблице, не следует путать с классами растровых эффектов, которые наследуются от класса BitmapEffect из того же пространства имен. Хотя растровые эффекты имеют сходную модель программирования, с ними связано несколько существенных ограничений:

• Растровые эффекты не поддерживают построителей текстур — наиболее мощного и гибкого способа создания многократно используемых эффектов.

• Растровые эффекты реализованы в неуправляемом коде, поэтому требуют полностью доверенного приложения. Следовательно, применять растровые эффекты в приложениях ХВАР, основанных на браузерах, нельзя.

• Растровые эффекты всегда визуализируются программным путем и не используют ресурсов видеокарты. Это делает их медленными, особенно когда приходится иметь дело с множеством элементов или элементами с большой визуальной поверхностью.

Класс BitmapEffect ведет свою родословную от первой версии WPF, которая не включала класса Effect. Растровые эффекты оставлены лишь для обратной совместимости.

BlurEffect

Простейший из классов эффектов WPF является BlurEffect. Он размывает содержимое элемента, как если смотреть на него через расфокусированную линзу. Степень размытия повышается увеличением значения свойства Radius (которое по умолчанию имеет значение 5).

Чтобы использовать любой эффект, необходимо создать соответствующий объект эффекта и установить его в свойстве Effect соответствующего элемента:

<Button Content="BlurRadius = 2" MinHeight="30" Padding="5" Margin="5">
      <Button.Effect>
            <BlurEffect Radius="2"></BlurEffect>
      </Button.Effect>
</Button>
<Button Content="BlurRadius = 4" MinHeight="30" Padding="5" Margin="5">
     <Button.Effect>
            <BlurEffect Radius="4"></BlurEffect>
     </Button.Effect>
</Button>
 <Button Content="BlurRadius = 10" MinHeight="30" Padding="5" Margin="5">
     <Button.Effect>
            <BlurEffect Radius="10"></BlurEffect>
      </Button.Effect>
</Button>

DropShadowEffect

Класс DropShadowEffect позволяет добавить слегка сдвинутую тень позади элемента. Для управления этим эффектом предназначено несколько свойств, перечисленных ниже:

Color

Устанавливает цвет отбрасываемой тени (по умолчанию — черный)

BlurRadius

Размывает отбрасываемую тень, подобно свойству Radius класса BlurEffect (по умолчанию равно 5)

Opacity

Делает отбрасываемую тень частично прозрачной, используя дробное значение между 1 (полностью непрозрачная, по умолчанию) и 0 (полностью прозрачная)

Direction

Указывает положение отбрасываемой тени относительно содержимого в виде значения угла от 0 до 360. Значение 0 позволяет разместить тень справа, а большие значения поворачивают тень против часовой стрелки. По умолчанию принято значение 315, которое размещает тень справа внизу от элемента

ShadowDepth

Определяет расстояние тени от содержимого в пикселях (по умолчанию — 5). Значение ShadowDepth, равное 0, создает эффект ореола вокруг содержимого

Ниже представлен пример использования данного эффекта:

<TextBlock FontSize="20" Margin="5">
  <TextBlock.Effect>
    <DropShadowEffect></DropShadowEffect>
  </TextBlock.Effect>
  <TextBlock.Text>Basic dropshadow</TextBlock.Text>
                </TextBlock>

                <TextBlock FontSize="20" Margin="5">
  <TextBlock.Effect>
    <DropShadowEffect Color="SlateBlue"></DropShadowEffect>
  </TextBlock.Effect>
  <TextBlock.Text>Light blue dropshadow</TextBlock.Text>
                </TextBlock>

                <TextBlock FontSize="20" Foreground="White" Margin="5">
  <TextBlock.Effect>
    <DropShadowEffect BlurRadius="15"></DropShadowEffect>
  </TextBlock.Effect>
  <TextBlock.Text>Blurred dropshadow with white text</TextBlock.Text>
                </TextBlock>

                <TextBlock FontSize="20" Foreground="Magenta" Margin="5">
  <TextBlock.Effect>
    <DropShadowEffect ShadowDepth="0"></DropShadowEffect>
  </TextBlock.Effect>
  <TextBlock.Text>Close dropshadow</TextBlock.Text>
                </TextBlock>

                <TextBlock FontSize="20" Foreground="LimeGreen" Margin="5">
  <TextBlock.Effect>
    <DropShadowEffect ShadowDepth="25"></DropShadowEffect>
  </TextBlock.Effect>
  <TextBlock.Text>Distant dropshadow</TextBlock.Text>
                </TextBlock>