Dica: Silverlight – Desenhando sombra em shapes (XAML)

Bem, quem já tentou fazer um efeito de sombra no Silverlight já teve que apelar para a vetorização do Expression Design que acaba não ficando muito legal e a saída em muitos casos seria utilizar imagens PNG sobrepostas ou atrás do objeto.

Bem o contrário no WPF onde temos a classe BitmapEffect que possui outra classe DropShadowBitmapEffect que já faz o serviço bem feito. Peace Sign

Porém no Silverlight existe uma maneira bem simples de fazer o efeito em linhas e shapes (círculo, quadrado, triangulos, etc). Basicamente precisamos apenas desenhar o objeto seguido de vários outros objetos com espaçamento para alguma lateral ou diagonal diminuindo gradativamente a opacidade. Veja no XAML abaixo que não há segredo:

    <Canvas>
 <Border CornerRadius="10.0" Canvas.Left="45" Canvas.Top="15"
 Width="200" Height="150" BorderThickness="1"
 BorderBrush="Black" Opacity="0.50" />
 <Border CornerRadius="11" Canvas.Left="44" Canvas.Top="14"
 Width="202" Height="152" BorderThickness="1"
 BorderBrush="Black" Opacity="0.40" />
 <Border CornerRadius="12" Canvas.Left="43" Canvas.Top="13"
 Width="204" Height="154" BorderThickness="1"
 BorderBrush="Black" Opacity="0.20" />
 <Border CornerRadius="13" Canvas.Left="42" Canvas.Top="12"
 Width="206" Height="156" BorderThickness="1"
 BorderBrush="Black" Opacity="0.10" />
 </Canvas>

image 
Mesmo com curvas na borda o resultado é bom.

Você pode ter um resultado melhor do que isso se trabalhar mais a espessura da borda, cores, outros objetos, etc. Particularmente é menos trabalhoso e melhor do que usar um PNG para o efeito. Contudo acho que em breve teremos uma propriedade para isso no Silverlight.

Caso você tenha outra dica interessante, comente!

Abraços

Rodrigo Kono
MCP – MCTS (WEB – SQL) – MSP
DevGoiás.NET Lead
INETA Brasil Board