Swiftorial Logo
Home
Swift Lessons
Matchups
CodeSnaps
Tutorials
Career
Resources

WPF Tutorial

Introduction to WPF

Windows Presentation Foundation (WPF) is a graphical subsystem by Microsoft for rendering user interfaces in Windows-based applications. WPF, initially released as part of .NET Framework 3.0, is a part of the .NET Foundation and can be used to develop both standalone desktop applications and browser-hosted applications.

Setting Up Your Environment

To get started with WPF development, you need to have Visual Studio installed on your machine. You can download the latest version from the official Visual Studio website.

Install Visual Studio and select the ".NET desktop development" workload during installation.

Creating Your First WPF Application

Follow these steps to create a simple WPF application:

  1. Open Visual Studio.
  2. Click on Create a new project.
  3. Search for WPF App (.NET Core) and select it.
  4. Click Next, provide a name for your project, and click Create.

Understanding XAML

XAML (eXtensible Application Markup Language) is a markup language used to define the user interface in WPF applications. It allows you to create, initialize, and set properties of objects with hierarchical relationships.

Here is a simple example of a XAML file:

<Window x:Class="WpfApp.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid>
<Button Content="Click Me" HorizontalAlignment="Left" VerticalAlignment="Top" Width="75"/>
</Grid>
</Window>

Event Handling

Event handling in WPF is done through code-behind files. These files contain the logic that responds to events triggered by user actions.

Here’s how you can handle a button click event in your code-behind file:

using System;
using System.Windows;

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

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            MessageBox.Show("Button clicked!");
        }
    }
}

Data Binding

Data binding in WPF allows you to connect UI elements to data sources, making it easier to display and interact with data.

Here’s an example of binding a TextBox to a property in the DataContext:

<Window x:Class="WpfApp.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid>
<TextBox Text="{Binding Path=Name}" HorizontalAlignment="Left" VerticalAlignment="Top" Width="200"/>
</Grid>
</Window>
using System.ComponentModel;
using System.Runtime.CompilerServices;
using System.Windows;

namespace WpfApp
{
    public partial class MainWindow : Window, INotifyPropertyChanged
    {
        private string name;
        public string Name
        {
            get { return name; }
            set { name = value; OnPropertyChanged(); }
        }

        public MainWindow()
        {
            InitializeComponent();
            DataContext = this;
        }

        public event PropertyChangedEventHandler PropertyChanged;

        protected void OnPropertyChanged([CallerMemberName] string name = null)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(name));
        }
    }
}

Conclusion

In this tutorial, we covered the basics of WPF, including setting up your environment, creating a simple WPF application, understanding XAML, handling events, and data binding. WPF is a powerful framework for creating rich Windows applications, and this tutorial provides a foundation for further exploration and development.