Como: Criar um efeito visual embaralhado
O EmbossBitmapEffect pode ser usado para aplicar mapas de rugosidade sobre o objeto visual para dar a impressão de textura e profundidade de uma fonte de luz artificial. Abaixo encontra-se uma série de exemplos que mostram o seguinte:
Como usar marcação simples para aplicar o efeito sobre um objeto.
Como usar um Style para aplicar o efeito a um ou mais objetos.
Como usar código para aplicar o efeito sobre um objeto.
Como usar uma animação para animar as propriedades de um efeito aplicado sobre um objeto.
Observação: Todos os exemplos a seguir se aplicam apenas um único efeito a um objeto. Para aplicar vários efeitos, você pode usar BitmapEffectGroup. Consulte Como: Criar vários efeitos visuais para obter exemplos.
Exemplo
O exemplo a seguir mostra como usar um EmbossBitmapEffect para criar uma imagem em relevo.
<Page xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml">
<StackPanel>
<Image Width="360" Source="/images/WaterLilies.jpg" Margin="10" >
<Image.BitmapEffect>
<!-- <BitmapEffectGroup> would go here if you wanted to apply more
then one effect to the TextBox. However, in this example only
one effect is being applied so BitmapEffectGroup does not need
to be included. -->
<!-- The Relief property determines the amount of relief of the emboss.
The valid range of values is 0-1 with 0 having the least relief and
1 having the most. The default value is 0.44. The LightAngle determines
from what direction the artificial light is cast upon the embossed
object which effects shadowing. The valid range is from 0-360 (degrees)
with 0 specifying the right-hand side of the object and successive values
moving counter-clockwise around the object. -->
<EmbossBitmapEffect Relief="0.8" LightAngle="320" />
</Image.BitmapEffect>
</Image>
</StackPanel>
</Page>
O exemplo a seguir mostra como usar um Style para aplicar um EmbossBitmapEffect a qualquer Image na página.
<Page xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml">
<!-- Resources define Styles for the entire page. -->
<Page.Resources>
<!-- This style applies to any Image on the page. -->
<Style TargetType="{x:Type Image}">
<Setter Property="BitmapEffect" >
<Setter.Value>
<EmbossBitmapEffect Relief="0.8" />
</Setter.Value>
</Setter>
</Style>
</Page.Resources>
<StackPanel>
<!-- The Style defined above applies to this Image which applies
the EmbossBitmapEffect. -->
<Image Width="360" Source="/images/WaterLilies.jpg" Margin="10" />
</StackPanel>
</Page>
O exemplo a seguir mostra como usar o código para aplicar um EmbossBitmapEffect sobre um Image quando ele é carregado.
A seguir, veja o Extensible Application Markup Language (XAML) para o exemplo.
<Page xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
x:Class="SDKSample.EmbossExample" >
<StackPanel>
<!-- When this image loads, an EmbossBitmapEffect is applied to it. -->
<Image Width="360" Loaded="OnLoadEmbossImage" Source="/images/WaterLilies.jpg" />
</StackPanel>
</Page>
A seguir está o código que trata o evento para a marcação.
using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;
using System.Windows.Input;
using System.Windows.Media.Effects;
namespace SDKSample
{
public partial class EmbossExample : Page
{
// Add Bevel effect.
void OnLoadEmbossImage(object sender, RoutedEventArgs args)
{
// Get a reference to the Button.
Image myImage = (Image)sender;
// Initialize a new BevelBitmapEffect that will be applied
// to the Button.
EmbossBitmapEffect myEmbossEffect = new EmbossBitmapEffect();
// The LightAngle determines from what direction the artificial
// light is cast upon the embossed object which effects shadowing.
// The valid range is from 0-360 (degrees)with 0 specifying the
// right-hand side of the object and successive values moving
// counter-clockwise around the object.
// Set the LightAngle to 320 degrees (lower right side).
myEmbossEffect.LightAngle = 320;
// The Relief property determines the amount of relief of the emboss.
// The valid range of values is 0-1 with 0 having the least relief and
// 1 having the most. The default value is 0.44.
myEmbossEffect.Relief = 0.8;
// Apply the bitmap effect to the Image.
myImage.BitmapEffect = myEmbossEffect;
}
}
}
O exemplo a seguir mostra como animar a propriedade LightAngle do EmbossBitmapEffect para que a luz artificial gire em torno da imagem em relevo, o que faz com que as sombras lançadas pelo alto-relevo se desloquem.
<Page xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml" >
<StackPanel>
<Image Source="/images/WaterLilies.jpg" Width="600" Margin="10" >
<Image.BitmapEffect>
<EmbossBitmapEffect x:Name="myEmbossBitmapEffect" Relief="0.8" LightAngle="0" />
</Image.BitmapEffect>
<Image.Triggers>
<EventTrigger RoutedEvent="Image.Loaded">
<BeginStoryboard>
<Storyboard>
<!-- Animate the LightAngle so that the artificial light
orbits around the embossed image which makes the
shadows cast by the emboss shift accordingly. -->
<DoubleAnimation
Storyboard.TargetName="myEmbossBitmapEffect"
Storyboard.TargetProperty="LightAngle"
From="0" To="360" Duration="0:0:3" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Image.Triggers>
</Image>
</StackPanel>
</Page>
Consulte também
Tarefas
Como: Criar um Efeito de Brilho nas Bordas Externas de um Objeto
Como: Apply a Blur Effect to a Visual
Como: Create a Drop Shadow Visual Effect
Como: Criar um efeito visual de chanfro
Como: Criar vários efeitos visuais
Como: Animate Multiple Visual Effects