WPF SkewTransform in VB.NET

SkewTransform is used to skew or shear an element. Shear can be used to add depth to elements to give them a 3-D look.
  • 1858

SkewTransform is used to skew or shear an element. Shear can be used to add depth to elements to give them a 3-D look.

The AngleX and AngleY properties are used to specify the skew angle of the x-axis and y-axis, and to skew the current coordinate system along these axes. The CenterX and CenterY properties represent the X and Y coordinates of the center point.

The code listed in Listing creates two rectangles with same position and sizes accept the second rectangle is skewed at 45 degrees towards x-axis.  

 <Rectangle Width="200" Height="50" Fill="Yellow" Margin="61,27,117,184" />
<
Rectangle Width="200" Height="50" Fill="Blue"  Opacity="0.5" Margin="59,101,119,110">
    <Rectangle.RenderTransform>
        <SkewTransform CenterX="0" CenterY="0" AngleX="45" AngleY="0" />
    </Rectangle.RenderTransform>
</
Rectangle>

The output of Listing looks like Figure 1.

SkewImg.jpg
 

Figure 1

The code listed in Listing creates a SkewTransform object dynamically and set it as RenderTransform property of a Rectangle. The output looks like Figure 1.

    Private Sub SkewTransformSample()
        Dim originalRectangle As New Rectangle()
        originalRectangle.Width = 200
        originalRectangle.Height = 50
        originalRectangle.Fill = Brushes.Yellow
        LayoutRoot.Children.Add(originalRectangle)

        Dim skewedRectangle As New Rectangle()
        skewedRectangle.Width = 200
        skewedRectangle.Height = 50
        skewedRectangle.Fill = Brushes.Blue
        skewedRectangle.Opacity = 0.5
        Dim skewTransform1 As New SkewTransform(45, 0, -50, 50)
        skewedRectangle.RenderTransform = skewTransform1

        LayoutRoot.Children.Add(skewedRectangle)
    End Sub

Categories

More Articles

© 2020 DotNetHeaven. All rights reserved.