Your SlideShare is downloading. ×
0
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
WPF L02-Graphics, Binding and Animation
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

WPF L02-Graphics, Binding and Animation

3,127

Published on

Published in: Software, Business
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
3,127
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
116
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Mohammad Shaker www.mohammadshaker.com WPF Starter Course @ZGTRShaker 2011, 2012, 2013, 2014 WPF Showcase L02 –Graphics, Binding (MVVM) and The Basis of Animation
  • 2. Graphics
  • 3. Graphics
  • 4. Canvas –The Best Thing To Draw In <Windowx:Class="CanvasDemo.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="Canvas Demo" Height="150" Width="250"> <CanvasBackground="Yellow"> </Canvas> </Window>
  • 5. Panel <Window x:Class="PanelDemo.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="Panel Demo" Width="250" Height="150"> <Canvas Name="MyCanvas"> <Ellipse Canvas.Left="10" Canvas.Top="5" Width="100" Height="100" Stroke="Black" Fill="Red"/> <Ellipse Canvas.Left="60" Canvas.Top="5" Width="100" Height="100" Stroke="Black" Fill="Yellow"/> <Ellipse Canvas.Left="110" Canvas.Top="5" Width="100" Height="100" Stroke="Black" Fill="Green"/> </Canvas> </Window>
  • 6. Panel –From Code Behind private void Window_Loaded(object sender, RoutedEventArgse) { Ellipse ellipse= new Ellipse(); ellipse.Width= 200; ellipse.Height= 50; ellipse.Stroke= Brushes.Black; ellipse.Fill= Brushes.Blue; MyCanvas.Children.Add(ellipse); Canvas.SetLeft(ellipse, 10); Canvas.SetTop(ellipse, 30); }
  • 7. Ellipse
  • 8. Rectangle
  • 9. Scaling Shapes with a Viewbox <ViewboxGrid.Row="1" HorizontalAlignment="Left" > <Canvas> </Canvas> </Viewbox>
  • 10. Line <Line Stroke="Blue" X1="0" Y1="0" X2="10" Y2="100“ Canvas.Left="5" Canvas.Top="100"> </Line>
  • 11. PolyLine
  • 12. PolyLine •StrokeDashArray="2 1"
  • 13. Bézier Curves
  • 14. Brushes
  • 15. Transparency
  • 16. Transparency
  • 17. BlurEffect <Button Content="Blurred (Radius=2)" Padding="5" Margin="3"> <Button.Effect> <BlurEffectRadius="2"></BlurEffect> </Button.Effect> </Button>
  • 18. Transforming Shapes
  • 19. Transforming Shapes
  • 20. WPF Content Heaven
  • 21. WPF Content Heaven
  • 22. WPF Content Heaven
  • 23. WPF Content Heaven
  • 24. WPF Content Heaven
  • 25. Positioning in Layouts
  • 26. Positioning public MainWindow() { InitializeComponent(); TextBoxt = new TextBox(); t.Text= "Hi"; t.RenderTransform= new TranslateTransform(10, 10); grid.Children.Add(t); }
  • 27. Positioning
  • 28. Positioning Ellipse ellipse= new Ellipse { Width = width, Height = height }; ellipse.RenderTransform= new TranslateTransform(desiredX,desiredY); Ellipse ellipse= new Ellipse { Width = width, Height = height }; double left = desiredX; double top = desiredY; ellipse.Margin= new Thickness(left, top, 0, 0); Ellipse ellipse= new Ellipse { Width = width, Height = height }; canvas.SetLeft(ellipse, desiredX); canvas.SetTop(ellipse, desiredY);
  • 29. Positioning –Transforms
  • 30. Ellipse ellipse= new Ellipse { Width = width, Height = height }; ellipse.RenderTransform= new TranslateTransform(desiredX,desiredY); Positioning Ellipse ellipse= new Ellipse { Width = width, Height = height }; ellipse.RenderTransform= new TranslateTransform(desiredX,desiredY); ellipse.RenderTransform= new TranslateTransform(desiredX,desiredY);
  • 31. Ellipse ellipse= new Ellipse { Width = width, Height = height }; ellipse.RenderTransform= new TranslateTransform(desiredX,desiredY); Positioning Ellipse ellipse= new Ellipse { Width = width, Height = height }; ellipse.RenderTransform= new TranslateTransform(desiredX,desiredY); ellipse.RenderTransform= new TranslateTransform(desiredX,desiredY);
  • 32. Routed Events
  • 33. Routed Events Routed events normally appear as pair. The first is a tunnellingevent calledPreviewMouseDownand the second is the bubbling calledMouseDown. They don't stop routing if they reach an event handler. To stop routing then you have to set e.Handled= true;
  • 34. Routed Events •Tunneling –The event is raised on the root element and navigates down to the visual tree until it reaches the source element or until the tunneling is stopped by marking the event as handeld. By naming convention it is calledPreview...and appears before corresponding bubbling event. •Bubbling –The event is raised on the source element and navigates up to the visual tree until it reaches the root element or until the bubbling is stopped by marking the event as handled. The bubbling event is raised after the tunneling event. •Direct –The event is raised on the source element and must be handled on the source element itself. This behavior is the same as normal.NET events.
  • 35. Multi-touch Input
  • 36. Multi-touch Input
  • 37. Visual and Effects
  • 38. Visual and Effects
  • 39. Drag-and-Drop
  • 40. Drag-and-Drop nice task!
  • 41. Drag-and-Drop •With, private void lblTarget_Drop(object sender, DragEventArgse) { ((Label)sender).Content = e.Data.GetData(DataFormats.Text); }
  • 42. Drag-and-Drop
  • 43. Drag-and-Drop Shapes
  • 44. Drag-and-Drop Shapes •Let’s have just a rectangle names “myRectangle”
  • 45. Drag-and-Drop Shapes private boolIsDragging= false; private void Rect_MouseDown(object sender, MouseButtonEventArgse) { Rectangle rectangle= (Rectangle)sender; IsDragging= true; } private void Rect_PreviewMouseMove(object sender, MouseEventArgse) { if (IsDragging) { Canvas.SetLeft(myRectangle, e.GetPosition(canvas).X -myRectangle.Width/2); Canvas.SetTop(myRectangle, e.GetPosition(canvas).Y -myRectangle.Height/2); } } private void Rect_PreviewMouseUp(object sender, MouseButtonEventArgse) { if (IsDragging) { Canvas.SetLeft(myRectangle, e.GetPosition(canvas).X -myRectangle.Width/2); Canvas.SetTop(myRectangle, e.GetPosition(canvas).Y -myRectangle.Height/2); IsDragging= false; } }
  • 46. Binding
  • 47. WPF Content HeavenBinding and MVVM
  • 48. MVVMModel-View View-Model
  • 49. Visit and know more about http://msdn.microsoft.com/en-us/library/ff648465.aspx Prism provides guidance to help you more easily design and build, flexible, and easy-to-maintain client business apps that run on Windows Runtime, Windows Presentation Foundation (WPF) desktop, Silverlight, or Windows Phone 7. These apps may start small and evolve over time. Visit also: http://compositewpf.codeplex.com/
  • 50. Data Binding
  • 51. Data Binding
  • 52. Data Binding
  • 53. Data Binding •Another example
  • 54. Data Binding •Another example
  • 55. Steve Jobshad it back in 1997! http://youtu.be/QhhFQ-3w5tE?t=24m(min: 24)
  • 56. ListViewTemplate <Windowx:Class="WpfTutorialSamples.ListView_control.ListViewItemTemplateSample" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="ListViewItemTemplateSample"Height="150"Width="350"> <Grid> <ListViewMargin="10"Name="lvDataBinding"> <ListView.ItemTemplate> <DataTemplate> <WrapPanel> <TextBlockText="Name: "/> <TextBlockText="{Binding Name}"FontWeight="Bold"/> <TextBlockText=", "/> <TextBlockText="Age: "/> <TextBlockText="{Binding Age}"FontWeight="Bold"/> <TextBlockText=" ("/> <TextBlockText="{Binding Mail}"TextDecorations="Underline"Foreground="Blue"Cursor="Hand"/> <TextBlockText=")"/> </WrapPanel> </DataTemplate> </ListView.ItemTemplate> </ListView> </Grid> </Window> publicclassUser{ publicstringName{get;set;} publicintAge{get;set;} publicstringMail{get;set;} } lvDataBinding.ItemsSource=items;
  • 57. ListViewTemplate <Windowx:Class="WpfTutorialSamples.ListView_control.ListViewGridViewSample" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="ListViewGridViewSample"Height="200"Width="400"> <Grid> <ListViewMargin="10"Name="lvUsers"> <ListView.View> <GridView> <GridViewColumnHeader="Name"Width="120"DisplayMemberBinding="{Binding Name}"/> <GridViewColumnHeader="Age"Width="50"DisplayMemberBinding="{Binding Age}"/> <GridViewColumnHeader="Mail"Width="150"DisplayMemberBinding="{Binding Mail}"/> </GridView> </ListView.View> </ListView> </Grid> </Window>
  • 58. A Complete ExampleFrom Windows Phone Slidehttp://www.slideshare.net/ZGTRZGTR/mobile-software-engineering-crash-course-c06-windowsphone
  • 59. A Complete ExampleBinding, Templates and XML Examplehttp://www.creativebloq.com/mobile/build-your-first-windows-phone-7-app-3122831
  • 60. A Complete ExampleBinding, Templates and XML Example
  • 61. Binding, Templates and XML Example <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> <Grid.RowDefinitions> <RowDefinitionHeight="74*" /> <RowDefinitionHeight="533*" /> </Grid.RowDefinitions> <TextBoxGrid.RowSpan="2" Height="72" HorizontalAlignment="Left" Margin="9,8,0,0" Name="txtUserName" VerticalAlignment="Top" Width="294" /> <Button Content="Lookup" Grid.RowSpan="2" Height="72" HorizontalAlignment="Left" Margin="296,8,0,0" Name="btnLookupUser" VerticalAlignment="Top" Width="160" Click="btnLookupUser_Click" /> <ListBoxName="lstTwitter" Grid.Row="1" Margin="10, 10, 10, 10"> <ListBox.ItemTemplate> <DataTemplate> <StackPanelOrientation="Horizontal" Height="110" Margin="-10,-10,-10,-10"> <Image Source="{Binding ImageSource}" Height="73" Width="73" VerticalAlignment="Top" Margin="10,10,8,10"/> <TextBlockText="{Binding Message}" Margin="10" TextWrapping="Wrap" FontSize="18" Width="350" /> </StackPanel> </DataTemplate> </ListBox.ItemTemplate> </ListBox> </Grid>
  • 62. Binding, Templates and XML Example <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> <Grid.RowDefinitions> <RowDefinitionHeight="74*" /> <RowDefinitionHeight="533*" /> </Grid.RowDefinitions> <TextBoxGrid.RowSpan="2" Height="72" HorizontalAlignment="Left" Margin="9,8,0,0" Name="txtUserName" VerticalAlignment="Top" Width="294" /> <Button Content="Lookup" Grid.RowSpan="2" Height="72" HorizontalAlignment="Left" Margin="296,8,0,0" Name="btnLookupUser" VerticalAlignment="Top" Width="160" Click="btnLookupUser_Click" /> <ListBoxName="lstTwitter" Grid.Row="1" Margin="10, 10, 10, 10"> <ListBox.ItemTemplate> <DataTemplate> <StackPanelOrientation="Horizontal" Height="110" Margin="-10,-10,-10,-10"> <Image Source="{Binding ImageSource}" Height="73" Width="73" VerticalAlignment="Top" Margin="10,10,8,10"/> <TextBlockText="{Binding Message}" Margin="10" TextWrapping="Wrap" FontSize="18" Width="350" /> </StackPanel> </DataTemplate> </ListBox.ItemTemplate> </ListBox> </Grid>
  • 63. Binding, Templates and XML Example <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> <Grid.RowDefinitions> <RowDefinitionHeight="74*" /> <RowDefinitionHeight="533*" /> </Grid.RowDefinitions> <TextBoxGrid.RowSpan="2" Height="72" HorizontalAlignment="Left" Margin="9,8,0,0" Name="txtUserName" VerticalAlignment="Top" Width="294" /> <Button Content="Lookup" Grid.RowSpan="2" Height="72" HorizontalAlignment="Left" Margin="296,8,0,0" Name="btnLookupUser" VerticalAlignment="Top" Width="160" Click="btnLookupUser_Click" /> <ListBoxName="lstTwitter" Grid.Row="1" Margin="10, 10, 10, 10"> <ListBox.ItemTemplate> <DataTemplate> <StackPanelOrientation="Horizontal" Height="110" Margin="-10,-10,-10,-10"> <Image Source="{Binding ImageSource}" Height="73" Width="73" VerticalAlignment="Top" Margin="10,10,8,10"/> <TextBlockText="{Binding Message}" Margin="10" TextWrapping="Wrap" FontSize="18" Width="350" /> </StackPanel> </DataTemplate> </ListBox.ItemTemplate> </ListBox> </Grid>
  • 64. Binding, Templates and XML Example <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> <Grid.RowDefinitions> <RowDefinitionHeight="74*" /> <RowDefinitionHeight="533*" /> </Grid.RowDefinitions> <TextBoxGrid.RowSpan="2" Height="72" HorizontalAlignment="Left" Margin="9,8,0,0" Name="txtUserName" VerticalAlignment="Top" Width="294" /> <Button Content="Lookup" Grid.RowSpan="2" Height="72" HorizontalAlignment="Left" Margin="296,8,0,0" Name="btnLookupUser" VerticalAlignment="Top" Width="160" Click="btnLookupUser_Click" /> <ListBoxName="lstTwitter" Grid.Row="1" Margin="10, 10, 10, 10"> <ListBox.ItemTemplate> <DataTemplate> <StackPanelOrientation="Horizontal" Height="110" Margin="-10,-10,-10,-10"> <Image Source="{Binding ImageSource}" Height="73" Width="73" VerticalAlignment="Top" Margin="10,10,8,10"/> <TextBlockText="{Binding Message}" Margin="10" TextWrapping="Wrap" FontSize="18" Width="350" /> </StackPanel> </DataTemplate> </ListBox.ItemTemplate> </ListBox> </Grid>
  • 65. Binding, Templates and XML Example <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> <Grid.RowDefinitions> <RowDefinitionHeight="74*" /> <RowDefinitionHeight="533*" /> </Grid.RowDefinitions> <TextBoxGrid.RowSpan="2" Height="72" HorizontalAlignment="Left" Margin="9,8,0,0" Name="txtUserName" VerticalAlignment="Top" Width="294" /> <Button Content="Lookup" Grid.RowSpan="2" Height="72" HorizontalAlignment="Left" Margin="296,8,0,0" Name="btnLookupUser" VerticalAlignment="Top" Width="160" Click="btnLookupUser_Click" /> <ListBoxName="lstTwitter" Grid.Row="1" Margin="10, 10, 10, 10"> <ListBox.ItemTemplate> <DataTemplate> <StackPanelOrientation="Horizontal" Height="110" Margin="-10,-10,-10,-10"> <Image Source="{Binding ImageSource}" Height="73" Width="73" VerticalAlignment="Top" Margin="10,10,8,10"/> <TextBlockText="{Binding Message}" Margin="10" TextWrapping="Wrap" FontSize="18" Width="350" /> </StackPanel> </DataTemplate> </ListBox.ItemTemplate> </ListBox> </Grid>
  • 66. Binding, Templates and XML Example <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> <Grid.RowDefinitions> <RowDefinitionHeight="74*" /> <RowDefinitionHeight="533*" /> </Grid.RowDefinitions> <TextBoxGrid.RowSpan="2" Height="72" HorizontalAlignment="Left" Margin="9,8,0,0" Name="txtUserName" VerticalAlignment="Top" Width="294" /> <Button Content="Lookup" Grid.RowSpan="2" Height="72" HorizontalAlignment="Left" Margin="296,8,0,0" Name="btnLookupUser" VerticalAlignment="Top" Width="160" Click="btnLookupUser_Click" /> <ListBoxName="lstTwitter" Grid.Row="1" Margin="10, 10, 10, 10"> <ListBox.ItemTemplate> <DataTemplate> <StackPanelOrientation="Horizontal" Height="110" Margin="-10,-10,-10,-10"> <Image Source="{Binding ImageSource}" Height="73" Width="73" VerticalAlignment="Top" Margin="10,10,8,10"/> <TextBlockText="{Binding Message}" Margin="10" TextWrapping="Wrap" FontSize="18" Width="350" /> </StackPanel> </DataTemplate> </ListBox.ItemTemplate> </ListBox> </Grid>
  • 67. Binding, Templates and XML Example void twitter_DownloadStringCompleted(object sender, DownloadStringCompletedEventArgse) { if (e.Error!= null) return; XElementxmlTweets= XElement.Parse(e.Result); lstTwitter.ItemsSource= from tweet in xmlTweets.Descendants("status") select new TwitterItem{ ImageSource= tweet.Element("user").Element("profile_image_url").Value, Message=tweet.Element("text").Value}; } private void button2_Click(object sender, RoutedEventArgse) { WebClienttwitter = new WebClient(); // Handle downloaded data when finished twitter.DownloadStringCompleted+= new DownloadStringCompletedEventHandler(twitter_DownloadStringCompleted); // Set the site twitter.DownloadStringAsync(new Uri("http://api.twitter.com/1/statuses/user_timeline.xml?screen_name=" + textBox1.Text)); }
  • 68. Binding, Templates and XML Example void twitter_DownloadStringCompleted(object sender, DownloadStringCompletedEventArgse) { if (e.Error!= null) return; XElementxmlTweets= XElement.Parse(e.Result); lstTwitter.ItemsSource= from tweet in xmlTweets.Descendants("status") select new TwitterItem{ ImageSource= tweet.Element("user").Element("profile_image_url").Value, Message=tweet.Element("text").Value}; } private void button2_Click(object sender, RoutedEventArgse) { WebClienttwitter = new WebClient(); // Handle downloaded data when finished twitter.DownloadStringCompleted+= new DownloadStringCompletedEventHandler(twitter_DownloadStringCompleted); // Set the site twitter.DownloadStringAsync(new Uri("http://api.twitter.com/1/statuses/user_timeline.xml?screen_name=" + textBox1.Text)); }
  • 69. Binding, Templates and XML Example void twitter_DownloadStringCompleted(object sender, DownloadStringCompletedEventArgse) { if (e.Error!= null) return; XElementxmlTweets= XElement.Parse(e.Result); lstTwitter.ItemsSource= from tweet in xmlTweets.Descendants("status") select new TwitterItem{ ImageSource= tweet.Element("user").Element("profile_image_url").Value, Message=tweet.Element("text").Value}; } private void button2_Click(object sender, RoutedEventArgse) { WebClienttwitter = new WebClient(); // Handle downloaded data when finished twitter.DownloadStringCompleted+= new DownloadStringCompletedEventHandler(twitter_DownloadStringCompleted); // Set the site twitter.DownloadStringAsync(new Uri("http://api.twitter.com/1/statuses/user_timeline.xml?screen_name=" + textBox1.Text)); }
  • 70. Binding, Templates and XML Example void twitter_DownloadStringCompleted(object sender, DownloadStringCompletedEventArgse) { if (e.Error!= null) return; XElementxmlTweets= XElement.Parse(e.Result); lstTwitter.ItemsSource= from tweet in xmlTweets.Descendants("status") select new TwitterItem{ ImageSource= tweet.Element("user").Element("profile_image_url").Value, Message=tweet.Element("text").Value}; } private void button2_Click(object sender, RoutedEventArgse) { WebClienttwitter = new WebClient(); // Handle downloaded data when finished twitter.DownloadStringCompleted+= new DownloadStringCompletedEventHandler(twitter_DownloadStringCompleted); // Set the site twitter.DownloadStringAsync(new Uri("http://api.twitter.com/1/statuses/user_timeline.xml?screen_name=" + textBox1.Text)); }
  • 71. Binding, Templates and XML Example void twitter_DownloadStringCompleted(object sender, DownloadStringCompletedEventArgse) { if (e.Error!= null) return; XElementxmlTweets= XElement.Parse(e.Result); lstTwitter.ItemsSource= from tweet in xmlTweets.Descendants("status") select new TwitterItem{ ImageSource= tweet.Element("user").Element("profile_image_url").Value, Message=tweet.Element("text").Value}; } private void button2_Click(object sender, RoutedEventArgse) { WebClienttwitter = new WebClient(); // Handle downloaded data when finished twitter.DownloadStringCompleted+= new DownloadStringCompletedEventHandler(twitter_DownloadStringCompleted); // Set the site twitter.DownloadStringAsync(new Uri("http://api.twitter.com/1/statuses/user_timeline.xml?screen_name=" + textBox1.Text)); }
  • 72. Binding, Templates and XML Example <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> <Grid.RowDefinitions> <RowDefinitionHeight="74*" /> <RowDefinitionHeight="533*" /> </Grid.RowDefinitions> <TextBoxGrid.RowSpan="2" Height="72" HorizontalAlignment="Left" Margin="9,8,0,0" Name="txtUserName" VerticalAlignment="Top" Width="294" /> <Button Content="Lookup" Grid.RowSpan="2" Height="72" HorizontalAlignment="Left" Margin="296,8,0,0" Name="btnLookupUser" VerticalAlignment="Top" Width="160" Click="btnLookupUser_Click" /> <ListBoxName="lstTwitter" Grid.Row="1" Margin="10, 10, 10, 10"> <ListBox.ItemTemplate> <DataTemplate> <StackPanelOrientation="Horizontal" Height="110" Margin="-10,-10,-10,-10"> <Image Source="{Binding ImageSource}" Height="73" Width="73" VerticalAlignment="Top" Margin="10,10,8,10"/> <TextBlockText="{Binding Message}" Margin="10" TextWrapping="Wrap" FontSize="18" Width="350" /> </StackPanel> </DataTemplate> </ListBox.ItemTemplate> </ListBox> </Grid> void twitter_DownloadStringCompleted(object sender, DownloadStringCompletedEventArgse) { if (e.Error!= null) return; XElementxmlTweets= XElement.Parse(e.Result); lstTwitter.ItemsSource= from tweet in xmlTweets.Descendants("status") select new TwitterItem{ ImageSource= tweet.Element("user").Element("profile_image_url").Value, Message=tweet.Element("text").Value}; }
  • 73. Animation
  • 74. Animation –The Basis
  • 75. Animation
  • 76. Animation <Grid Name="grid"> <Canvas Name="canvas"> <Button Content="Fire Shapes!" Height="23" HorizontalAlignment="Left" Margin="12,12,0,0" Name="buttonFireShapes" VerticalAlignment="Top" Width="75" Click="buttonFireShapes_Click" /> </Canvas> </Grid>
  • 77. Animation private void CreateRectangleMovementAnimation(Rectangle rectangle) { DoubleAnimationanimation = new DoubleAnimation(150,800,new Duration(TimeSpan.FromSeconds(2))); animation.AutoReverse= true; animation.RepeatBehavior= RepeatBehavior.Forever; TranslateTransformt = new TranslateTransform(); rectangle.RenderTransform.BeginAnimation(TranslateTransform.XProperty, animation); } private void CreateRectangleColorAnimation(Rectangle rectangle) { ColorAnimationanimation = new ColorAnimation(Colors.Red, Colors.Yellow,newDuration(TimeSpan.FromSeconds(1))); animation.AutoReverse= true; animation.RepeatBehavior= RepeatBehavior.Forever; rectangle.Fill.BeginAnimation(SolidColorBrush.ColorProperty, animation); }
  • 78. Animation

×