Jump to content

Windows Presentation Foundation

From Wikipedia, the free encyclopedia
(Redirected from WPF (UI framework))
Windows Presentation Foundation (WPF)
Original author(s)Microsoft
Developer(s).NET Foundation
Initial releaseNovember 21, 2006; 18 years ago (2006-11-21)
Stable release
v8.0.5 / May 14, 2024; 6 months ago (2024-05-14)[1]
Repository
Written inC#, C++, C
Operating systemMicrosoft Windows
Platform.NET Framework, .NET
TypeSoftware framework
LicenseMIT License
Websitelearn.microsoft.com/en-us/dotnet/desktop/wpf/

Windows Presentation Foundation (WPF) is a free and open-source user interface framework for Windows-based desktop applications. WPF applications are based in .NET, and are primarily developed using C# and XAML.[2]

Originally developed by Microsoft, WPF was initially released as part of .NET Framework 3.0 in 2006. In 2018, Microsoft released WPF as open source under the MIT License.[3] WPF's design and its layout language XAML have been adopted by multiple other UI frameworks, such as UWP, .NET MAUI, and Avalonia.

Overview

[edit]

WPF employs XAML, an XML-based language, to define and link various interface elements, and uses C# to define program behavior.[4] WPF applications are deployed as standalone desktop programs.

WPF supports a number of common user interface elements, such as 2D/3D rendering, fixed and adaptive documents, typography, vector graphics, runtime animation, and pre-rendered media. These elements can then be linked and manipulated based on various events, user interactions, and data bindings.[5]

WPF runtime libraries are included with all versions of Microsoft Windows since Windows Vista and Windows Server 2008.[6][7]

At the Microsoft Connect event on December 4, 2018, Microsoft announced releasing WPF as open source project on GitHub. It is released under the MIT License. Windows Presentation Foundation has become available for projects targeting the .NET software framework, however, the system is not cross-platform and is still available only on Windows.[3][8]

Code examples

[edit]
Screenshot of developing a basic Windows Presentation Foundation (WPF) UI application in Visual Studio 2022. XAML is used to define the layout, while C# is used to define the interactive behavior.

In WPF, screens and other UI elements are defined using a pair of files: a XAML file and an associated C# file with the extension .xaml.cs, often referred to as a "code-behind". The XAML file declaratively defines the layout, contents and other properties of the UI element, while the C# file allows exposure of code entry points for interactivity.[4]

A basic example of an interactive Hello, World! program could be created like so:

MainWindow.xaml:

<Window x:Class="WpfExample.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="200" Width="300">
    <StackPanel Orientation="Vertical">
        <TextBlock Text="What is your name?"/>
        <TextBox x:Name="NameInputTextBox"/>
        <Button x:Name="SubmitButton" Click="SubmitButton_Click">
            <TextBlock Text="Submit"/>
        </Button>
        <TextBlock x:Name="ResultTextBlock"/>
    </StackPanel>
</Window>

MainWindow.xaml.cs:

using System.Windows;

namespace WpfExample
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void SubmitButton_Click(object sender, RoutedEventArgs e)
        {
            var name = this.NameInputTextBox.Text;
            this.ResultTextBlock.Text = $"Hello {name}!";
        }
    }
}

In the above example, a UI element called MainWindow is declared as a subclass of the built-in Window class. The XAML file defines the layout, which in this example is a vertical collection of controls - a textblock outlining instructions to the user, a textbox for the user to type their name, a button to submit, and a results text block. When the button is clicked, the method SubmitButton_Click is called, which is defined in the .xaml.cs file. This function updates the final textblock to contain a message greeting the user, addressing them by their submitted name.

Features

[edit]

Media and Graphics

[edit]

WPF supports most modern media types, including vector and raster images, audio, video, and can support both 2D and 3D rendering.[9] It also supports implementing graphical effects on visual elements, such as HLSL pixel shaders and built-in effects such as blurs and drop shadows.[10][11]

WPF mainly relies on vector graphics, which allows most controls and elements to be scaled without loss in quality or pixelization.[12][13]

Data binding

[edit]

WPF employs data binding, a technique of propagating changes between user interface elements and the object model of the program.[14] For instance, a textblock defined in XAML could bind its contents to a string property stored on a C# object in the following way:

<TextBlock Text="{Binding Username}" />
public class ExampleViewModel
{
    public string Username { get; set; }
}

This would make the textblock display the value of the Username property.

The direction data binding happens is configurable - it can be defined to go UI-to-source (eg. text entered into a textbox being propagated to a bound string property in code), or source-to-UI (eg. a visual clock being updated to display the current time stored in code), or bi-directional.[14]

Data binding doesn't have any restrictions on types, and it is possible to bind structs, classes, or collections. Converters can be used to transpose the values and types being used during binding - for example, binding a textbox to a DateTime property, but using a converter to display the time as a formatted localised date string.[14]

Most properties on built-in controls can be databound, and custom-made controls can create bindable properties by defining Dependency Properties.[14][15]

MVVM, the architectural pattern encouraged by Microsoft for WPF developers, relies heavily on data binding.[16]

Styles and templates

[edit]

Using templates and styles, developers can define the visuals and structure of UI elements.

A style is a combination of property settings that can be applied to a UI element with a single property attribute. For example, a "blue radio button" style could be created and then be reused on any number of radio button controls throughout the program. Styles can alter collections of properties of controls, but are not not intended for significant structural changes.

Templates are a mechanism for defining alternative UI for portions of a WPF application. There are several template types available in WPF for different scenarios, but they all have the general purpose of defining the contents, layout and structure of a UI element.[17]

Animations

[edit]

In WPF, many visual properties can be animated. This is exposed through dependency properties, which is the same underlying system that data binding relies on. WPF animations are time-based, as opposed to frame-based.[18]

Animation classes are based on the .NET type of property to be animated. For instance, changing the color of an element is done with the ColorAnimation class and animating the width of an element (which is typed as a double) is done with the DoubleAnimation class.[18]

Animations can be grouped into Storyboards, which are the primary way to start, stop, pause and otherwise manipulate animations.[18]

Documents and Text

[edit]

WPF natively supports paginated documents. It provides the DocumentViewer class, which is for reading fixed layout documents. The FlowDocumentReader class offers different view modes such as per-page or scrollable and also reflows text if the viewing area is resized. It supports both the XML Paper Specification and Open Packaging Conventions.[19]

WPF includes a number of text rendering features, including OpenType, TrueType, and OpenType CFF (Compact Font Format) fonts. This means that WPF can support a wide number of text features, including ligatures, old-style numerals, swash variants, fraction, superscript and subscript, small caps, ruby characters, glyph substitution, multiple baselines, and kerning.[20]

WPF handles texts in Unicode, and handles texts independent of global settings, such as system locale. In addition, fallback mechanisms are provided to allow writing direction (horizontal versus vertical) handled independent of font name; building international fonts from composite fonts, using a group of single-language fonts; composite fonts embedding. Font linking and font fallback information is stored in a portable XML file, using composite font technology.[21] The XML file has extension .CompositeFont.

The WPF text engine also supports built-in spell checking. It also supports such features as automatic line spacing, enhanced international text, language-guided line breaking, hyphenation, and justification, bitmap effects, transforms, and text effects such as shadows, blur, glow, rotation etc. Animated text is also supported; this refers to animated glyphs, as well as real-time changes in position, size, color, and opacity of the text.

WPF text rendering takes advantage of advances in ClearType technology, such as sub-pixel positioning, natural advance widths, Y-direction anti-aliasing, hardware-accelerated text rendering, as well as aggressive caching of pre-rendered text in video memory.[22] ClearType cannot be turned off in older WPF 3.x applications.[23]

Interoperability

[edit]

Windows Forms features are possible through the use of the ElementHost and WindowsFormsHost classes.

To enable the use of WinForms, the developer executes this from their WPF C# code:[24]

 System.Windows.Forms.Integration.WindowsFormsHost.EnableWindowsFormsInterop();

WPF programs, via the P/Invoke feature of the CLR, can access native functionality such calling functions from Windows libraries. This allows the ability to communicate and operate other parts of the operating system, including unmanaged libraries.[25]

Alternative input and accessibility

[edit]

WPF supports Windows Ink for pen-based input,[26] and multi-touch input on Windows 7 and above.[27] It also supports Microsoft UI Automation to allow developers to create accessible interfaces, and to expose the UI to automated test frameworks.[28]

XAML

[edit]

Following the success of markup languages for web development, WPF introduced eXtensible Application Markup Language (XAML; /ˈzæməl/), which is based on XML. XAML is designed as a more efficient method of developing application user interfaces.[29] XAML is a declarative language, meaning the developer (or designer) describes the behavior and integration of components without the use of procedural programming. Although it is rare that an entire application will be built completely in XAML, the introduction of XAML allows application designers to more effectively contribute to the application development cycle. Using XAML to develop user interfaces also allows for separation of model and view, which is considered a good architectural principle.[30] In XAML, elements and attributes map to classes and properties in the underlying APIs.

As in web development, both layouts and specific themes are well suited to markup, but XAML is not required for either. Indeed, all elements of WPF may be coded in a .NET language (C#, VB.NET). The XAML code can ultimately be compiled into a managed assembly in the same way all .NET languages are.

Deployment

[edit]

WPF applications are Windows-only standalone desktop executables.

Historically, WPF supported compiling to XBAP, a file format intended to be shown in web browsers via a NPAPI plugin, but NPAPI and XBAP support was phased out of support by browsers, and XBAP compilation is now no longer included for WPF for .NET.[31][32]

Usage and reception

[edit]
Visual Studio is an example of an application made using WPF

WPF is used to develop Visual Studio, Microsoft's flagship IDE, and was used for developing Microsoft Expression Blend.[33]

Influence on other UI frameworks

[edit]
An example of an app made with UWP, a XAML-based framework influenced by WPF

WPF and its layout language, XAML, have influenced multiple other UI frameworks.

Silverlight (codenamed WPF/E - WPF Everywhere), released in 2007, is a deprecated cross-browser browser plugin which contained WPF-based technology, including XAML, that provided features including video, vector graphics, and animations. Specifically, it was provided as an add-on for Mozilla Firefox, Internet Explorer 6 and above, Google Chrome 42 and below and Apple Safari. Microsoft encouraged developers to stop using Silverlight in 2015,[34] and support was officially ended in 2021.[35]

After becoming open source in 2018, WPF was forked for the project Avalonia, an open-source .NET cross-platform XAML-based UI framework, distributed under the MIT License. While WPF only is intended for Windows, Avalonia also supports builds for web (via WebAssembly), MacOS, Android, iOS, and Linux. Avalonia's name references WPF's in-development codename ("Avalon"), and markets itself as "a spiritual successor to WPF".[36] Avalonia is currently used in tools made by Unity, GitHub and JetBrains.[37]

XAML, which was first designed for WPF, has been adopted for other similar Microsoft-developed UI libraries, such as UWP,[38] designed for Windows 10, Windows 11, Xbox One and Xbox Series S/X applications, and .NET MAUI (formerly Xamarin.Forms), designed for creating cross-platform native Android and iOS apps.[39]

Development

[edit]

Developers of WPF applications typically use Microsoft Visual Studio. Visual Studio contains a combination XAML editor and WPF visual designer, beginning with Visual Studio 2008.[40] Prior to Visual Studio 2008, the WPF designer add-in, codenamed Cider, was the original release of a WYSIWYG editor for creating WPF windows, pages, and user controls. It was available for Visual Studio 2005 as a Visual Studio 2005 extensions for .NET Framework 3.0 CTP for the initial release of WPF.[41]

Visual Studio is not strictly required develop WPF projects, as solutions can be built in the command line using MSBuild.[42]

Microsoft Blend is a designer-oriented tool that provides an artboard for the creation of WPF applications with 2D and 3D graphics, text and forms content. It generates XAML that may be exported into other tools and shares solution (sln files) and project formats (csproj, vbproj) with Microsoft Visual Studio. Microsoft Expression Design is a bitmap and 2D-vector graphics tool for exporting to XAML.

References

[edit]
  1. ^ "v8.0.5". github.com. 2023-05-14. Retrieved 2023-05-30.
  2. ^ "What is Windows Presentation Foundation - WPF .NET". learn.microsoft.com. 2023-06-02. Retrieved 2024-05-15.
  3. ^ a b Martin, Jeff (4 December 2018). "Microsoft Open Sources WPF, WinForms, and WinUI". InfoQ. Retrieved 2018-12-06.
  4. ^ a b dotnet-bot. "XAML Overview (WPF)". msdn.microsoft.com. Retrieved 31 March 2018.
  5. ^ Sells, Chris; Griffiths, Ian (2007). Programming WPF: Building Windows UI with Windows Presentation Foundation. "O'Reilly Media, Inc.". ISBN 9780596554798.
  6. ^ kexugit (2007-03-14). "Mailbag: What version of the .NET Framework is included in what version of the OS?". learn.microsoft.com. Retrieved 2024-05-25.
  7. ^ gewarren (2024-04-24). ".NET Framework & Windows OS versions - .NET Framework". learn.microsoft.com. Retrieved 2024-05-25.
  8. ^ Hanselman, Scott (4 December 2018). "Announcing WPF, WinForms, and WinUI are going Open Source". Retrieved 2018-12-06.
  9. ^ Graphics and Multimedia. Msdn.Microsoft.com. Retrieved on 2013-08-29.
  10. ^ dotnet-bot. "Effect Class (System.Windows.Media.Effects)". learn.microsoft.com. Retrieved 2024-05-22.
  11. ^ "4. How WPF and Silverlight Use Shaders - HLSL and Pixel Shaders for XAML Developers [Book]". www.oreilly.com. Retrieved 2024-05-28.
  12. ^ "Introducing Windows Presentation Foundation". msdn.microsoft.com. 11 May 2010. Retrieved 31 March 2018.
  13. ^ "What's New in WPF 3.5? Here's Fifteen Cool Features..." Retrieved 2007-10-14.
  14. ^ a b c d adegeo (2023-09-02). "Data binding overview - WPF .NET". learn.microsoft.com. Retrieved 2024-05-22.
  15. ^ adegeo (2022-06-28). "Dependency properties overview - WPF .NET". learn.microsoft.com. Retrieved 2024-05-22.
  16. ^ kexugit (2016-12-08). "Patterns - WPF Apps With The Model-View-ViewModel Design Pattern". learn.microsoft.com. Retrieved 2024-05-25.
  17. ^ adegeo (2023-03-03). "Styles and templates - WPF .NET". learn.microsoft.com. Retrieved 2024-05-22.
  18. ^ a b c adegeo (2022-03-17). "Animation Overview - WPF .NET Framework". learn.microsoft.com. Retrieved 2024-05-22.
  19. ^ adegeo (2023-02-06). "Documents Overview - WPF .NET Framework". learn.microsoft.com. Retrieved 2024-05-22.
  20. ^ adegeo (2022-08-18). "OpenType Font Features - WPF .NET Framework". learn.microsoft.com. Retrieved 2024-05-22.
  21. ^ "Typography in Windows Presentation Foundation". msdn.microsoft.com. 3 November 2006. Retrieved 31 March 2018.
  22. ^ dotnet-bot. "ClearType Overview". msdn.microsoft.com. Retrieved 31 March 2018.
  23. ^ "Disable Antialiasing". social.msdn.microsoft.com. Retrieved 31 March 2018.
  24. ^ dotnet-bot. "WindowsFormsHost.EnableWindowsFormsInterop Method (System.Windows.Forms.Integration)". learn.microsoft.com. Retrieved 2024-05-22.
  25. ^ jkoritzinsky (2024-05-10). "Platform Invoke (P/Invoke) - .NET". learn.microsoft.com. Retrieved 2024-05-25.
  26. ^ adegeo (2022-08-18). "Digital ink - Windows Forms and COM vs. WPF". learn.microsoft.com. Retrieved 2024-05-22.
  27. ^ kexugit (2015-08-12). "MSDN Magazine: UI Frontiers - Multi-Touch Manipulation Events in WPF". learn.microsoft.com. Retrieved 2024-05-22.
  28. ^ Xansky. "UI Automation Overview". msdn.microsoft.com. Retrieved 31 March 2018.
  29. ^ MacDonald, Matthew (2010). Pro WPF in VB 2010: Windows Presentation Foundation in .NET 4. Apress. ISBN 9781430272403.
  30. ^ Larman, Craig. https://courses.cs.duke.edu/compsci308/spring24/readings/larman_model_view_separation.pdf Applying UML and Patterns: An introduction to Object-Oriented Analysis and Design and the Unified Process (2nd ed.). p. 472. {{cite book}}: External link in |title= (help)
  31. ^ adegeo. "FAQ about XBAP supportability". learn.microsoft.com. Retrieved 2024-05-15.
  32. ^ kexugit (2011-03-09). "IE9 - XBAPs Disabled in the Internet Zone". learn.microsoft.com. Retrieved 2024-05-15.
  33. ^ Blog, Visual Studio (2010-02-16). "WPF in Visual Studio 2010 - Part 1 : Introduction". Visual Studio Blog. Retrieved 2024-05-22.
  34. ^ Blog, Microsoft Edge; Smith, Jerry (2015-07-02). "Moving to HTML5 Premium Media". Microsoft Edge Blog. Retrieved 2024-05-23.
  35. ^ GitHub-Name. "Silverlight 5 - Microsoft Lifecycle". learn.microsoft.com. Retrieved 2024-05-23.
  36. ^ "Avalonia UI - Cross-Platform UI Framework for .NET". Avalonia UI. Retrieved 2024-05-16.
  37. ^ "Avalonia UI - Showcase". avaloniaui.net. Retrieved 2024-05-23.
  38. ^ jwmsft (2022-10-20). "XAML platform - UWP applications". learn.microsoft.com. Retrieved 2024-05-23.
  39. ^ davidbritch (2023-07-25). "XAML - .NET MAUI". learn.microsoft.com. Retrieved 2024-05-23.
  40. ^ Staff, CodeGuru (2009-04-06). "A Tour of WPF in Visual Studio 2008". CodeGuru. Retrieved 2024-05-23.
  41. ^ "Download details: Microsoft Visual Studio Code Name "Orcas" Community Technology Preview - WinFX™ Development Tools". Microsoft. 2006-04-15. Archived from the original on 2006-04-15. Retrieved 2024-05-23.
  42. ^ adegeo (2022-08-18). "Compile an app - WPF .NET Framework". learn.microsoft.com. Retrieved 2024-05-23.

Bibliography

[edit]
[edit]