Click here to Skip to main content
15,895,746 members
Articles / Desktop Programming / WPF

WPF Tilt Shader Effect

Rate me:
Please Sign up or sign in to vote.
4.86/5 (4 votes)
27 May 2012CPOL2 min read 18K   581   11  
Non affine transform for WPF without 3D.
Imports System.Windows.Media.Animation

Class Window1

    Public Eff As TiltEffect

    Private Sub Window1_Loaded(ByVal sender As Object, ByVal e As System.Windows.RoutedEventArgs) Handles Me.Loaded
        Eff = New TiltEffect
        ImgEff.Source = New BitmapImage(New Uri(My.Application.Info.DirectoryPath & "\1.jpg"))
        ImgEff.Effect = Eff
        Grid1.Background = New SolidColorBrush(Color.FromArgb(150, 200, 220, 255))
    End Sub

    Public Sub HideBorders()


        Border1.Visibility = Windows.Visibility.Collapsed
        Border2.Visibility = Windows.Visibility.Collapsed
        Border3.Visibility = Windows.Visibility.Collapsed
        Border4.Visibility = Windows.Visibility.Collapsed

    End Sub

    Private Sub Border1_MouseDown(ByVal sender As Object, ByVal e As System.Windows.Input.MouseButtonEventArgs) Handles Border1.MouseDown, Border2.MouseDown, Border3.MouseDown, Border4.MouseDown
        If e.ChangedButton = MouseButton.Left Then
            CType(sender, Border).CaptureMouse()
            e.Handled = True
        End If
    End Sub
    Private Sub Border1_MouseMove(ByVal sender As Object, ByVal e As System.Windows.Input.MouseEventArgs) Handles Border1.MouseMove, Border2.MouseMove, Border3.MouseMove, Border4.MouseMove
        If e.LeftButton = MouseButtonState.Pressed And CType(sender, Border).IsMouseCaptured Then
            Dim s As Border = CType(sender, Border)
            Dim p As Point = e.GetPosition(s)
            Dim res As Point = New Point(s.Margin.Left + p.X - 5, s.Margin.Top + p.Y - 5)

            s.Margin = New Thickness(res.X, res.Y, 1, 1)

            Eff.SetValue(TiltEffect.Pt1Property, New Point((Border1.Margin.Left + 5) / Grid1.ActualWidth, (Border1.Margin.Top + 5) / Grid1.ActualHeight))
            Eff.SetValue(TiltEffect.Pt2Property, New Point((Border2.Margin.Left + 5) / Grid1.ActualWidth, (Border2.Margin.Top + 5) / Grid1.ActualHeight))
            Eff.SetValue(TiltEffect.Pt3Property, New Point((Border3.Margin.Left + 5) / Grid1.ActualWidth, (Border3.Margin.Top + 5) / Grid1.ActualHeight))
            Eff.SetValue(TiltEffect.Pt4Property, New Point((Border4.Margin.Left + 5) / Grid1.ActualWidth, (Border4.Margin.Top + 5) / Grid1.ActualHeight))

            e.Handled = True
        End If
    End Sub
    Private Sub Border1_MouseUp(ByVal sender As Object, ByVal e As System.Windows.Input.MouseButtonEventArgs) Handles Border1.MouseUp, Border2.MouseUp, Border3.MouseUp, Border4.MouseUp
        If e.ChangedButton = MouseButton.Left Then
            CType(sender, Border).ReleaseMouseCapture()
            e.Handled = True
        End If
    End Sub


    Private Sub Grid1_SizeChanged(ByVal sender As Object, ByVal e As System.Windows.SizeChangedEventArgs) Handles Grid1.SizeChanged
        Dim p As Point

        If Eff Is Nothing Then Return

        p = Eff.GetValue(TiltEffect.Pt1Property)
        Border1.Margin = New Thickness(Grid1.ActualWidth * p.X, Grid1.ActualHeight * p.Y, 0, 0)

        p = Eff.GetValue(TiltEffect.Pt2Property)
        Border2.Margin = New Thickness(Grid1.ActualWidth * p.X, Grid1.ActualHeight * p.Y, 0, 0)

        p = Eff.GetValue(TiltEffect.Pt3Property)
        Border3.Margin = New Thickness(Grid1.ActualWidth * p.X, Grid1.ActualHeight * p.Y, 0, 0)

        p = Eff.GetValue(TiltEffect.Pt4Property)
        Border4.Margin = New Thickness(Grid1.ActualWidth * p.X, Grid1.ActualHeight * p.Y, 0, 0)

    End Sub

    Private Sub Button2_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles Button2.Click
        HideBorders()

        Eff.BeginAnimation(TiltEffect.Pt1Property, New PointAnimation(New Point(0, 0), New Point(0.4, 0.4), New Duration(TimeSpan.FromMilliseconds(100 + Rnd() * 900))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})
        Eff.BeginAnimation(TiltEffect.Pt2Property, New PointAnimation(New Point(1, 0), New Point(0.6, 0.4), New Duration(TimeSpan.FromMilliseconds(100 + Rnd() * 900))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})
        Eff.BeginAnimation(TiltEffect.Pt3Property, New PointAnimation(New Point(0, 1), New Point(0.4, 0.6), New Duration(TimeSpan.FromMilliseconds(100 + Rnd() * 900))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})
        Eff.BeginAnimation(TiltEffect.Pt4Property, New PointAnimation(New Point(1, 1), New Point(0.6, 0.6), New Duration(TimeSpan.FromMilliseconds(100 + Rnd() * 900))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})

    End Sub

    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles Button1.Click
        HideBorders()

        Eff.BeginAnimation(TiltEffect.Pt1Property, New PointAnimation(New Point(0, 0), New Point(0.4, 0.4), New Duration(TimeSpan.FromMilliseconds(400))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})
        Eff.BeginAnimation(TiltEffect.Pt2Property, New PointAnimation(New Point(1, 0), New Point(0.6, 0.4), New Duration(TimeSpan.FromMilliseconds(400))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})
        Eff.BeginAnimation(TiltEffect.Pt3Property, New PointAnimation(New Point(0, 1), New Point(0.4, 0.6), New Duration(TimeSpan.FromMilliseconds(400))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})
        Eff.BeginAnimation(TiltEffect.Pt4Property, New PointAnimation(New Point(1, 1), New Point(0.6, 0.6), New Duration(TimeSpan.FromMilliseconds(400))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})

    End Sub

    Private Sub Button3_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles Button3.Click


        HideBorders()

        Eff.BeginAnimation(TiltEffect.Pt1Property, New PointAnimation(New Point(0, 0), New Point(0.5, -0.2), New Duration(TimeSpan.FromMilliseconds(400))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})
        Eff.BeginAnimation(TiltEffect.Pt2Property, New PointAnimation(New Point(1, 0), New Point(0.5, 0.2), New Duration(TimeSpan.FromMilliseconds(400))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})
        Eff.BeginAnimation(TiltEffect.Pt3Property, New PointAnimation(New Point(0, 1), New Point(0.5, 1.2), New Duration(TimeSpan.FromMilliseconds(400))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})
        Eff.BeginAnimation(TiltEffect.Pt4Property, New PointAnimation(New Point(1, 1), New Point(0.5, 0.8), New Duration(TimeSpan.FromMilliseconds(400))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})



    End Sub

    Private Sub Button4_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles Button4.Click

        HideBorders()

        Eff.BeginAnimation(TiltEffect.Pt1Property, New PointAnimation(New Point(0, 0), New Point(0, 0), New Duration(TimeSpan.FromMilliseconds(400))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})
        Eff.BeginAnimation(TiltEffect.Pt2Property, New PointAnimation(New Point(1, 0), New Point(0, 0.3), New Duration(TimeSpan.FromMilliseconds(400))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})
        Eff.BeginAnimation(TiltEffect.Pt3Property, New PointAnimation(New Point(0, 1), New Point(0, 1), New Duration(TimeSpan.FromMilliseconds(400))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})
        Eff.BeginAnimation(TiltEffect.Pt4Property, New PointAnimation(New Point(1, 1), New Point(0, 0.7), New Duration(TimeSpan.FromMilliseconds(400))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})




    End Sub

    Private Sub Button5_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles Button5.Click

        HideBorders()

        Eff.BeginAnimation(TiltEffect.Pt1Property, New PointAnimation(New Point(0, 0), New Point(0.4, 0.2), New Duration(TimeSpan.FromMilliseconds(400))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})
        Eff.BeginAnimation(TiltEffect.Pt2Property, New PointAnimation(New Point(1, 0), New Point(0.9, 0.3), New Duration(TimeSpan.FromMilliseconds(400))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})
        Eff.BeginAnimation(TiltEffect.Pt3Property, New PointAnimation(New Point(0, 1), New Point(0.4, 0.8), New Duration(TimeSpan.FromMilliseconds(400))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})
        Eff.BeginAnimation(TiltEffect.Pt4Property, New PointAnimation(New Point(1, 1), New Point(0.9, 0.7), New Duration(TimeSpan.FromMilliseconds(400))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})


    End Sub

    Private Sub Button6_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles Button6.Click
        HideBorders()

        Eff.BeginAnimation(TiltEffect.Pt1Property, New PointAnimation(New Point(0, 0), New Point(0.4, 0.4), New Duration(TimeSpan.FromMilliseconds(400))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})
        Eff.BeginAnimation(TiltEffect.Pt2Property, New PointAnimation(New Point(1, 0), New Point(0.7, 0.3), New Duration(TimeSpan.FromMilliseconds(400))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})
        Eff.BeginAnimation(TiltEffect.Pt3Property, New PointAnimation(New Point(0, 1), New Point(0.3, 0.7), New Duration(TimeSpan.FromMilliseconds(400))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})
        Eff.BeginAnimation(TiltEffect.Pt4Property, New PointAnimation(New Point(1, 1), New Point(0.8, 0.8), New Duration(TimeSpan.FromMilliseconds(400))) With {.AutoReverse = True, .RepeatBehavior = RepeatBehavior.Forever, .AccelerationRatio = 0.5, .DecelerationRatio = 0.5})


    End Sub
End Class

By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.

If a file you wish to view isn't highlighted, and is a text file (not binary), please let us know and we'll add colourisation support for it.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Software Developer (Senior)
Egypt Egypt
DotNet developer

Graphics researches and GPU Acceleration Developer.

Full stack web developer.

Bachelor's degree of Medicine and Surgery.

Comments and Discussions