4
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

【WPF】WPFとは何か簡単にまとめてみた【C#】

Last updated at Posted at 2025-03-14

概要

WPFとは何か、自身の勉強も兼ねてまとめてみました。

目次

WPFとは

WPFは「Windows Presentation Foundation」の略で、マイクロソフトにより開発されました。Windowsアプリケーションの画面を作成するための技術で、UI部分はXMLベースのマークアップ言語を使用した「XAML」というもので定義します。これにより、XAMLを使用してUI部分を作成するデザイナーと、ロジック部分を作成するプログラマの作業を分離して開発を進めることができます。
Visual Studioを使用して、C#を用いて開発することができます。

XAMLとは

「ザムル」と発音します。「Extensible Avalon Markup Language」の略です。「Avalon」は、WPFの開発当初のコードネームでした。XAMLはUIの構造と見た目をマークアップで定義できるものです。

XAMLのコードは全てC#でも記述することができます。XAMLはC#でのインスタンスを階層的に表現したものです。
例えば、以下のようなxamlがあるとすると、

<Window 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    Title="サンプルウィンドウ"
    Width="300" Height="200">
    
    <Grid>
        <Button Content="クリックしてください" 
                HorizontalAlignment="Center"
                VerticalAlignment="Center"/>
    </Grid>
</Window>

以下のようにC#でも表現できます。

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();

        // Windowの設定
        Title = "サンプルウィンドウ";
        Width = 300;
        Height = 200;

        // Gridの作成と設定
        var grid = new Grid();
        Content = grid;

        // Buttonの作成と設定
        var button = new Button
        {
            Content = "クリックしてください",
            HorizontalAlignment = HorizontalAlignment.Center,
            VerticalAlignment = VerticalAlignment.Center
        };

        // GridにButtonを追加
        grid.Children.Add(button);
    }
}

歴史

マイクロソフトは2002年に.NET Frameworkをリリースした後あたりから、新しいUIフレームワークの必要性を感じていました。
従来のWindows Formsには以下のような課題があったからです。

  • グラフィック描画性能の限界
  • モダンなUIが実現できない
  • 開発効率を格段に上げられない

そこでマイクロソフトは上記を改善するような「WPF」の開発を進め、2006年に発売されたWindows Vistaにプリインストールされる形で公開されました。

Windows Formsとの違い

WPFとWindows Formには以下のような違いがあります。

特徴 WPF Windows Forms
グラフィックス Direct3Dという3Dグラフィックスを描画できるAPIを使用 GDI/GDI+を使用
描画形式
※ベクターとラスターの違い
ベクターベース ラスターベース
カスタマイズ性 高い
(スタイルやテンプレートを使用して再利用や柔軟な変更が可能)
比較的制限される
学習コスト 比較的高い
(C#以外にxamlの取得やMVVMパターンなどの把握が必要になるため)
比較的低い

Microsoftが提供するマルチメディアAPIの総称はDirectXといいますが、Direct3Dはその中に含まれる3Dグラフィックス処理用のAPIのことを指します。

MVVMについて

MVVMは (Model-View-ViewModel) の略で、WPFアプリを開発するための設計パターンです。3つの主要なコンポーネントに分割して、それぞれの責任を明確に分離することで、保守性が向上できます。
特に大規模なアプリケーション開発や、複数人での開発を行う際にその価値が発揮されます。

Model

アプリのデータとビジネスロジックを担当します。
データベースや外部のサービスと連携を行うのもModelの仕事です。
UI部分は意識せず、データの処理に集中する部分です。

View

ユーザーが視覚的に見ることができるUIの部分です。XAMLを使用して定義します。
データバインディングという機能を用いて、ViewModelと連携を行います。
ビジネスロジックは意識せず、表示に集中する部分です。

ViewModel

ModelとViewの橋渡しとしての役割を持ちます。
データバインディングを用いてViewと連携を行います。
また、コマンドを通じてユーザーがUIの操作を行った直後の処理を担当します。

Prismについて

Prismは、WPFアプリケーション開発のMVVMパターンを効率よく書くことをサポートしてくれるライブラリです。

インストール方法

Visual StudioのNugetからインストールできます。

「Prism.Core」はPrismのコアとなるパッケージです。「Prism.Wpf」はwpf用のパッケージで、他にも「Prism.Form」というXamarin用のパッケージがあります。

例えば、Modelはプロパティが変更された際、ViewModelに通知する必要があります。
Prismを使用しない方法でそれを書くと、INotifyPropertyChangedを使用する形で以下のような形になると思います。

Model

Model.cs
    public class Model : INotifyPropertyChanged
    {
        public string Name
        {
            get => _name;
            set
            {
                if (_name != value)
                {
                    _name = value;
                    OnPropertyChanged();
                }
            }
        }
        private string _name;

        public event PropertyChangedEventHandler PropertyChanged;
        
        protected void OnPropertyChanged(string propertyName)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
    }

ViewModel

ViewModel.cs
public class ViewModel : INotifyPropertyChanged
{
    private readonly Model _model;
    private string _displayName;

    public ViewModel(Model model)
    {
        _model = model;
        _model.PropertyChanged += HandleModelPropertyChanged;
        _displayName = model.Name;
    }

    private void HandleModelPropertyChanged(object sender, PropertyChangedEventArgs e)
    {
        if (e.PropertyName == nameof(Model.Name))
        {
            _displayName = _model.Name;
            OnPropertyChanged(nameof(DisplayName));
        }
    }

    public string DisplayName
    {
        get => _displayName;
        private set
        {
            if (_displayName != value)
            {
                _displayName = value;
                OnPropertyChanged();
            }
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;
    
    protected void OnPropertyChanged(string propertyName)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

上記をprismを使用すると、以下のようにシンプルに記載できます。

Model

Model.cs
public class Model : BindableBase
{
    private string _name;
    public string Name
    {
        get => _name;
        set => SetProperty(ref _name, value);
    }
}

ViewModel

ViewModel.cs
public class ViewModel : BindableBase
{
    private readonly Model _model;
    private string _displayName;

    public ViewModel(Model model)
    {
        _model = model;
        _model.PropertyChanged += HandleModelPropertyChanged;
        _displayName = model.Name;
    }

    private void HandleModelPropertyChanged(object sender, PropertyChangedEventArgs e)
    {
        if (e.PropertyName == nameof(Model.Name))
        {
            DisplayName = _model.Name;
        }
    }

    public string DisplayName
    {
        get => _displayName;
        private set => SetProperty(ref _displayName, value);
    }
}

このようにPrismのBindableBaseを継承するだけで、手動で実装する箇所が少なくなります。

上記以外にもprismの機能はたくさんあります。
また、他にWPFの開発を効率的に進められるライブラリとして、ReactivePropertyというものもあります。

参考:

その他

以下のブログにWPF入門用の詳しいブログ記事がまとめられていました。

また、以下のページによると、Visual Studioのベース部分はWPFで作成されているよう(?)でした。

自分で記載したWPF関連の記事

自分で記載したWPFの記事をまとめました。
こちらはほぼ自分用です。

4
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?