【WPF】ユーザーコントロールのデモプログラム Part-1「ファイル選択／フォルダ選択／DataGrid」

これまでに、WPF版のユーザーコントロールとして、フォルダ選択ダイアログ、ファイル選択ダイアログ、DataGridユーザーコントロールの３つを公開しました。

今回は、そのユーザーコントロールを使ったデモプログラムを作成したので公開したいと思います。

CSVの読み書きを行うCsvUtilクラスも含んでいますので、丸ごとご利用下さい。

デモプログラムの概要
ダウンロード先
1. 【WPF】ユーザーコントロールデモプログラム一式
デモプログラムのソースコード
まとめ

デモプログラムの概要

本でもプログラムは、次の３つのユーザーコントロールと、１つの共通クラスが含まれています。

フォルダ選択ダイアログ
ファイル選択ダイアログ
DataGridユーザーコントロール
CsvUtil

デモプログラムの画面は次の通りです。

ユーザーコントロールは画面に張り付けてあり、CsvUtilはDataGridユーザーコントロールの中から呼び出されています。

ダウンロード先

一式はこちらからダウンロードできます。

【WPF】ユーザーコントロールデモプログラム一式

1 ファイル 145.71 KB

ダウンロード

デモプログラムのソースコード

Xamlのソースコードは次の通りです。

基本はユーザーコントロールを張り付けているだけなのですが、DataGridユーザーコントロールのフィルター機能と検索機能を使うためのテキストボックスとボタンがあるので、その分ソースコード量が増えています。

<Window
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:UserControlTest"
        xmlns:CommonUserControl="clr-namespace:CommonUserControl" x:Class="UserControlTest.MainWindow"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>

        <CommonUserControl:DataGridControl x:Name="uxDataGrid" Margin="138,185,148,45" CurrentCellChanged="uxDataGrid_CurrentCellChanged" CellClick="uxDataGrid_CellClick" CellDoubleClick="uxDataGrid_CellDoubleClick" CellKeyDown="uxDataGrid_CellKeyDown" GridDataBinding="uxDataGrid_GridDataBinding"/>
        <CommonUserControl:FolderSelectControl x:Name="uxOpenFolder" Height="22" Margin="136,23,123,0" VerticalAlignment="Top" FolderSelected="uxOpenFolder_FolderSelected" />
        <CommonUserControl:FileSelectControl x:Name="uxOpenFile" Height="22" DialogType ="Open" Margin="136,50,123,0" VerticalAlignment="Top" FileSelected="uxOpenFile_FileSelected" Filter="CSV/TSV|*.csv;*.tsv|全て|*.*"/>
        <CommonUserControl:FileSelectControl x:Name="uxSaveFile" Height="22" DialogType="Save" Margin="136,77,123,0" VerticalAlignment="Top" FileSelected="uxSaveFile_FileSelected"/>
        <TextBox x:Name="uxFilter" HorizontalAlignment="Left" Height="23" Margin="187,129,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="422"/>
        <Label Content="フォルダ選択" HorizontalAlignment="Left" Margin="60,23,0,0" VerticalAlignment="Top"/>
        <Label Content="ファイル選択（Open）" HorizontalAlignment="Left" Margin="21,53,0,0" VerticalAlignment="Top" RenderTransformOrigin="0.314,1.962"/>
        <Label Content="フォルダ選択（Save)" HorizontalAlignment="Left" Margin="21,77,0,0" VerticalAlignment="Top"/>
        <Label Content="フィルタ" HorizontalAlignment="Left" Margin="138,126,0,0" VerticalAlignment="Top"/>
        <Button x:Name="uxFindNext" Content="検索↓" HorizontalAlignment="Left" Margin="480,157,0,0" VerticalAlignment="Top" Width="51" Height="23" Click="uxFindNext_Click"/>
        <Button x:Name="uxFindBack" Content="検索↑" HorizontalAlignment="Left" Margin="553,157,0,0" VerticalAlignment="Top" Width="51" Height="23" Click="uxFindBack_Click"/>
        <TextBox x:Name="uxFindString" HorizontalAlignment="Left" Height="23" Margin="187,157,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="260"/>
        <Label Content="検索" HorizontalAlignment="Left" Margin="148,154,0,0" VerticalAlignment="Top"/>
        <Button x:Name="uxExecFilter" Content="実行" HorizontalAlignment="Left" Margin="618,129,0,0" VerticalAlignment="Top" Width="51" Height="23" Click="uxExecFilter_Click"/>
        <Label x:Name="uxMessage" Content="" Margin="136,0,148,10" Background="#FFEBFFF0" BorderBrush="#FFD8CCCC" BorderThickness="2" Height="30" VerticalAlignment="Bottom"/>

    </Grid>
</Window>

<Window

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

xmlns:local="clr-namespace:UserControlTest"

xmlns:CommonUserControl="clr-namespace:CommonUserControl" x:Class="UserControlTest.MainWindow"

mc:Ignorable="d"

Title="MainWindow" Height="450" Width="800">

<Grid>

<CommonUserControl:DataGridControl x:Name="uxDataGrid" Margin="138,185,148,45" CurrentCellChanged="uxDataGrid_CurrentCellChanged" CellClick="uxDataGrid_CellClick" CellDoubleClick="uxDataGrid_CellDoubleClick" CellKeyDown="uxDataGrid_CellKeyDown" GridDataBinding="uxDataGrid_GridDataBinding"/>

<CommonUserControl:FolderSelectControl x:Name="uxOpenFolder" Height="22" Margin="136,23,123,0" VerticalAlignment="Top" FolderSelected="uxOpenFolder_FolderSelected" />

<CommonUserControl:FileSelectControl x:Name="uxOpenFile" Height="22" DialogType ="Open" Margin="136,50,123,0" VerticalAlignment="Top" FileSelected="uxOpenFile_FileSelected" Filter="CSV/TSV|*.csv;*.tsv|全て|*.*"/>

<CommonUserControl:FileSelectControl x:Name="uxSaveFile" Height="22" DialogType="Save" Margin="136,77,123,0" VerticalAlignment="Top" FileSelected="uxSaveFile_FileSelected"/>

</Grid>

</Window>

C#のソースコードは次の通りです。

やってることは、各ユーザーコントロールのイベントハンドラを定義し、イベントハンドラが呼ばれた時に、画面最下段のラベルにその旨を表示しているだけのものです。

DataGridユーザーコントロールの絞り込み機能と検索機能を使うための処理があるので、少し複雑になっていますが、やってることは単純です。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;

namespace UserControlTest
{
    /// <summary>
    /// MainWindow.xaml の相互作用ロジック
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();

            uxOpenFile.DialogType = CommonUserControl.FileSelectDialogType.Open;
        }

        private void Message(string format,params object[] args)
        {
            uxMessage.Content = string.Format(format, args);
        }

        private void uxOpenFolder_FolderSelected(object sender, EventArgs e)
        {
            Message("フォルダが選択されました");
        }

        private void uxOpenFile_FileSelected(object sender, EventArgs e)
        {
            Message("ファイル(Open)が選択されました");
        }

        private void uxSaveFile_FileSelected(object sender, EventArgs e)
        {
            Message("ファイル(Save)が選択されました");
        }

        private void uxFindNext_Click(object sender, RoutedEventArgs e)
        {
            uxDataGrid.FindNext(uxFindString.Text);
        }

        private void uxFindBack_Click(object sender, RoutedEventArgs e)
        {
            uxDataGrid.FindBack(uxFindString.Text);
        }

        private void uxExecFilter_Click(object sender, RoutedEventArgs e)
        {
            uxDataGrid.Filter = uxFilter.Text;
        }

        private void uxDataGrid_CurrentCellChanged(object sender, CommonUserControl.DataGridCellEventArgs e)
        {
            Message("カレントセルが行No{0} 列No{1} に移動しました。", e.RowIndex, e.ColumnIndex);
        }

        private void uxDataGrid_CellClick(object sender, CommonUserControl.DataGridMouseEventArgs e)
        {
            Message("行No{0} 列No{1} がクリックされました。",e.RowIndex,e.ColumnIndex);
        }

        private void uxDataGrid_CellDoubleClick(object sender, CommonUserControl.DataGridMouseEventArgs e)
        {
            Message("行No{0} 列No{1} がダブルクリックされました。", e.RowIndex, e.ColumnIndex);
        }

        private void uxDataGrid_CellKeyDown(object sender, CommonUserControl.DataGridKeyEventArgs e)
        {
            Message("キー{0}が押されました。", e.Key.ToString());
        }

        private void uxDataGrid_GridDataBinding(object sender, EventArgs e)
        {
            Message("データがバインドされました。");
        }
    }
}

using System;

using System.Collections.Generic;

using System.Linq;

using System.Text;

using System.Threading.Tasks;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Data;

using System.Windows.Documents;

using System.Windows.Input;

using System.Windows.Media;

using System.Windows.Media.Imaging;

using System.Windows.Shapes;

namespace UserControlTest

{

/// <summary>

/// MainWindow.xaml の相互作用ロジック

/// </summary>

public partial class MainWindow : Window

{

public MainWindow()

{

InitializeComponent();

uxOpenFile.DialogType = CommonUserControl.FileSelectDialogType.Open;

}

private void Message(string format,params object[] args)

{

uxMessage.Content = string.Format(format, args);

}

private void uxOpenFolder_FolderSelected(object sender, EventArgs e)

{

Message("フォルダが選択されました");

}

private void uxOpenFile_FileSelected(object sender, EventArgs e)

{

Message("ファイル(Open)が選択されました");

}

private void uxSaveFile_FileSelected(object sender, EventArgs e)

{

Message("ファイル(Save)が選択されました");

}

private void uxFindNext_Click(object sender, RoutedEventArgs e)

{

uxDataGrid.FindNext(uxFindString.Text);

}

private void uxFindBack_Click(object sender, RoutedEventArgs e)

{

uxDataGrid.FindBack(uxFindString.Text);

}

private void uxExecFilter_Click(object sender, RoutedEventArgs e)

{

uxDataGrid.Filter = uxFilter.Text;

}

private void uxDataGrid_CurrentCellChanged(object sender, CommonUserControl.DataGridCellEventArgs e)

{

Message("カレントセルが行No{0} 列No{1} に移動しました。", e.RowIndex, e.ColumnIndex);

}

private void uxDataGrid_CellClick(object sender, CommonUserControl.DataGridMouseEventArgs e)

{

Message("行No{0} 列No{1} がクリックされました。",e.RowIndex,e.ColumnIndex);

}

private void uxDataGrid_CellDoubleClick(object sender, CommonUserControl.DataGridMouseEventArgs e)

{

Message("行No{0} 列No{1} がダブルクリックされました。", e.RowIndex, e.ColumnIndex);

}

private void uxDataGrid_CellKeyDown(object sender, CommonUserControl.DataGridKeyEventArgs e)

{

Message("キー{0}が押されました。", e.Key.ToString());

}

private void uxDataGrid_GridDataBinding(object sender, EventArgs e)

{

Message("データがバインドされました。");

}

まとめ

今回は作ったユーザーコントロールのデモプログラムを解説しました。

こういうものを作っておくと、後々使い方を忘れた時とか、機能追加したときの動作確認として使えます。

ユーザーコントロールを増やしていくとプログラミングの生産性が格段に上がりますので、是非オリジナルのユーザーコントロールを増やしていってください。