Windows Presentation Foundation (WPF)

Introduction Separates appearance of user interface from behavior Appearance usually specified by XAML Behavior implemented in C# or VB Known as "managed languages" Linked by "data binding" & events XML can be created with graphical tools "Controls" can be combined ("composed") Image & text in a button

XAML language Includes language-level features to associate code files with markup files, from the markup file side. Defines the language features x:Class Directive x:Subclass Directive x:ClassModifier Directive. x:ClassModifier Directive Does NOT specify how the code should be produced how to integrate markup and code, It is left up to frameworks such as WPF to determine how to integrate the code, how to use XAML in the application and programming models, and the build actions or other support that all this requires.

Intro - 2 Controls are therefore customizable Create "skins" for an interface using "styles" Similar to CSS "Code Behind" the code that is joined with markup-defined objects, when a XAML page is markup-compiled Avoid or limit the use of inline code (inside XAML) Your event handlers in the Code Behind must be instance methods cannot be static methods must be defined by the partial class within the CLR namespace identified by x:Class.

A button & its properties Button code added by VS

Adding an event handler 1. Click the "lightning" icon on the Properties tab, to get this list of handlers 2. Double-Click the gray square to get the code added

Code added for my form private void Button_Click(object sender, RoutedEventArgs e) { MessageBoxResult result = MessageBox.Show("button clicked"); Application.Current.Shutdown();// terminates the program } private void CheckBox_Checked(object sender, RoutedEventArgs e) { // here you can add code to save the setting of the checkbox } object sender – which control caused the interrupt RoutedEventArgs e – what the control did DialogResult result = Form1().ShowDialog(); is any content from the control

XAML & WPF XAML element corresponds to a WPF class Element's attributes have corresponding property/event in the class. Example, No Or use C#: Button btn = new Button(); btn.Background = Brushes.Red; btn.Content = "No";

WPF example – part 1 Click Me! The x:Class associates these 2 elements of the project: XAML def'n of window (above) code-behind class (MyWindow) on next slide This example (parts 1 & 2) is from: Same as namespace Same as main window

WPF example –part 2 using System.Windows; // Window, RoutedEventArgs, MessageBox namespace SDKSample { public partial class MyWindow : Window { public MyWindow() { // InitializeComponent call is required to merge the UI // that is defined in markup with this class, including // setting properties and registering event handlers InitializeComponent(); } void button1_Click(object sender, RoutedEventArgs e) { // Show message box when button is clicked MessageBox.Show("Hello, from WPF app!"); }

Events WPF events are "routed" May traverse a hierarchy of handlers May be handled by more than 1 handler Last "desired" handler sets the "handled" property to "true" Stops all further handling "Source" property saves origin of event 3 types: Direct events – similar to Windows Forms events – no hierarchy traversal Bubbling events – start at the Source and travel UP the hierarchy to the Window Tunneling events - start at the Window and travel DOWN the hierarchy Prefixed with "Preview" (e.g.; PreviewMouseLeftButton) An event handler can handle events for > 1 control To specify this: Select the control Use the Events tab in the Properties window Reference:

Commands Provide alternate ways of creating events Similar to MFC and Win32API Menu bars provide "labels" for actions Allows synch between command and program "state" "copy" can only be done if something is "selected" Invalid commands can be greyed-out Many standard commands built-in Copy, Cut, Paste Open, Save, Close, New ToggleBold, ToggleItalic, ToggleUnderline Play, Stop, Rewind

Resources Describe the objects your project uses Provides means to "bind" resources to code Two types of Resources Static Dynamic Two types of Resource Files: Linked External files.resx file includes only a relative path Embedded Inside the.resx file of the project

Adding Resources Right-click the Properties node under the project in Solution Explorer Click "Open" Click Add Resource button (top of the Resources page in Project Designer)

Sample text to Datagrid Data source is created using an ObservableCollection of a custom class in the window’s code-behind script This is not always the best approach to take – you will usually be using DataAdapters and DataTables to retrieve information from a database, or external files Setting the grid’s ItemSource property to inherit from the data context creates the binding between grid & data. After the collection is populated, set Grid.DataContext = collection_name; causes the user interface to update and display the grid content.

XAML & Code-behind using System; using System.Collections.ObjectModel; using System.Windows; namespace Wpf_userlist { public class User//our observable collection class { private String _n; private int _n1; public String name// "name" will be bound to collection { get { return _n; } set { _n = value; } // value is set on next slide } public int int1 // "int1" will be bound to collection { get { return _n1; } set { _n1 = value; } }

Create Observable Collection public partial class MainWindow : Window { public ObservableCollection User = new ObservableCollection(); public MainWindow() { InitializeComponent(); // next 2 lines to be replaced by file reading data.Add(new User() {Name="Foreman", int1=1}); data.Add(new User() {Name ="Smith", int1=2}); myGrid.DataContext = User; } } // end of partial class MainWindow } // end of program

Read a file // Read a file and display it line by line. System.IO.StreamReader myFile = new System.IO.StreamReader("c:\\test.txt"); while((line = file.ReadLine()) != null) { process_line(line); // move line into data array } OR string[] lines = myFile.Close();

Using a datagrid Here’s a really good tutorial on getting data into a datagrid. But it uses "predefined" data. You need a file-read. Here’s a short example (lots of details omitted) from my own code: private void process_line (String x) { string thename; String[] ints; ints = x.Substring(position of 2 nd quote+2).Split(','); csvlist.Add (new csvrow() { name = thename, int1 = ints[0], int2=ints[1] }); // MessageBox.Show("name="+ csvlist[0].name); } csvlist is a List of type csvrow, where csvrow is a C# class that specifies the names of the columns of the datagrid. Split is a member that separates-out the elements of a string Process_line is called after each whole line of input is obtained Remember to instantiate everything: csvlist = new List (); datagrid Userdata_DG1 = new DataGrid();