C#でのWPFアプリケーション開発入門：基本から応用まで

<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="入力内容の表示" Height="220" Width="400">
    <Grid Margin="16">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <TextBox x:Name="inputTextBox" MinHeight="30"/>
        <Button Grid.Row="1" Content="Click Me" Width="100"
                Margin="0,8,0,8" HorizontalAlignment="Left" Click="Button_Click"/>
        <TextBlock x:Name="outputTextBlock" Grid.Row="2" TextWrapping="Wrap"/>
    </Grid>
</Window>

using System.Windows;

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

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            outputTextBlock.Text = inputTextBox.Text;
        }
    }
}

<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" Width="100" Height="50" VerticalAlignment="Top" HorizontalAlignment="Left"/>
    </Grid>
</Window>

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>

    <Button Content="Button 1" Grid.Row="0" Grid.Column="0"/>
    <Button Content="Button 2" Grid.Row="0" Grid.Column="1"/>
    <Button Content="Button 3" Grid.Row="1" Grid.Column="0"/>
    <Button Content="Button 4" Grid.Row="1" Grid.Column="1"/>
</Grid>

<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="要素間バインディング" Height="200" Width="400">
    <StackPanel Margin="16">
        <TextBox x:Name="inputTextBox" MinHeight="30"/>
        <TextBlock Text="{Binding Text, ElementName=inputTextBox, Mode=OneWay}"
                   Margin="0,12,0,0" TextWrapping="Wrap"/>
    </StackPanel>
</Window>

using System.Windows;

namespace WpfApp;

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        DataContext = new Person { Name = "John Doe" };
    }
}

public class Person
{
    public string Name { get; set; } = string.Empty;
}

<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:WpfApp"
        Title="MainWindow" Height="200" Width="400">
    <Window.DataContext>
        <local:Person Name="Jane Doe"/>
    </Window.DataContext>
    <Grid>
        <TextBlock Text="{Binding Name}" Width="200" Height="30" Margin="10"/>
    </Grid>
</Window>

<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="200" Width="400">
    <Grid>
        <Button Content="Click Me" Width="100" Height="50" VerticalAlignment="Top" HorizontalAlignment="Left" Click="Button_Click"/>
    </Grid>
</Window>

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!");
        }
    }
}

<TextBox Width="200" Height="30" Margin="10" TextChanged="TextBox_TextChanged"/>

private void TextBox_TextChanged(object sender, TextChangedEventArgs e)
{
    // 文字が変更されたときの処理
}

<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="200" Width="400" Loaded="Window_Loaded">
    <Grid>
        <!-- UI要素 -->
    </Grid>
</Window>

private void Window_Loaded(object sender, RoutedEventArgs e)
{
    // ウィンドウがロードされたときの処理
}

<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="200" Width="400">
    <Window.Resources>
        <Style TargetType="Button">
            <Setter Property="Background" Value="LightBlue"/>
            <Setter Property="Foreground" Value="Navy"/>
            <Setter Property="FontWeight" Value="Bold"/>
            <Setter Property="Margin" Value="10"/>
        </Style>
    </Window.Resources>
    <StackPanel Margin="8">
        <Button Content="Button 1"/>
        <Button Content="Button 2"/>
        <Button Content="Button 3"/>
    </StackPanel>
</Window>

<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="200" Width="400">
    <Window.Resources>
        <Style TargetType="Button">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Border Background="{TemplateBinding Background}" BorderBrush="DarkBlue" BorderThickness="2" CornerRadius="10">
                            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>
    <StackPanel Margin="8">
        <Button Content="Custom Button 1" Background="LightBlue" Margin="4" Height="40"/>
        <Button Content="Custom Button 2" Background="LightGreen" Margin="4" Height="40"/>
    </StackPanel>
</Window>

<Application.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="Styles.xaml"/>
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
</Application.Resources>

using System.ComponentModel;
using System.Runtime.CompilerServices;

namespace WpfApp;

public class Person : INotifyPropertyChanged
{
    private string _name = string.Empty;
    private int _age;

    public string Name
    {
        get => _name;
        set
        {
            if (_name == value) return;
            _name = value;
            OnPropertyChanged();
        }
    }

    public int Age
    {
        get => _age;
        set
        {
            if (_age == value) return;
            _age = value;
            OnPropertyChanged();
        }
    }

    public event PropertyChangedEventHandler? PropertyChanged;
    private void OnPropertyChanged([CallerMemberName] string? name = null) =>
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(name));
}

using System.Collections.ObjectModel;
using System.ComponentModel;

namespace WpfApp;

public class MainViewModel : INotifyPropertyChanged
{
    private string _newName = string.Empty;

    public ObservableCollection<Person> People { get; } = new()
    {
        new Person { Name = "John Doe", Age = 30 },
        new Person { Name = "Jane Doe", Age = 25 }
    };

    public string NewName
    {
        get => _newName;
        set
        {
            if (_newName == value) return;
            _newName = value;
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(NewName)));
            AddPersonCommand.RaiseCanExecuteChanged();
        }
    }

    public RelayCommand AddPersonCommand { get; }
    public RelayCommand DeletePersonCommand { get; }

    public MainViewModel()
    {
        AddPersonCommand = new RelayCommand(
            _ =>
            {
                People.Add(new Person { Name = NewName.Trim(), Age = 20 });
                NewName = string.Empty;
            },
            _ => !string.IsNullOrWhiteSpace(NewName));

        DeletePersonCommand = new RelayCommand(
            parameter =>
            {
                if (parameter is Person person) People.Remove(person);
            },
            parameter => parameter is Person);
    }

    public event PropertyChangedEventHandler? PropertyChanged;
}

<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:WpfApp"
        Title="MVVMの人名リスト" Height="360" Width="480">
    <Window.DataContext>
        <local:MainViewModel/>
    </Window.DataContext>
    <DockPanel Margin="16">
        <StackPanel DockPanel.Dock="Top" Margin="0,0,0,12">
            <Label Content="追加する名前" Target="{Binding ElementName=nameInput}"/>
            <TextBox x:Name="nameInput"
                     Text="{Binding NewName, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
            <Button Content="追加" Command="{Binding AddPersonCommand}"
                    HorizontalAlignment="Left" Margin="0,8,0,0" Padding="16,4"/>
        </StackPanel>
        <ListBox ItemsSource="{Binding People}">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal" Margin="0,4">
                        <TextBlock Text="{Binding Name}" Width="180"/>
                        <TextBlock Text="{Binding Age}" Width="40"/>
                        <Button Content="削除" Padding="8,2"
                                Command="{Binding DataContext.DeletePersonCommand,
                                          RelativeSource={RelativeSource AncestorType={x:Type Window}}}"
                                CommandParameter="{Binding}"/>
                    </StackPanel>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </DockPanel>
</Window>

using System.Windows;

namespace WpfApp;

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

using System;
using System.Windows.Input;

namespace WpfApp;

public class RelayCommand : ICommand
{
    private readonly Action<object?> _execute;
    private readonly Predicate<object?>? _canExecute;

    public RelayCommand(Action<object?> execute, Predicate<object?>? canExecute = null)
    {
        _execute = execute ?? throw new ArgumentNullException(nameof(execute));
        _canExecute = canExecute;
    }

    public bool CanExecute(object? parameter) => _canExecute?.Invoke(parameter) ?? true;

    public void Execute(object? parameter)
    {
        if (CanExecute(parameter)) _execute(parameter);
    }

    public event EventHandler? CanExecuteChanged;
    public void RaiseCanExecuteChanged() => CanExecuteChanged?.Invoke(this, EventArgs.Empty);
}

private string _name = string.Empty;
public string Name
{
    get { return _name; }
    set
    {
        if (_name == value) return;
        _name = value;
        OnPropertyChanged(nameof(Name));
    }
}

CREATE TABLE People (
    Id INTEGER PRIMARY KEY AUTOINCREMENT,
    Name TEXT NOT NULL,
    Age INTEGER NOT NULL
);
INSERT INTO People (Name, Age) VALUES ('John Doe', 30);
INSERT INTO People (Name, Age) VALUES ('Jane Doe', 25);

namespace WpfApp;

public class Person
{
    public long Id { get; set; }
    public string Name { get; set; } = string.Empty;
    public int Age { get; set; }
}

using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.IO;
using System.Threading.Tasks;
using Microsoft.Data.Sqlite;

namespace WpfApp;

public class MainViewModel
{
    public ObservableCollection<Person> People { get; } = new();

    // UIスレッドから呼び出す。コンストラクターではDBへ接続しない。
    public async Task LoadAsync()
    {
        List<Person> rows = await Task.Run(ReadPeople);
        // WPFの同期コンテキストへ戻ってからバインド中のコレクションを更新。
        People.Clear();
        foreach (Person person in rows) People.Add(person);
    }

    private static List<Person> ReadPeople()
    {
        string directory = Path.Combine(
            Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData),
            "WpfApp");
        Directory.CreateDirectory(directory);
        string path = Path.Combine(directory, "people.sqlite");
        bool isNewFile = !File.Exists(path);
        string connectionString = new SqliteConnectionStringBuilder
        {
            DataSource = path
        }.ToString();

        using var connection = new SqliteConnection(connectionString);
        connection.Open();
        using (var initialize = connection.CreateCommand())
        {
            initialize.CommandText = """
                CREATE TABLE IF NOT EXISTS People (
                    Id INTEGER PRIMARY KEY AUTOINCREMENT,
                    Name TEXT NOT NULL,
                    Age INTEGER NOT NULL
                );
                """;
            initialize.ExecuteNonQuery();
            if (isNewFile)
            {
                initialize.CommandText = """
                    INSERT INTO People (Name, Age) VALUES ('John Doe', 30);
                    INSERT INTO People (Name, Age) VALUES ('Jane Doe', 25);
                    """;
                initialize.ExecuteNonQuery();
            }
        }

        using var command = connection.CreateCommand();
        command.CommandText = "SELECT Id, Name, Age FROM People ORDER BY Id;";
        using var reader = command.ExecuteReader();
        var result = new List<Person>();
        while (reader.Read())
        {
            result.Add(new Person
            {
                Id = reader.GetInt64(0),
                Name = reader.GetString(1),
                Age = reader.GetInt32(2)
            });
        }
        return result;
    }
}

<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="SQLiteの人名リスト" Height="350" Width="480"
        Loaded="Window_Loaded">
    <Grid Margin="16">
        <ListBox ItemsSource="{Binding People}">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel Margin="0,4">
                        <TextBlock Text="{Binding Name}" FontWeight="Bold"/>
                        <TextBlock Text="{Binding Age}"/>
                    </StackPanel>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </Grid>
</Window>

using System;
using System.IO;
using System.Windows;
using Microsoft.Data.Sqlite;

namespace WpfApp;

public partial class MainWindow : Window
{
    private readonly MainViewModel _viewModel = new();

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

    private async void Window_Loaded(object sender, RoutedEventArgs e)
    {
        Loaded -= Window_Loaded; // 初回だけ読み込む。
        try
        {
            await _viewModel.LoadAsync();
        }
        catch (Exception ex) when (ex is SqliteException or IOException or UnauthorizedAccessException)
        {
            MessageBox.Show(this, $"データを読み込めませんでした。\n{ex.Message}",
                "読み込みエラー", MessageBoxButton.OK, MessageBoxImage.Error);
        }
    }
}