Прозрачность

WPF --- Графика и анимация WPF --- Прозрачность

В отличие от многих старых технологий построения пользовательских интерфейсов (например, Windows Forms), WPF поддерживает настоящую прозрачность. Это значит, что если поместить несколько фигур (или других элементов) друг поверх друга и указать для них различные уровни прозрачности, то в результате будет получено именно то, чего следует ожидать. В простейшем виде это средство дает возможность создавать графический фон, который "просматривается" сквозь элементы, помещенные сверху. В более сложной форме это средство позволяет создавать многослойную анимацию и получать другие эффекты, которые было бы чрезвычайно трудно реализовать на других платформах.

Существует несколько способов сделать элемент полупрозрачным:

Установка свойства Opacity элемента

Каждый элемент, включая фигуры, наследует свойство Opacity (прозрачность) от базового класса UIElement. Прозрачность — это дробное значение от 0 до 1, где 1 означает полную непрозрачность (и принято по умолчанию), а 0 — полную прозрачность. Например, значение прозрачности 0,9 создает эффект 90% видимости (10% прозрачности). Установленная подобным образом прозрачность влияет на визуальное содержимое всего элемента.

Установка свойства Opacity кисти

Каждая кисть также наследует свойство Opacity от базового класса Brush. Устанавливая значение этого свойства от 0 до 1, можно управлять прозрачностью содержимого, которое рисует кисть, будь то сплошной цвет, градиент либо некоторого рода текстура или изображение. Поскольку для свойств Stroke и Fill фигуры используются разные кисти, можно задавать разную степень прозрачности для ее границы и поверхности.

Использование цвета, имеющего непрозрачное значение альфа-канала

Любой цвет, который имеет значение альфа-канала менее 255, является полупрозрачным. Например, можно установить полупрозрачный цвет для кисти SolidColorBrush и применять ее для рисования фона или переднего плана элемента. В некоторых ситуациях использование полупрозрачных цветов работает лучше, чем установка свойства Opacity.

Ниже показан пример с несколькими полупрозрачными слоями:

<StackPanel Margin="5">
    <StackPanel.Background>
      <ImageBrush ImageSource="celestial.jpg" Opacity="0.7"/>
    </StackPanel.Background>
    <Button Foreground="White" FontSize="16" Margin="10" 
            BorderBrush="White" Background="#60AA4030"
            Padding="20">A Semi-Transparent Button</Button>
    <Label Margin="10" FontSize="18" FontWeight="Bold" Foreground="White">Some Label Text</Label>
    <TextBox Margin="10" Background="#AAAAAAAA" Foreground="White" BorderBrush="White">A semi-transparent text box</TextBox>
    <Button Margin="10" Padding="25" BorderBrush="White" >
      <Button.Background>
        <ImageBrush ImageSource="happyface.jpg" Opacity="0.6" 
TileMode="Tile" Viewport="0,0,0.1,0.4"/>
      </Button.Background>
      <StackPanel>

        <TextBlock Foreground="#75FFFFFF"  TextAlignment="Center" 
                   FontSize="30" 
                   FontWeight="Bold" TextWrapping="Wrap" >Semi-Transparent Layers</TextBlock>
        
      </StackPanel>      
      </Button>
  </StackPanel>

В данном примере следует отметить следующие моменты:

• Окно имеет непрозрачный белый фон.

• Панель StackPanel верхнего уровня, содержащая все элементы, имеет кисть ImageBrush с изображением. Свойство Opacity этой кисти уменьшено для осветления изображения, чтобы белый фон окна просматривался сквозь него.

• Первая кнопка использует полупрозрачный красный цвет фона. (Для отображения этого цвета WPF "за кулисами" создает кисть SolidColorBrush.) Изображение просматривается сквозь фон кнопки, но ее текст непрозрачен.

• Метка (под первой кнопкой) используется в том виде как есть. По умолчанию все метки имеют полностью прозрачный фон.

• Текстовое поле использует сплошной цвет текста и сплошной цвет контура, но полупрозрачный цвет фона.

• Еще одна панель StackPanel под текстовым полем использует кисть TileBrush для создания шаблона из повторяющихся смайликов. TileBrush имеет уменьшенное значение Opacity, так что просматривается фон. Например, можно видеть изображение солнца в нижнем правом углу формы.

• Во второй панели StackPanel находится элемент TextBlock с полностью прозрачным фоном (по умолчанию) и полупрозрачным белым текстом. Присмотревшись внимательно, можно заметить, что оба фона просматриваются сквозь некоторые буквы.

Прозрачность — популярное средство WPF. Фактически благодаря простоте использования и эффективной работе, прозрачность превратилась в своего рода клише внутри WPF. По этой причине злоупотреблять им не стоит.