Windows Presentation Foundation by Pham Phuong Nguyen HCMC Open University 2009

1. Windows Presentation Foundation Live Club OU PhạmPhương Nguyên Microsoft Student Partner Pham.Nguyen@hotmail.com phamnguyenit.wordpress.com

2. Agenda Overview WPF 1 WPF4 - Lots of Good Stuff 2 Controls in WPF 3 Question ???? 4

3. .Net Framework Data Presentation Communications Workflow Web Base Class Library .NET Framework 4 Common Language Runtime

4. .Net Framework Data Presentation Communications Workflow Web Base Class Library .NET Framework 4 Common Language Runtime

5. Over View ? ? ? Why ????? what ????? Problem ????? ? ? ?

6. Resolve the problem

7. demo WikipediaExlorer

9. Documents

10. Media

12. Why WPF? MFC ALT ? WPF GDI+ DirectX MPlayer OpenGL Flash HTML

13. Why WPF? Designer Look, behavior, brand,and emotional connection Developer Function, deployment, data,security, operational integrity

14. How WPF? XAML Designer Look, behavior, brand,and emotional connection Developer Function, deployment, data,security, operational integrity

15. How WPF? <Button Width="100">OK <Button.Background> LightBlue </Button.Background> </Button> Button b1 = new Button(); b1.Content = "OK"; b1.Background = newSolidColorBrush (Colors.LightBlue); b1.Width = 100; Dim b1 As New Button b1.Content = "OK" b1.Background = New _SolidColorBrush _ (Colors.LightBlue) b1.Width = 100 XAML làgì? XAML == “Extensible Application Markup Language” Ngônngữđánhdấucócấutrúc XML đểxâydựngứngdụng, cácthànhphầncủaứngdụng. Mã XAML và source code hoàntoàn “độclập” nhau

16. How WPF? Tốithiểu .NET Framework 3.0 Visual Studio 2008 hoặccaohơn Expression Blend

17. Cácthànhphần UI trong WPF Layouts Controls Label, TextBox, Buttons, ComboBox, ProgressBar, …

18. Windows Presentation Foundation Live Club OU WPF 4.0 - Lots of Good Stuff PhạmPhương Nguyên Microsoft Student Partner Pham.Nguyen@hotmail.com phamnguyenit.wordpress.com

20. Data controls

21. Accessibility Improvements

22. Chart Controls

23. Control Themes

24. Hundreds of good bug fixes…

25. Plus all the goodness of .NET4!

26. Dynamic Language Support

27. MEF

28. Globalization and NLS improvements

29. Managed / Native Code interop

30. More…

31. Cached compositions

32. Text clarity

33. Layout Rounding

34. ClickOnce improvements

35. Multitouch

36. Win7 Taskbar

37. Win7 Ribbon

38. Focus mgt improvements

39. Support for UIAccessible2

40. VSM integration

41. Full Trust XBaps

43. WPF for Windows 7 Multi-Touch Taskbar Ribbon Common dialogs File Explorer presence and customization More… Use these with .NET and via XAML in WPF

44. Multi-Touch in WPF UIElement changes Thao tác các sự kiện (theo dõi và thông dịch viên)hệ thống cảm ứng cử chỉ các sự kiện (double-tap và rollover)Raw touch input events (for going to the metal) Multi-touch support in controls ScrollViewer cập nhật để chấp nhận những cử chỉ panCập nhật cơ sở kiểm soát được cảm ứng đa nhận thứcMulti-capture support (for more than one contact point at time) New multi-touch specific controls (e.g. ScatterView) Compatible with Surface SDK 2.0

45. Touch Development Roadmap NET 4.0 / Surface 2.0 Release Windows 7 Release Native Win32 Application WinFormsApplication WPF Application Surface Application Surface SDK 1.0 Surface SDK 2.0 Multi-Touch Controls Surface Multi-Touch Controls & API Multi-Touch API WPF 3.5 SP1 WPF 4.0 WPF 3.5 Managed Wrapper and Interop Managed Wrapper and Interop Multi-Touch API and Controls Surface Hardware Windows 7 Surface Hardware Windows Vista Windows 7 Multi-Touch API

46. demo Multi-TouchDemo

47. WPF Taskbar Integration Thumbnails toolbars Icon overlays Progress bars Jumplists With XAML Support

48. WPF Ribbon Features Fulfills office fluent UI licensing requirements Ribbon with resizing and layout behavior Ribbontabs Ribbongroups Ribbonapplicationmenu (Pearl) Quickaccesstoolbar Keytips Design time support

49. WPF Tooling Improvements Blend3 Visual Studio Designer RAD databinding Easier autolayout Markup extension intellisense More property editors Improvements to XAML authoring and workflow VSM Behaviors Transition animations Prototyping tools

50. Fundamentals Framework deployment Application deployment Improved interop Text clarity Layout rounding/snapping Media improvements UIA – for accessibility and TFS Graphics performance Localization

51. Graphics Composition API - give application authors fine grained control over caching rendered elements in video memory An input to a shader effect An image brush to fill any arbitrary 2D shape A texture on a 3D model

52. Layout Rounding UseLayoutRounding="True" Rounds an object’s coordinates on whole pixels

53. Client Profile Configurator Tool Configurator tool http://www.codeplex.com/wpf/Release/ProjectReleases.aspx?ReleaseId=14962 Client profile Configuration designer “How To” series http://windowsclient.net/wpf/wpf35/wpf-35sp1-start-here.aspx

54. Controls WPF4 DataGrid DatePicker VSM Future Chart Controls More…

55. WPF4 and VS10 Best way to take advantage of Windows 7 Solid fundamentals: Deployment and ubiquity, text clarity, interop, performance, controls, and completeness Much improved tooling and designers with VS10 and Blend3 Do Download the beta, demos and give us feedback

56. Windows Presentation Foundation Live Club OU Controls in WPF PhạmPhương Nguyên Microsoft Student Partner Pham.Nguyen@hotmail.com phamnguyenit.wordpress.com

57. Kiếntrúccủa WPF User Interface Services Document Services XPS Documents Application Services Controls Data Binding Packaging Services Deployment Services Layout Base Services Core Presentation XPS Viewer Windows Presentation Foundation XAML 2D Audio Imaging Text Accessibility 3D Video Effects Input & Eventing Animation Property System Visual Primitives

58. Agenda Layout Controls Some Controls in WPF Style và Template Animation DataBinding Event Other Demo

59. www.themegallery.com Layout controls Can use Grid DockPanel WPF Layout StackPanel Canvas WrapPanel

60. Layout Roundind <Grid Height="100" Width="200"> <Grid.RowDefinitions> <RowDefinition Height="*"/> <RowDefinition Height="*"/> <RowDefinition Height="*"/> </Grid.RowDefinitions> <Rectangle Grid.Row="0" Fill="DarkBlue"/> <Rectangle Grid.Row="1" Fill="DarkBlue"/> <Rectangle Grid.Row="2" Fill="DarkBlue"/> </Grid>

61. demo Layout

62. Controls TextBox Button ListBox Radio Button Label <TextBox /> <Button/> <ListBox /> <RadioButton /> <Label/>

63. Ribbon Control Office Button Tab Contextual Tab Set Quick Access Toolbar Help Contextual Tab Dialog Box Launcher Group (aka “Chunk”) Ribbon SDK

64. Windows Ribbon Controls Tabs and groups Check boxes Help button Font control Buttons & split buttons Categorized menus Dropdown galleries Tooltips Spinners Group dialog launchers “In-Ribbon” galleries Mini toolbar andcontextual menu Combo boxes Color pickers

65. demo RibbonDemo

66. Style và Template Style Tậpgiátrịcácthuộctínhhiểnthịcủanhiều controls khácnhau Làmộtdạngtàinguyên (resources) Cácthuộctínhquantrọngcủa Style baogồm BaseOn TargetType Setters Triggers

67. Style và Template <Style TargetType="{x:Type Button}"> <Style.Triggers> <Trigger Property="IsPressed" Value="true"> <Setter Property="Foreground" Value="Blue"/> </Trigger> </Style.Triggers> <Setter Property="Background" Value="White"/> </Style>

68. demo Style Demo

69. Style và Template Template Button cómàusắcthayđổi -> Style Button cóhìnhdạngthayđổi(hìnhtròn, ellipse) ??? Template Cho phépthayđổicáchhiệnthịvốncócủa control Thayđổicấutrúc hay cácthànhphầncấutạocủa control.

70. Style và Template Template ControlTemplate Địnhnghĩa, thayđổithểhiệncủa control DataTemplate Địnhnghĩacáchthứchiểnthịcủacácđốitượngdữliệu

71. demo Template Demo

72. Events vàRoutedEvents Visual Tree: cấutrúcphânlớpdạnghìnhcâycủacácphầntửtrêngiaodiện <Grid> <WrapPanelBackground=“Pink”> <ButtonName=“Button1”>Button1</Button> <ButtonName=“Button2”>Button2</Button> </WrapPanel> <TextBlockText=“Pink”/> </Grid>

73. Events vàRoutedEvents WPF mởrộngmôhìnhsựkiệnchuẩncủa .NET bằngviệcđưaraRoutedEvent Bubble <Event> Tunnel Preview<Event>

74. Data Binding Dependency Property DP làcácthuộctínhcóthểmanggiátrịphụthuộcvàothuộctínhcủađốitượngkhác. Đặcđiểm: Khicósựthayđổigiátrịthìsẽcócácsựkiệntươngứngđượckíchhoạt Kếthừagiátrịthuộctính

75. UI Data Binding Register Events Add to ListBox Set Data Load Get Data Create ListBoxItem Data Binding Logic Data Changed Set Move Update Collection Data Arrived Get Data Data Register Events <Aquarium> <Thermometer/> <Fish/> <Fish/> </ Aquarium > Database Services XML

76. Data Binding View Data Binding Target Binding Source Dependency Property Property Data Binding One Way Initialize Target Two Way Update Target Update Source One Time Validate Errors One Way To Source Convert Data

77. demo Data Binding Demo

78. Animation Animation on computer

79. Animation Animation in WPF Handles all, manage timing system, calculate state, redraw Can work with both C# / VB.NET or XAML Which can animate in WPF? Animate objects by apply animation to theirs properties. Properties must be DP Animated object must be inherited from DependencyObject and implemented IAnimatable Objs have compatible with animation type.

80. Animation Animation in WPF [TypeName]Animation (17) From/To/By Animation [TypeName]AnimationUsingKeyFrame(22) KeyFrames [TypeName]AnimationUsingPath (3)

81. demo Animation Demo

82. ? ? ? Your Questions ? ? ?

83. Thank You ! © 2010 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.