Windows Presentation Foundation (WPF) and Dyalog APL

1. Windows Presentation Foundation (WPF) and Dyalog APL A new era Dan Baronet and Michael Hughes Boston 2011 V1.00 Dyalog’11 - Boston

2. Why WPF? It is difficult to stay on top of the latest changes in the GUI world. Windows Presentation Foundation (WPF) is a framework (based on .NET) for describing all kinds of GUI Easy to use from APL Dyalog’11 - Boston

3. DirectX ±= assembler of graphicsWPF ±= APL DirectX takes care of all the nitty gritty details such as drawing.WPF uses DirectX (and User32 for some services, eg screen areas)Does not use GDI/GDI32/GDI+ - essentially replaces win32 WPF is a replacement, not a new wrapper. DirectX is the technology used underneath

4. DirectX • DirectX is more efficient because it understands higher-level ingredients such as textures and gradients that can be rendered directly by the video card. GDI/GDI+ doesn’t. Dyalog’11 - Boston

5. Applications Controls Styling Layout Data Content Action Presentation Framework PresentationCore.dll MilCore.dll DirectX Driver Dyalog’11 - Boston

6. Goal The goal of WPF is to offload as much of the work as possible on the video card so that complex graphics routines are render-bound (limited by the GPU) rather than processor-bound (limited by your computer’s CPU). Dyalog’11 - Boston

7. An ideal choice • WPF is an ideal choice and it offers the best prospects for future enhancements and longevity • Win32 is a general bucket that includes any technology that runs on Windows: DirectX, MFC, WTL, OpenGL, and so on. • Resolution Independence Dyalog’11 - Boston

8. Dyalog’11 - Boston

9. Dyalog’11 - Boston

10. The Evolution of WPF Although WPF is a relatively new technology, it already exists in two versions: • WPF 3.0. The first version of WPF was released with two other new technologies: Windows Communication Foundation (WCF) and Windows Workflow Foundation (WF). Together, these three technologies were called the .NET Framework 3.0 (even though the core bits of .NET weren’t changed). • WPF 3.5. A year later, a new version of WPF was released as part of the .NET Framework 3.5. The new features in WPF are mostly minor refinements. Some of these bug fixes and performance improvements are available to .NET Framework 3.0 applications through the .NET Framework 3.0 Service Pack 1. Dyalog’11 - Boston

11. Divide and conquer Separating the design from the code should be done. The premise of combining designers and developers to create a better experience is not new, but it has also never been an efficient collaboration. With the introduction of XAML, walls that may have existed between designers and developers are no longer in place. Dyalog’11 - Boston

12. XAML XAML (short for Extensible Application Markup Language, and pronounced “zammel”) is a markup language used to instantiate .NET objects XAML documents define the arrangement of panels, buttons, and controls that make up the windows in a WPF application XML-based formats such as XAML are flexible and easily portable to other tools and platforms. You’re not locked into Visual Studio for ex. XML was designed to be logical, readable, and straightforward—not compact Everything done with XAML can be done entirely in your favorite .NET language (but note that the reverse is not true). Dyalog’11 - Boston

13. XAML: Namespaces • http://schemas.microsoft.com/winfx/2006/xaml/presentation maps to the .NET namespace System.Windows.Controls • http://schemas.microsoft.com/winfx/2006/xaml is the XAML language namespace, which maps to types in the System.Windows.Markupnamespace Dyalog’11 - Boston

14. XAML: Attributes vs Properties Attribute: <Button Content=”OK” Background=”White”/> Property: <Button> <Button.Content>OK</Button.Content> … <Button.Background>White</Button.Background> </Button> Dyalog’11 - Boston

15. No size/pos Hard-coded sizes are usually not the ideal approach to creating user interfaces. They limit your ability to handle dynamic content and they make it more difficult to localize your application into other languages. Dyalog’11 - Boston

16. No fixed coordinates • Instead, the emphasis is on creating more flexible layouts that can adapt to changing content, different languages, and a variety of window sizes. • Hard-coded sizes and positions are evil because they limit your ability to localize your interface, and they make it much more difficult to deal with dynamic content. Dyalog’11 - Boston

17. Matching arguments with real values In order to bridge the gap between string values and nonstring properties (e.g. a number) , the XAML parser needs to perform a conversion. The conversion is performed by type converters, a basic piece of .NET infrastructure that’s existed since .NET 1.0. Dyalog’11 - Boston

18. Panels • Panels are containers • Panels may contain several elements • There are many kinds of panels, each with their own layout logic • WPF uses Panels extensively Dyalog’11 - Boston

19. Panels • They are parent elements that support the arrangement of multiple children, and derive from the abstract System.Windows.Controls.Panel class. • All the elements involved in the layout process (both parents and children) derive from System.Windows.UIElement. Dyalog’11 - Boston

20. StackPanel • StackPanel Places elements in a horizontal or vertical stack. This layout container is typically used for small sections of a larger, more complex window. Dyalog’11 - Boston

21. DockPanel Aligns elements against an entire edge of the container. Dyalog’11 - Boston

22. WrapPanel • Places elements in a series of wrapped lines. In horizontal orientation, the WrapPanel lays items out in a row from left to right and then onto subsequent lines. In vertical orientation, the WrapPanel lays out items in a top-to-bottom column and then uses additional columns to fit the remaining items Dyalog’11 - Boston

23. Grid • Arranges elements in rows and columns according to an invisible table. • This is one of the most flexible and commonly used layout containers Dyalog’11 - Boston

24. UniformGrid • Places elements in an invisible table but forces all cells to have the same size. • This layout container is used infrequently. Dyalog’11 - Boston

25. Canvas • Allows elements to be positioned absolutely using fixed coordinates. • This layout container is the most similar to traditional Windows Forms, but it doesn’t provide anchoring or docking features. As a result, it’s an unsuitable choice for a resizable window unless you’re willing to do a fair bit of work. Dyalog’11 - Boston

26. Other features • There are many features not found in []WC objects Dyalog’11 - Boston

27. Routed Events • It allows an event to originate in one element but be raised by another one. • For example, event routing allows a click that begins in a toolbar button to rise up to the toolbar and then to the containing window before it’s handled by your code. Dyalog’11 - Boston

28. Routed Events Routed events actually come in the following three flavors: • Direct events are like ordinary .NET events. They originate in one element and don’t pass to any other. For example, MouseEnter (which fires when the mouse pointer moves over an element) is a direct event. • Bubbling events are events that travel up the containment hierarchy. For example, MouseDown is a bubbling event. It’s raised first by the element that is clicked. Next, it’s raised by that element’s parent, and then by that element’s parent, and so on, until WPF reaches the top of the element tree. • Tunneling events are events that travel down the containment hierarchy. They give you the chance to preview (and possibly stop) an event before it reaches the appropriate control. For example, PreviewKeyDown allows you to intercept a key press, first at the window level, and then in increasingly more specific containers until you reach the element Dyalog’11 - Boston

29. Dependency Properties • Change notification • Property value inheritance • Support for multiple providers Dyalog’11 - Boston

30. Styles? • <Button MinWidth=”75” Margin=”10”> • <Button.Style> • <Style TargetType=”{x:Type Button}”> • <Style.Triggers> • <Trigger Property=”IsMouseOver” Value=”True”> • <Setter Property=”Foreground” Value=”Blue”/> • </Trigger> • </Style.Triggers> • </Style> • </Button.Style> • OK • </Button> Dyalog’11 - Boston

31. Data Binding • Data binding is about tying together arbitrary .NET objects. The classic scenario is providing a visual representation (for example, in a ListBox or ListView) of items in an XML file, database, or an in-memory collection. • For example, instead of iterating through a data source and manually adding a ListBoxItem to a ListBox for each one, it would be nice to just say, “Hey, ListBox! Get your items from over here. And keep them up to date, please. Oh yeah, and format them to look like this.” Data binding enables this and much more. Dyalog’11 - Boston

32. Data Binding • XmlDataProvider could be considered a “killer app” for data binding, as it makes retrieving, parsing, navigating, and displaying remote XML data incredibly easy. • The ability to get asynchronous behavior on any Binding or data provider simply by setting a Boolean property also makes data binding a compelling alternative to performing such work manually. Dyalog’11 - Boston

33. Triggers • Property triggers—Invoked when the value of a dependency property changes • Data triggers—Invoked when the value of a plain .NET property changes • Event triggers—Invoked when a routed event is raised Dyalog’11 - Boston

34. Expressing More Complex Logic with Triggers • Multiple triggers can be applied to the same element (to get a logical OR). • Multiple properties can be evaluated for the same trigger (to get a logical AND). Dyalog’11 - Boston

35. Easy Graphics • The ability to create and use vector-based 2D graphics is not unique to WPF; even GDI enabled the drawing of paths and shapes. • The main difference with drawing in WPF versus GDI or any previous Window technology is that WPF is a completely retained-mode graphics system rather than an immediate-mode graphics system. Dyalog’11 - Boston

36. SilverLight SilverLight is a slightly cut-down version of WPF, which can run in most popular browsers & includes a small .NET Framework. Applications built on SilverLight (like ”APL#”) can run in the browser ”without installation” on the client (Windows only) computer Dyalog’11 - Boston

37. 3 examples • A windows application • A web app • A Silverlight app + how to store XAML in e.g. SVN and use it other dev interfaces. Dyalog’11 - Boston