Como: Inclinar um elemento
Este exemplo mostra como usar um SkewTransform para inclinar um elemento. Um skew,que também é conhecido como um Shear, é uma transformação que estende o espaço de coordenadas de maneira não uniforme. Um uso típico de uma SkewTransform é para simular profundidade 3-D em objetos 2-D.
Use as propriedades CenterX e CenterY para especificar o ponto central da SkewTransform.
Use as propriedades AngleX e AngleY para especificar o ângulo de inclinação dos eixos x e y, e para inclinar o sistema de coordenadas atual ao longo desses eixos.
Para prever o efeito de uma transformação skew, considere que AngleX inclina valores do eixo x relativo ao sistema de coordenadas original. Portanto, para um AngleX de 30, o eixo y gira 30 graus pela origem e inclina os valores de x em 30 graus a partir dessa origem. Da mesma forma, um AngleY de 30 inclina os valores de y da shape em 30 graus a partir da origem. Observe que isso é não o mesmo efeito que transladar (mover) o sistema de coordenadas por 30 graus no x ou y.
O exemplo seguinte aplica uma skew horizontal de 45 graus para um Rectangle de um ponto central em (0,0).
Exemplo
<Rectangle
Height="50" Width="50" Fill="#CCCCCCFF"
Stroke="Blue" StrokeThickness="2"
Canvas.Left="100" Canvas.Top="100">
<Rectangle.RenderTransform>
<!-- Applies a horizontal skew of 45 degrees
from a center point of (0,0). -->
<SkewTransform CenterX="0" CenterY="0" AngleX="45" AngleY="0" />
</Rectangle.RenderTransform>
</Rectangle>
O exemplo seguinte aplica uma skew horizontal de 45 graus para um Rectangle de um ponto central em (25,25).
<Rectangle Height="50" Width="50" Fill="#CCCCCCFF"
Canvas.Left="100" Canvas.Top="100"
Stroke="Blue" StrokeThickness="2">
<Rectangle.RenderTransform>
<!-- Applies a horizontal skew of 45 degrees
from a center point of (25,25). -->
<SkewTransform CenterX="25" CenterY="25" AngleX="45" AngleY="0" />
</Rectangle.RenderTransform>
</Rectangle>
O exemplo seguinte aplica uma skew horizontal de 45 graus para um Rectangle de um ponto central em (25,25).
<Rectangle Height="50" Width="50" Fill="#CCCCCCFF"
Stroke="Blue" StrokeThickness="2"
Canvas.Left="100" Canvas.Top="100">
<Rectangle.RenderTransform>
<!-- Applies a vertical skew of 45 degrees
from a center point of (25,25). -->
<SkewTransform CenterX="25" CenterY="25" AngleX="0" AngleY="45" />
</Rectangle.RenderTransform>
</Rectangle>
A ilustração a seguir mostra as diferentes skews que são usadas no exemplo.
Os três exemplos SkewTransform ilustrados
For the complete sample, see Exemplo de transformações 2-D.
Consulte também
Conceitos
Visão Geral sobre Transformações