For the past 2 days, I have been attending WPF workshop organized by MDEC / NTDC. I was clueless on WPF and since Puan R has been asking me to attend it, I registered it knowing that i need to come back from singapore earlier. As our project will be using Silverlight, a subset of WPF (Windows Presentation Foundation) as part of our a Rich Internet Application strategy, so WPF subject is quite important topic for us. This is one of the pre-seed programme benefits that we have received recently. I hope many more to come in the future.
For WPF, I was exposed to fundamentals of WPF about the XAML (Extensible Application Markup Language) and was able to create simple animations and pretty interesting controls which never could have been so easily done via Winform or javascripts. Though XAML is at first hard to decipher, but using tools such as Expression Blend 2 and Visual Studio 2008 ( the intellisense in VS2008 does help alot which Blend don't have) does help me learn about XAML much easier and faster.
Well WPF is all about XAML and without it, it will render it useless. I learned alot about WPF concepts such as layouts, templates, controls, binding, events, commands and many many many more. I now know more about WPF capabilites on 3D, manipulating graphics, controls and many more. I also learn about differences on WPF standalone (exe), WPF Browser Application and the more famous plugin, Silverlight.
Tomorrow i'll be learning more about data binding and 3D topic. Hope my trainer, Mr Lee Daqing can cover all the topics by end of tomorrow. Below is my first WPF application which has a circle bouncing up and down mimicing a bouncing ball although my example will ignore gravity as it will bounce indefinitely but hey this is my first application. Enjoy and comments on my XAML on how to improve it further.
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="WpfApplication2.Window2"
x:Name="Window"
Title="Window2"
Width="640" Height="480"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Window.Resources>
<Storyboard x:Key="Storyboard1">
<DoubleAnimationUsingKeyFrames BeginTime="00:00:00"
Storyboard.TargetName="ellipse"
Storyboard.TargetProperty="(UIElement.RenderTransform)
.(TransformGroup.Children)[3].(TranslateTransform.Y)"
AutoReverse="True" RepeatBehavior="Forever" >
<SplineDoubleKeyFrame KeyTime="00:00:01" Value="220" KeySpline="0,0,1,0"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
<Storyboard x:Key="StopObject"/>
</Window.Resources>
<Window.Triggers>
<EventTrigger RoutedEvent="UIElement.MouseLeftButtonDown"
SourceName="ellipse">
<BeginStoryboard Storyboard="{StaticResource Storyboard1}"
x:Name="Storyboard1_BeginStoryboard"/>
</EventTrigger>
<EventTrigger RoutedEvent="FrameworkElement.Loaded"/>
<EventTrigger RoutedEvent="Mouse.MouseEnter"
SourceName="ellipse">
<PauseStoryboard
BeginStoryboardName="Storyboard1_BeginStoryboard"/>
</EventTrigger>
</Window.Triggers>
<Grid x:Name="LayoutRoot">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Ellipse Fill="#FF5055D2" Stroke="#FF000000"
HorizontalAlignment="Left" Margin="62.72,112,0,0" Width="81"
RenderTransformOrigin="0.485,4.014" x:Name="ellipse"
VerticalAlignment="Top" Height="70">
<Ellipse.RenderTransform>
<TransformGroup>
<ScaleTransform ScaleX="1" ScaleY="1"/>
<SkewTransform AngleX="0" AngleY="0"/>
<RotateTransform Angle="0"/>
<TranslateTransform X="0" Y="0"/>
</TransformGroup>
</Ellipse.RenderTransform>
</Ellipse>
</Grid>
</Window>
In next article, I will explore on how to make a object to be moveable using mouse drap on runtime. Happy Coding!
Posts
