Shoeisha Technology Media

CodeZine(コードジン)

特集ページ一覧

日付入力をカレンダーから行うWPFアプリケーションの作成

PowerTools InputMan for WPF 1.0JのGcDateTimeコントロールを使ったWPFアプリケーションの作成

  • ブックマーク
  • LINEで送る
  • このエントリーをはてなブックマークに追加
2011/08/31 14:00

 今回も前回に引き続き、入力インタフェースの構築を強力にサポートする「PowerTools InputMan for WPF 1.0J」に着目します。本稿では、「GcDateTimeコントロール」を使って、簡単な休暇申請フォームを持ったWPFアプリケーションを作成してみました。

はじめに

 日付の処理はアプリケーションで多く使われていますが、WPFアプリケーションでも日付の入力を求めるアプリケーションを作成する場合があります。日付入力のインターフェイスはカレンダーを使ったものが主流ですが、ただ日付を選ぶものよりも、カラフルな表示や和暦、曜日の表示など、多彩な機能を持ったコントロールがあるとUIも作りやすくなります。

 PowerTools InputMan for WPF 1.0JのGcDateTimeコントロールは、ドロップダウンカレンダースピン機能を備え、視覚的な日付入力をユーザーに提供するコントロールです。西暦・和暦表示が行え、外観や機能をカスタマイズできるので、最適な日付入力インタフェースを作ることができます。

 今回は、このGcDateTimeコントロールを使って、簡単な休暇申請フォームを持ったWPFアプリケーションを作成してみました。

書式設定も豊富で、フィールド単位での表示設定なども可能
書式設定も豊富で、フィールド単位での表示設定なども可能
和暦の表示
和暦の表示
ドロップダウンボタンでカレンダー表示
ドロップダウンボタンでカレンダー表示

対象読者

 Visual Basic、Visual C# 2010を使ってプログラムを作ったことのある人

必要な環境

 Visual Basic 2010、Visual C# 2010、Visual Studio 2010でプログラムが作れる環境。なお、本プログラムはWindows Vista上で動作するVisual Studio 2010を使用して作成し、動作確認を行っています。

※サンプルソース実行時の注意事項

 動作環境として、あらかじめ.NET Framework 4.0 がインストールされている必要があります。動作するOSは、以下を参照ください。


動作するOS一覧
OS 32ビット(x86) 64ビット(x64)
Windows XP 日本語版
Windows Vista 日本語版
Windows 7 日本語版
Windows Server 2003 日本語版
Windows Server 2008 日本語版
Windows Server 2008 R2 日本語版 -

コンポーネントのインストール

 この記事の手順を試すには、Visual Studio、Visual Basic、Visual C#の開発環境にPowerTools InputMan for WPF 1.0Jをインストールする必要があります。インストーラは、グレープシティのWebページからダウンロードできます。

 製品ページの[申込フォーム]をクリックし、グレープシティのWebサイトへ必要情報を登録すると、添付トライアルライセンスキーファイルとダウンロードサイトを記載したE-Mailが送られてきますので、ここからダウンロードします。制限事項などの詳細については、インストーラに同梱されているリリースノートを参照ください。

コントロールの追加

 PowerTools InputMan for WPF 1.0Jをインストールしたら、ツールボックスに専用のタブを作成し、使用するコンポーネントを追加します。追加するコンポーネントは、[WPFコンポーネント]で、アセンブリ名が[GrapeCity.WPF.InputMan]の「GcDateTime」コントロールです。

WPFコンポーネント名が[GrapeCity.WPF.InputMan]の「GcDateTime」コントロールを選択する
WPFコンポーネント名が[GrapeCity.WPF.InputMan]の「GcDateTime」コントロールを選択する

GcDateTimeコントロールについて

 GcDateTimeコントロールは、ドロップダウンカレンダーとスピン機能を備え、視覚的な日付入力を行うコントロールです。西暦・和暦の表示が選択でき、年月日や接頭詞・接尾詞に任意の文字を設定できます。また、それぞれのフィールドの文字色・背景色、フォントなど、外観や機能もカスタマイズできます。

 GcDateTimeコントロールは書式設定機能を持ち、日付や時刻の入力および表示の書式を自由に設定できます。入力書式は、コントロールが入力フォーカスを受け取ったときの書式で、表示書式は入力フォーカスのないときの書式です。

 日付の入力には、テキストフィールドに直接日時を入力する方法、ドロップダウンカレンダーから日付を選択する方法、そしてスピンボタンによって入力する方法という3つがあります。入力した日時は、TextプロパティとValueプロパティに格納されます。

GcDateTimeコントロールの表示領域とオブジェクト構成

 GcDateTimeコントロールの表示領域は、通常リテラル文字列と入力フィールドの2種類に分かれています。

リテラル文字列と入力フィールド(ヘルプファイルより抜粋)
リテラル文字列と入力フィールド(ヘルプファイルより抜粋)

 これらの表示領域(年月日や時刻、西暦・和暦、リテラル文字など)は、それぞれのフィールドがオブジェクトとなっており、さらに入力用と表示用に別々の書式を設定できるようになっています。

 各オブジェクトの設定は、デザイン時はプロパティウィンドウを使ってXAMLで行い、実行時はVisual Basic/C#のコードから設定できるようになっています。

 入力時の書式を設定する入力フィールドは、次の11種類です。

  • DateAmPmField:午前/午後入力フィールド
  • DateDayField:日入力フィールド
  • DateEraField:年号入力フィールド
  • DateEraYearField:和暦入力フィールド
  • DateHourField:時間入力フィールド
  • DateLiteralField:リテラル文字フィールド
  • DateMinuteField:分入力フィールド
  • DateMonthField:月入力フィールド
  • DateSecondField:秒入力フィールド
  • DateShortHourField:12時間制時刻入力フィールド
  • DateYearField:年入力フィールド

 また、表示時の書式を設定するフィールドは、次の14種類のオブジェクトで構成されています。

  • DateADDisplayField:西暦表示フィールド
  • DateAmPmDisplayField:午前/午後表示フィールド
  • DateDayDisplayField:日表示フィールド
  • DateEraDisplayField:年号表示フィールド
  • DateEraYearDisplayField:和暦表示フィールド
  • DateHourDisplayField:時刻表示フィールド
  • DateLiteralDisplayField:リテラル文字表示フィールド
  • DateMinuteDisplayField:分表示フィールド
  • DateMonthDisplayField:月表示フィールド
  • DateSecondDisplayField:秒表示フィールド
  • DateShortHourDisplayField:12時間制時刻表示フィールド
  • DateSystemFormatDisplayField:システム書式表示フィールド
  • DateWeekdayDisplayField:曜日表示フィールド
  • DateYearDisplayField:年表示フィールド

 これらのフィールドオブジェクトは、オブジェクトの集合体であるDateFieldCollectionコレクション(入力書式)もしくは 、DateDisplayFieldCollectionコレクション(表示書式)に組み込んで使用します。

一括書式設定機能

 プロパティウィンドウを使用して書式を設定する場合は、あらかじめ用意されている書式パターンを選ぶか、カスタム書式を作成できます。書式は、キーワードの組み合わせで構成された文字列にて設定します。

指定できる書式の種類(一部)
書式指定 表示
yyyy/MM/dd HH:mm:ss 2011/11/11 09:55:39
yyy年M月d日 2011年8月16日
yyy年M月d日(dddd) 2011年8月16日(火曜日)
ggg e年M月d日 平成23年8月16日
プロパティウィンドウによる書式指定
プロパティウィンドウによる書式指定

和暦表示

 GcDateTimeコントロールでは、通常プロパティウィンドウによる書式設定で和暦表示が可能ですが、それ以外に独自に和暦の年号を表示する機能を持っています。

 独自の年号定義は、「imwpf_eras」というキーを持つ文字列リソースとして、アプリケーションリソースに追加します。WPFアプリケーションプロジェクトの場合は、既定で追加されるApp.xamlを用いてリソースを追加します。XAMLでの独自の年号定義は、以下の構成要素を用いて記述します。

XAMLでの定義に使用する構成要素
要素 説明
<imwpf_eras> 1つあるいは複数の<add>要素が含まれます。
<add> 年号の名前、開始日およびショートカットを指定します。

 また、<add>要素では、以下の属性を指定する必要があります。

<add>要素に指定する属性
属性 説明
name 年号を表すキーワード"ggg"で表示される正式名称を示します。
abbreviation 年号を表すキーワード"gg"で表示される年号の頭文字を示します。
symbol 年号を表すキーワード"g"で表示される年号の頭文字をアルファベットを示します。
startDate 年号の開始日です。
shortcuts 年号をキーワードにより入力するためのショートカットを設定します。キーワードは数字、アルファベットの2つをカンマ","で区切って指定します。

 例えば、年号を平仮名表記にしたい場合は以下のように記述します。

<imwpf_eras>
    <add name="めいじ" abbreviation="めい" symbol="M" startDate="1868-09-08" shortcuts="1,M" />
    <add name="たいしょう" abbreviation="たい" symbol="T" startDate="1912-07-30" shortcuts="2,T" />
</imwpf_eras>

 XAMLのサンプルコード全体は、次のようになります。なお、独自の年号定義を使用した場合、既定の年号定義はクリアされます。そのため、昭和、平成を漢字で使用した場合は、それらの年号についても定義内に記述してください。

<Application xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
             x:Class="WPFApplication1.App"
             xmlns:sys="clr-namespace:System;assembly=mscorlib"
             StartupUri="MainWindow.xaml">
    <Application.Resources>
        <!-- 以下の記述を追加します -->
        <!-- なお、上記のように xmlns:sys 名前空間を追加する必要があります  -->
        <sys:String x:Key="imwpf_eras">
            <![CDATA[
                <configSections>
                    <section name="imwpf_eras" type="GrapeCity.Windows.InputMan.ErasSectionHandler, GrapeCity.WPF.InputMan, Version=1.0.2010.1108, Culture=neutral, PublicKeyToken=0ba7528ecf28c40a"/>
                </configSections>
                <imwpf_eras>
                    <add name="めいじ" abbreviation="めい"  symbol="M" startDate="1868-09-08" shortcuts="1,M"/>
                    <add name="たいしょう" abbreviation="たい"  symbol="T" startDate="1912-07-30" shortcuts="2,T"/> 
                    <add name="昭和" abbreviation="昭"  symbol="S" startDate="1926-12-25" shortcuts="3,S"/>
                    <add name="平成" abbreviation="平"  symbol="H" startDate="1989-01-08" shortcuts="4,H"/>
                </imwpf_eras>
            ]]>
        </sys:String>
    </Application.Resources>
</Application>

その他の機能

  • フィールドのスタイル

     各フィールドのフォントや色といったスタイルを設定できます。

    フィールド単位でのスタイル設定
    フィールド単位でのスタイル設定
  • 未入力時に表示する透かし表示テキスト

     コントロールが未入力のときに、代わりに透かし表示するテキストを文字列として設定できます。

  • フィールドの入力モード

     FieldsEditModeプロパティを使用すると、日付コントロールの各フィールドの入力モードを変更できます。

  • 入力候補値の表示

     日付コントロールで値が未入力のとき、入力候補となる値をグレー表示できます。

  • 最大値/最小値の設定

     MaxDateプロパティおよびMinDateプロパティを使用して、入力可能な日付の最大値および最小値を指定できます。

  • ドロップダウンカレンダー

     日付コントロールには、入力用カレンダーをドロップダウン表示するドロップダウンカレンダーが搭載されています。カレンダーの外観を自由に設定できるほか、休日の登録といったカスタマイズが可能です。

  • スピン機能

     式に設定した各フィールドの値を増減できるスピン機能が搭載されています。スピン機能を有効にするには、コントロールの「AllowSpin」プロパティをTrueに設定します。スピンボタンを表示させる場合は「SpinButtonVisibility」プロパティを使用します。

  • デフォルトのイベント

     GcDateTimeコントロールのデフォルトのイベントは、「ValueChanged」です。このイベントは、コントロールの値が変更されると発生します。また、コントロールに文字列を入力すると、TextChangedイベントが発生します。

WPFアプリケーションの作成

 さっそく、GcDateTimeコントロールを使ってWPFアプリケーションを作成しましょう。今回作成するアプリケーションは、簡単な休暇申請フォームで、休暇開始日と終了日、申請年月日をGcDateTimeコントロールで入力し、休暇日数を表示します。また、チェックボックスを使って西暦・和暦表示を切り替えられるようにします。

GUIのデザイン

 メインのコントロールはGcDateTimeコントロールで、それ以外にComboBox、Label、TextBox、Button、Borderコントロールでページを構成します。2つのComboBoxコントロールには、それぞれ休暇目的と所属名をリストに組み込みます。文字の表示はすべてLabelコントロールを使用しています(GcDateTimeコントロールの設定は、後述します)。

コントロールのレイアウト
コントロールのレイアウト

GcDateTimeコントロールの作成

 GcDateTimeコントロールは、全部で3つ作成し、配置します。それぞれ、入力書式と表示書式をプロパティウィンドウで設定します。

入力・表示書式の設定

 ツールボックスからGcDateTimeコントロールをドラッグ&ドロップします。

 デフォルトでは、入力・表示とも「2011/08/16 11:02:58」と、日付と時刻の表示になっています。これを、次のように入力用と表示用が違う表示になるように設定します。

デフォルト(日付と時刻の表示)と設定後
デフォルト(日付と時刻の表示)と設定後

 配置した最初のGcDateTimeコントロールを選択し、プロパティウィンドウの「フィールドセット」を展開します。「DisplayFieldSet」と「FieldSet」の2つのプロパティが表示されます。「DisplayFieldSet」が表示書式で、「FieldSet」が入力書式を設定するオブジェクトです。

 では、入力書式を設定します。「FieldSet」の入力欄にある[...]ボタンを押すと、「入力書式の設定」ダイアログが表示されます。ここから、[yyyy年MM月dd日]を選びます。これで、入力時は年月日だけが表示されるようになります。

「入力書式の設定」ダイアログで書式を選ぶ
「入力書式の設定」ダイアログで書式を選ぶ

 ダイアログを閉じ、プロパティウィンドウに戻って「DisplayFieldSet」の入力欄にある[...]ボタンを押します。今度は、「表示書式の設定」ダイアログが表示されるので、ここから[yyy年M月d日 (dddd)]を選びます。これで、入力データが曜日表示付きの年月日で表示されます。

「表示書式の設定」ダイアログで曜日表示付きの年月日を選ぶ
「表示書式の設定」ダイアログで曜日表示付きの年月日を選ぶ

 残り2つのGcDateTimeコントロールも、同じように入力・表示書式を設定します。

表示書式のフィールドのデザイン

 次に、表示書式の年と曜日の文字色・背景色を変更します。デザインペインで、最初に配置したGcDateTimeコントロールの[年]の部分をクリックします。プロパティウィンドウが「DateYearDisplayField」クラスのプロパティに入れ替わるので、[ブラシ]をクリックして展開します。ここで、文字色や背景色を設定します。

[年]の部分をクリックし[ブラシ]をクリックして展開
[年]の部分をクリックし[ブラシ]をクリックして展開

 ここでは、カラーパレットを使ってBackgroundを「#FFD755C2」に、Foregroundを「Cornsilk」にしています。

カラーパレットで色を選ぶ
カラーパレットで色を選ぶ

 次に、曜日をクリックします。プロパティウィンドウが「DateWeekdayDisplayField」クラスのプロパティに変わるので、同じように[ブラシ]をクリックして展開し、Foregroundを「Blue」にします。このようにして、表示書式の各フィールドの文字色や背景色、枠線の設定を行うことができます。

 再び、GcDateTimeコントロールをクリックし、「ブラシ」を展開してBackgroundを「Lavender」に設定します。これで、GcDateTimeコントロール全体の背景色が設定されます。同じように、残り2つのGcDateTimeコントロールも文字色、背景色を設定します。

スピンボタンの表示

 スピンボタンは、デフォルトで「AllowSpin」プロパティがTrueになっていて、使用できるようになっていますが、表示されないようになっています。そこで、「休暇終了日」用のGcDateTimeコントロールだけスピンボタンを表示状態にします。

 「休暇終了日」用のGcDateTimeコントロールをクリックし、プロパティウィンドウの「ボタン」を展開します。「SpinButtonVisibility」プロパティの値欄をクリックし、リストから「ShowAlways」を選びます。これで、GcDateTimeコントロールにスピンボタンが表示されます。

GcDateTimeコントロールにスピンボタンが表示される
GcDateTimeコントロールにスピンボタンが表示される

 スピンボタンの動作は、そのままGcDateTimeコントロールの動作範囲と同じですが、増減値は「SpinIncrementValue」で行います。

 また、スピン機能による値の増減は、フィールド単位あるいは値全体のいずれかに対して行うことができます。SpinModeプロパティをDateSpinMode.Fieldに設定すればフィールド単位で、DateSpinMode.Valueに設定すれば値全体に対して値の増減が行われます。

SpinModeプロパティの値
プロパティ 説明
DateSpinMode.Field キャレットの位置に存在するフィールドに対して値の増減を行います。増減値はSpinIncrementプロパティで設定します。なお、リテラルフィールド上にキャレットがある場合、スピン機能は無効になります。
DateSpinMode.Value キャレットの位置に関わらず、値全体に対して値の増減を行います。増減値はSpinIncrementValueプロパティで設定します。

取得休暇日数の計算処理

 GcDateTimeコントロールの設定ができたら、取得休暇日数の計算を行う処理を作成します。この計算は簡単で、GcDateTimeコントロールのValueプロパティの値を差し引きするだけです。処理は、「休暇終了日」用のGcDateTimeコントロール「GcDateTime2」の「ValueChanged」イベントハンドラで行います。

 GcDateTimeコントロールのValueプロパティは、DateTime型の値を格納しており、差し引いた値はTimeSpan型で取得し、Daysプロパティの値を取得して、TextBlockコントロールで表示します。

Visual Basic
Private Sub GcDateTime2_ValueChanged(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles GcDateTime2.ValueChanged
    Dim diff As TimeSpan
    diff = GcDateTime2.Value - GcDateTime1.Value
    TextBlock1.Text = diff.Days.ToString + "日"
End Sub
C#
private void GcDateTime2_ValueChanged(object sender, RoutedEventArgs e)
{
    TimeSpan diff;
    diff = (TimeSpan)(GcDateTime2.Value - GcDateTime1.Value);
    TextBlock1.Text = diff.Days.ToString() + "日";
}

和暦・西暦表示の処理

 今度は、CheckBoxコントロールを使って、コードから和暦と西暦を切り替える処理を作成します。この処理は、CheckBoxコントロールのChecked・Uncheckedイベントハンドラで行いますが、同じ処理を3つのGcDateTimeコントロールに対して行うので、専用のメソッドを作成して呼び出す形を取ります。

西暦から和暦への変換処理

 最初は、西暦から和暦への変換処理を作成します。メソッド名は「wareki_henkan」で、引数に「GcDateTime」型の変数を指定します。また、GcDateTimeコントロールの各フィールドを操作するため、次の2つの名前空間をインポートしておきます。

GrapeCity.Windows.InputMan
GrapeCity.Windows.InputMan.Fields

 メソッドを作成したら、最初に表示書式の各フィールドを設定します。和暦を設定するには、まずDateEraYearDisplayFieldオブジェクトを作成します。コンストラクタの引数はありません。次に、それぞれ表示書式用のフィールドオブジェクトを作成して、そのオブジェクトを表示順に順番にDateDisplayFieldCollectionコレクションに追加します。各フィールドとクラスの関係は下表のようになります。

各フィールドとクラスの関係
各フィールド クラス
リテラル文字 DateLiteralDisplayField
月表示フィールド DateMonthDisplayField
日表示フィールド DateDayDisplayField
年号表示フィールド DateEraDisplayField
曜日表示フィールド DateWeekdayDisplayField

 また、文字色・背景色はそれぞれのオブジェクトの「Background」・「Foreground」プロパティを設定します。なお、それそれのフィールドを設定する前に、現在設定されているフィールドの書式をClearメソッドで消去しておきます。

Visual Basic
Imports GrapeCity.Windows.InputMan
Imports GrapeCity.Windows.InputMan.Fields

Private Sub wareki_henkan(ByVal gcname As GcDateTime) '和暦書式の作成

    ' 表示フィールドの設定
    Dim wareki As New DateEraYearDisplayField()
    Dim yearLiteral As New DateLiteralDisplayField("年")
    Dim MonthDisplayField As New DateMonthDisplayField(False)
    Dim MonthLiteral As New DateLiteralDisplayField("月")
    Dim DayDisplayField As New DateDayDisplayField(False)
    Dim DayLiteral As New DateLiteralDisplayField("日")

    Dim heisei As New DateEraDisplayField()
    Dim newcolor As New SolidColorBrush(Color.FromRgb(215, 85, 194))
    heisei.Background = newcolor
    heisei.Foreground = Brushes.Cornsilk

    Dim youbi As New DateWeekdayDisplayField(0)
    youbi.Foreground = Brushes.Blue
    Dim maekakko As New DateLiteralDisplayField("(")
    Dim atokakko As New DateLiteralDisplayField(")")

    ' 表示フィールドをクリア
    gcname.DisplayFieldSet.DisplayFields.Clear()

    ' 作成したフィールドをコレクションに追加し表示書式を設定 
    gcname.DisplayFieldSet.DisplayFields.AddRange(New DateDisplayField() { _
            heisei, wareki, yearLiteral, MonthDisplayField, MonthLiteral, _
            DayDisplayField, DayLiteral, maekakko, youbi, atokakko})

    '--------------------------------------------------------------------------
C#
using GrapeCity.Windows.InputMan;
using GrapeCity.Windows.InputMan.Fields;

private void wareki_henkan(GcDateTime gcname) //和暦書式の作成
{
     // 表示フィールドの設定
    DateEraYearDisplayField wareki = new DateEraYearDisplayField();
    DateLiteralDisplayField yearLiteral = new DateLiteralDisplayField("年");
    DateMonthDisplayField MonthDisplayField  = new DateMonthDisplayField(false);
    DateLiteralDisplayField MonthLiteral  = new DateLiteralDisplayField("月");
    DateDayDisplayField DayDisplayField  = new DateDayDisplayField(false);
    DateLiteralDisplayField DayLiteral  = new DateLiteralDisplayField("日");

    DateEraDisplayField heisei = new DateEraDisplayField();
    SolidColorBrush newcolor  = new SolidColorBrush(Color.FromRgb(215, 85, 194));
    heisei.Background = newcolor;
    heisei.Foreground = Brushes.Cornsilk;

    DateWeekdayDisplayField youbi  = new DateWeekdayDisplayField(0);
    youbi.Foreground = Brushes.Blue;
    DateLiteralDisplayField maekakko  = new DateLiteralDisplayField("(");
    DateLiteralDisplayField atokakko  = new DateLiteralDisplayField(")");

    // 表示フィールドをクリア
    gcname.DisplayFieldSet.DisplayFields.Clear();

    // 作成したフィールドをコレクションに追加し表示書式を設定 
    gcname.DisplayFieldSet.DisplayFields.AddRange(new DateDisplayField[] { 
            heisei, wareki, yearLiteral, MonthDisplayField, MonthLiteral, 
            DayDisplayField, DayLiteral, maekakko, youbi, atokakko});

    //--------------------------------------------------------------------------

 入力用書式設定も同様で、各フィールドのオブジェクトを作成し、DateFieldCollectionコレクションに表示する順番に設定していきます。入力書式のフィールドとクラスは下表のようになります。

入力書式のフィールドとクラス
フィールド クラス
リテラル文字 DateLiteralField
月表示フィールド DateMonthField
日表示フィールド DateDayField
年号表示フィールド DateEraField
Visual Basic
    ' 入力フィールドの設定
    Dim ip_heisei As New DateEraField()
    Dim ip_wareki As New DateEraYearField()
    Dim ip_year As New DateLiteralField("年")
    Dim MonthField As New DateMonthField(MonthPattern.Number)
    Dim ip_MonthLiteral As New DateLiteralField("月")
    Dim ip_DayLiteral As New DateDayField()
    Dim ip_Day As New DateLiteralField("日")

    ' 入力フィールドをクリア
    gcname.FieldSet.Fields.Clear()

    ' 作成したフィールドをコレクションに追加し入力書式を設定 
    gcname.FieldSet.Fields.AddRange(New DateField() { _
           ip_heisei, ip_wareki, ip_year, MonthField, _
           ip_MonthLiteral, ip_DayLiteral, ip_Day})
End Sub
C#
    // 入力フィールドの設定
    DateEraField ip_heisei = new DateEraField();
    DateEraYearField ip_wareki = new DateEraYearField();
    DateLiteralField ip_year = new DateLiteralField("年");
    DateMonthField MonthField = new DateMonthField(MonthPattern.Number);
    DateLiteralField ip_MonthLiteral = new DateLiteralField("月");
    DateDayField ip_DayLiteral  = new DateDayField();
    DateLiteralField ip_Day  = new DateLiteralField("日");

    // 入力フィールドをクリア
    gcname.FieldSet.Fields.Clear();

    // 作成したフィールドをコレクションに追加し入力書式を設定 
    gcname.FieldSet.Fields.AddRange(new DateField[] { 
            ip_heisei, ip_wareki, ip_year, MonthField, 
            ip_MonthLiteral, ip_DayLiteral, ip_Day});
}

和暦から西暦への変換処理

 今度は、和暦から西暦への変換処理を作成します。メソッド名は「seireki_henkan」で、引数に「GcDateTime」型の変数を指定します。

 各フィールドオブジェクトの作成は和暦変換と同じで、西暦を設定するオブジェクトだけが違っています。

西暦変換時の各フィールドとクラス
フィールド クラス
表示用西暦フィールド DateYearDisplayField
入力用西暦フィールド DateYearField

 DateYearDisplayFieldクラスのコンストラクタの引数は、先行ゼロ表示を行うかどうかを指定するもので、falseを設定すると先行ゼロ表示を行いません。また、DateYearFieldクラスのコンストラクタの引数はYearDigitType列挙体のメンバで、年号を2ケタ表示か4ケタ表示のどちらで行うかを指定します。

年号の2ケタ/4ケタ表示の指定
メンバ名 説明
FourDigitYear 0 FourDigitYearモードの範囲は0000~9999
TwoDigitYear 1 TwoDigitYearモードの範囲は00~99
Visual Basic
Private Sub seireki_henkan(ByVal gcname As GcDateTime) '西暦書式の作成

    ' 表示フィールドの設定
    Dim seireki As New DateYearDisplayField(False)
    Dim yearLiteral As New DateLiteralDisplayField("年")
    Dim MonthDisplayField As New DateMonthDisplayField(False)
    Dim MonthLiteral As New DateLiteralDisplayField("月")
    Dim DayDisplayField As New DateDayDisplayField(False)
    Dim DayLiteral As New DateLiteralDisplayField("日")

    Dim newcolor As New SolidColorBrush(Color.FromRgb(215, 85, 194))
    seireki.Background = newcolor
    seireki.Foreground = Brushes.Cornsilk

    Dim youbi As New DateWeekdayDisplayField(0)
    youbi.Foreground = Brushes.Blue
    Dim maekakko As New DateLiteralDisplayField("(")
    Dim atokakko As New DateLiteralDisplayField(")")

    ' 表示フィールドをクリア
    gcname.DisplayFieldSet.DisplayFields.Clear()

    ' 作成したフィールドをコレクションに追加し表示書式を設定 
    gcname.DisplayFieldSet.DisplayFields.AddRange(New DateDisplayField() { _
            seireki, yearLiteral, MonthDisplayField, MonthLiteral, _
            DayDisplayField, DayLiteral, maekakko, youbi, atokakko})

    '--------------------------------------------------------------------------

    ' 入力フィールドの設定
    Dim ip_seireki As New DateYearField(YearDigitType.FourDigitYear)
    Dim ip_year As New DateLiteralField("年")
    Dim MonthField As New DateMonthField(MonthPattern.Number)
    Dim ip_MonthLiteral As New DateLiteralField("月")
    Dim ip_DayLiteral As New DateDayField()
    Dim ip_Day As New DateLiteralField("日")

    ' 入力フィールドをクリア
    gcname.FieldSet.Fields.Clear()

    ' 作成したフィールドをコレクションに追加し入力書式を設定 
    gcname.FieldSet.Fields.AddRange(New DateField() { _
            ip_seireki, ip_year, MonthField, _
            ip_MonthLiteral, ip_DayLiteral, ip_Day})
End Sub
C#
private void seireki_henkan(GcDateTime gcname)  //和暦書式の作成
{
    // 表示フィールドの設定
    DateYearDisplayField seireki = new DateYearDisplayField(false);
    DateLiteralDisplayField yearLiteral = new DateLiteralDisplayField("年");
    DateMonthDisplayField MonthDisplayField = new DateMonthDisplayField(false);
    DateLiteralDisplayField MonthLiteral = new DateLiteralDisplayField("月");
    DateDayDisplayField DayDisplayField = new DateDayDisplayField(false);
    DateLiteralDisplayField DayLiteral = new DateLiteralDisplayField("日");

    SolidColorBrush newcolor = new SolidColorBrush(Color.FromRgb(215, 85, 194));
    seireki.Background = newcolor;
    seireki.Foreground = Brushes.Cornsilk;

    DateWeekdayDisplayField youbi = new DateWeekdayDisplayField(0);
    youbi.Foreground = Brushes.Blue;
    DateLiteralDisplayField maekakko = new DateLiteralDisplayField("(");
    DateLiteralDisplayField atokakko = new DateLiteralDisplayField(")");

    // 表示フィールドをクリア
    gcname.DisplayFieldSet.DisplayFields.Clear();

    // 作成したフィールドをコレクションに追加し表示書式を設定 
    gcname.DisplayFieldSet.DisplayFields.AddRange(new DateDisplayField[] { 
            seireki, yearLiteral, MonthDisplayField, MonthLiteral, 
            DayDisplayField, DayLiteral, maekakko, youbi, atokakko});

    //--------------------------------------------------------------------------

    // 入力フィールドの設定
    DateYearField ip_seireki = new DateYearField(YearDigitType.FourDigitYear);
    DateLiteralField ip_year = new DateLiteralField("年");
    DateMonthField MonthField = new DateMonthField(MonthPattern.Number);
    DateLiteralField ip_MonthLiteral = new DateLiteralField("月");
    DateDayField ip_DayLiteral = new DateDayField();
    DateLiteralField ip_Day = new DateLiteralField("日");

    // 入力フィールドをクリア
    gcname.FieldSet.Fields.Clear();

    // 作成したフィールドをコレクションに追加し入力書式を設定 
    gcname.FieldSet.Fields.AddRange(new DateField[] { 
            ip_seireki, ip_year, MonthField, 
            ip_MonthLiteral, ip_DayLiteral, ip_Day});
}

 また、西暦、和暦に変換する書式を設定する場合、上記のようにフィールドオブジェクトを作成するという方法以外にも、以下のようにキーワードを使用して作成することも可能です。

キーワードを使用した作成方法(Visual Basic)
Private Sub wareki_henkan(ByVal gcname As GcDateTime)
    ' 表示フィールドの設定
    gcname.DisplayFieldSet.DisplayFields.Clear()
    gcname.DisplayFieldSet.DisplayFields.AddRange("ggg e年MM月dd日")

    ' 年号フィールドの色を設定
    gcname.DisplayFieldSet.DisplayFields(0).Foreground = Brushes.Cornsilk
    Dim newcolor As New SolidColorBrush(Color.FromRgb(215, 85, 194))
    gcname.DisplayFieldSet.DisplayFields(0).Background = newcolor


'--------------------------------------------------------------------------
    ' 入力フィールドの設定
    gcname.FieldSet.Fields.Clear()
    gcname.FieldSet.Fields.AddRange("ggg e年MM月dd日")
End Sub

和暦・西暦の切り替え処理

 作成したメソッドを、CheckBoxコントロールのチェックのオンオフで呼び出します。

 CheckBoxコントロールのチェックがオンになると、CheckBox1_Checkedイベントハンドラが呼び出されるので、ここで和暦→西暦変換処理を実行します。引数に、それぞれのGcDateTimeコントロールを指定し、メソッドwareki_henkanを呼び出します。

 また、GcDateTimeコントロールの背景色を設定します。

Visual Basic
Private Sub CheckBox1_Checked(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles CheckBox1.Checked
    wareki_henkan(GcDateTime1)
    GcDateTime1.Background = Brushes.Lavender

    wareki_henkan(GcDateTime2)
    GcDateTime2.Background = Brushes.Beige

    wareki_henkan(GcDateTime3)
    GcDateTime3.Background = Brushes.PeachPuff
End Sub
C#
private void CheckBox1_Checked(object sender, RoutedEventArgs e)
{
    wareki_henkan(GcDateTime1);
    GcDateTime1.Background = Brushes.Lavender;

    wareki_henkan(GcDateTime2);
    GcDateTime2.Background = Brushes.Beige;

    wareki_henkan(GcDateTime3);
    GcDateTime3.Background = Brushes.PeachPuff;
}

 CheckBoxコントロールのチェックがオフになったときは、CheckBox1_Uncheckedイベントハンドラが呼び出されますから、それぞれのGcDateTimeコントロールを指定しメソッドseireki_henkanを呼び出します。

Visual Basic
Private Sub CheckBox1_Unchecked(ByVal sender As Object, ByVal e As System.Windows.RoutedEventArgs) Handles CheckBox1.Unchecked
    seireki_henkan(GcDateTime1)
    seireki_henkan(GcDateTime2)
    seireki_henkan(GcDateTime3)
End Sub
C#
private void CheckBox1_Unchecked(object sender, RoutedEventArgs e)
{
    seireki_henkan(GcDateTime1);
    seireki_henkan(GcDateTime2);
    seireki_henkan(GcDateTime3);
}

まとめ

 GcDateTimeコントロールは、和暦表示が行えるのが大きな特徴で、各フィールドの外観をデザインできるのもWPFアプリケーションのUIを装飾するのに大きく貢献しています。

 たとえ日付入力であっても、ユーザーにフレンドリーなUIであれば積極的に導入していきたいですね。

参考文献

  • ブックマーク
  • LINEで送る
  • このエントリーをはてなブックマークに追加

著者プロフィール

  • 瀬戸 遥(セト ハルカ)

    8ビットコンピュータの時代からBASICを使い、C言語を独習で学びWindows 3.1のフリーソフトを作成、NiftyServeのフォーラムなどで配布。Excel VBAとVisual Basic関連の解説書を中心に現在まで40冊以上の書籍を出版。近著に、「ExcelユーザーのためのAccess再...

All contents copyright © 2005-2019 Shoeisha Co., Ltd. All rights reserved. ver.1.5