Presentation is loading. Please wait.

Presentation is loading. Please wait.

Introduction to Windows Presentation Foundation (WPF) Dr. Frank McCown COMP 445 – GUI Programming.

Similar presentations

Presentation on theme: "Introduction to Windows Presentation Foundation (WPF) Dr. Frank McCown COMP 445 – GUI Programming."— Presentation transcript:

1 Introduction to Windows Presentation Foundation (WPF) Dr. Frank McCown COMP 445 – GUI Programming

2 WPF History Work began in early 2000’s by Microsoft under code name “Avalon” Effort to provide a clearer separation between the interface and business logic Avalon renamed WPF in July 2005 WPF released in 2006 as part of.NET Framework 3.0 Silverlight (released in 2007) is a subset of WPF Windows Phone 7 (released in 2010) uses Silverlight or XNA to write apps

3 WPF Features Works on top of DirectX to provide more advanced UI features Support for 2D and 3D graphics, audio, and video GUI appearance and content manipulated with XAML WPF controls can be embedded in Windows Forms app and vice versa Uses vector-based graphics for resolution independence WPF apps can stand alone or run in Internet Explorer

4 Bringing it all together…

5 Extensible Application Markup Language (XAML) Pronounced “zammel” XML-based markup language for defining and arranging GUI controls Can be manually generated/edited or edited by Visual Studio

6 Example XAML Document

7 Control Layout Windows Forms: Set absolute (x,y) position WPF: Set relative position in its layout container Controls grow/shrink as window grows/shrinks Control properties: – Width, Height – MinWidth, MinHeight, MaxWidth, MaxHeight – Margin: space around control’s edges (L,T,R,B) – HorizontalAlignment (Left, Center, Right, or Stretch) – VerticalAlignment (Top, Center, Bottom, or Stretch)

8 Alignment Introduction to WPF Layout by Christian Moser

9 Padding and Margin Introduction to WPF Layout by Christian Moser The Margin is the extra space around the control. The Padding is extra space inside the control. The Padding of an outer control is the Margin of an inner control.

10 Common Layouts Grid Canvas StackPanel DockPanel WrapPanel

11 Grid Layout Grid Panel by Christian Moser Layout is defined by a grid of rows and columns with elements placed in cells.

12 Canvas Layout Canvas Panel by Christian Moser Elements are placed in relation to the distance from the top and left edges of the Canvas.

13 StackPanel Layout StackPanel by Christian Moser Elements are arranged in a single column or row.

14 DockPanel Layout Dock Panel by Christian Moser Elements are positioned based on the edge they are docked to.

15 WrapPanel Layout Wrap Panel by Christian Moser A wrapping StackPanel where elements are wrapped to the next row or column.

16 Event Handling Press Me // Code from Windows1.xaml.cs public partial class Window1 : Window { public Window1() { InitializeComponent(); } private void button1_Click(object sender, RoutedEventArgs e) { label1.Content = "Button pressed!"; }

17 Event Routing All WPF events are routed events – Can travel up (from child to parent) – Can travel down (from parent to child) Three types of routed events – Direct events: Don’t travel up or down – Bubbling events: Travel up (Source to Window) – Tunneling events: Travel down (top of containment hierarchy to Source)

18 Bubbling Event Example

19 Tunneling Event Example

20 Commands Any action or task that may be triggered by different user interactions – Example: File  Exit from the menu and Exit button may both need to execute the same command Commands can better synchronize a tasks’ availability – Example: If copy command requires text to be highlighted, all controls using this command can be disabled if no text is highlighted Some common built-in commands: New, Open, Save, Close, Cut, Copy, Paste Can create your own custom commands

21 Command Example

Download ppt "Introduction to Windows Presentation Foundation (WPF) Dr. Frank McCown COMP 445 – GUI Programming."

Similar presentations

Ads by Google