入力時の書式を設定する入力フィールドには、次の7種類のフィールドが提供されており、これらのフィールドオブジェクトを使って書式を設定することができます。

• TimeSpanLiteralField （リテラル文字フィールド）
• TimeSpanSignField （符号入力フィールド）
• TimeSpanDayField （日入力フィールド）
• TimeSpanHourField （時間入力フィールド）
• TimeSpanMinuteField （分入力フィールド）
• TimeSpanSecondField （秒入力フィールド）
• TimeSpanDecimalField （小数入力フィールド）

また、表示フィールドでは、次の7種類のフィールドが提供されています。

• TimeSpanLiteralDisplayField （リテラル文字フィールド）
• TimeSpanSignDisplayField （符号表示フィールド）
• TimeSpanDayDisplayField （日表示フィールド）
• TimeSpanHourDisplayField （時間表示フィールド）
• TimeSpanMinuteDisplayField （分表示フィールド）
• TimeSpanSecondDisplayField （秒表示フィールド）
• TimeSpanDecimalDisplaylField （小数表示フィールド）

これらのフィールドオブジェクトをTimeSpanFieldCollection または、TimeSpanDisplayFieldCollection コレクションに追加することでタイムスパンの書式を作成します。

タイムスパンの書式は、入力および表示用の各フィールドコレクションに、前項で解説したフィールドオブジェクトを組み合わせて作成します。

コードによる設定

入力書式を設定するには、Add またはAddRange メソッドを使用して、TimeSpanFieldCollection コレクションに入力用フィールドオブジェクトを追加します。表示書式は、Add またはAddRange メソッドを使用して、表示用フィールドオブジェクトをTimeSpanDisplayFieldCollection コレクションに追加します。

次のサンプルコードは、タイムスパンコントロールに入力および表示書式を設定する例です。

Imports GrapeCity.Win.Editors.Fields

' フィールドをクリアします。
GcTimeSpan1.Fields.Clear()
GcTimeSpan1.DisplayFields.Clear()

' 入力フィールドのオブジェクトを作成します。
Dim TimeSpanHourField1 As New TimeSpanHourField(2)
Dim TimeSpanLiteralField1 As New TimeSpanLiteralField(":")
Dim TimeSpanMinuteField1 As New TimeSpanMinuteField(2)

' フィールドをコレクションに追加してコントロールに入力書式を設定します。
GcTimeSpan1.Fields.AddRange(New TimeSpanField() { _
    TimeSpanHourField1, TimeSpanLiteralField1, TimeSpanMinuteField1})

' 表示フィールドのオブジェクトを作成します。
Dim TimeSpanHourDisplayField1 As New TimeSpanHourDisplayField()
Dim TimeSpanLiteralDisplayField1 As New TimeSpanLiteralDisplayField("時間")
Dim TimeSpanMinuteDisplayField1 As New TimeSpanMinuteDisplayField()
Dim TimeSpanLiteralDisplayField2 As New TimeSpanLiteralDisplayField("分")

' フィールドをコレクションに追加してコントロールに表示書式を設定します。
GcTimeSpan1.DisplayFields.AddRange(New TimeSpanDisplayField() { _
    TimeSpanHourDisplayField1, TimeSpanLiteralDisplayField1, _
    TimeSpanMinuteDisplayField1, TimeSpanLiteralDisplayField2})

using GrapeCity.Win.Editors.Fields;

// フィールドをクリアします。
gcTimeSpan1.Fields.Clear();
gcTimeSpan1.DisplayFields.Clear();

// 入力フィールドのオブジェクトを作成します。
TimeSpanHourField timeSpanHourField1 = new TimeSpanHourField(2);
TimeSpanLiteralField timeSpanLiteralField1 = new TimeSpanLiteralField(":");
TimeSpanMinuteField timeSpanMinuteField1 = new TimeSpanMinuteField(2);

// フィールドをコレクションに追加してコントロールに入力書式を設定します。
gcTimeSpan1.Fields.AddRange(new TimeSpanField[] {
    timeSpanHourField1, timeSpanLiteralField1,  timeSpanMinuteField1});

// 表示フィールドのオブジェクトを作成します。
TimeSpanHourDisplayField timeSpanHourDisplayField1 = new TimeSpanHourDisplayField();
TimeSpanLiteralDisplayField timeSpanLiteralDisplayField1 = new TimeSpanLiteralDisplayField("時間");
TimeSpanMinuteDisplayField timeSpanMinuteDisplayField1 = new TimeSpanMinuteDisplayField();
TimeSpanLiteralDisplayField timeSpanLiteralDisplayField2 = new TimeSpanLiteralDisplayField("分");

// フィールドをコレクションに追加してコントロールに表示書式を設定します。
gcTimeSpan1.DisplayFields.AddRange(new TimeSpanDisplayField[] {
    timeSpanHourDisplayField1, timeSpanLiteralDisplayField1,
    timeSpanMinuteDisplayField1, timeSpanLiteralDisplayField2});

　　　
(図) 上記サンプルコードを適用したコントロール

フィールドオブジェクトをTimeSpanFieldCollection または TimeSpanDisplayFieldCollection コレクションから削除するには、Remove メソッドまたは、RemoveAt メソッドを使用します。

次のサンプルコードは、TimeSpanFieldCollection コレクションの先頭のフィールドを削除する例です。

' コレクションの先頭のオブジェクトを削除します。
GcTimeSpan1.Fields.RemoveAt(0)

// コレクションの先頭のオブジェクトを削除します。
gcTimeSpan1.Fields.RemoveAt(0);

デザイン画面での設定

デザイン画面ではフィールドオブジェクトを設定できる「入力フィールドの編集」「表示フィールドの編集」エディタから容易な設定が可能です。 このエディタは次のいずれかの方法で起動でき、タイムスパンコントロールで設定可能なフィールドを組み合わせて設定します。

• プロパティページの「書式設定」-「入力フィールド」を選択
• コントロールのスマート タグから「入力フィールドの編集...」を選択
• プロパティウィンドウのFields プロパティをアクティブにした時に表示される「…」ボタンを押下

• プロパティページの「書式設定」-「表示フィールド」を選択
• コントロールのスマート タグから「表示フィールドの編集...」を選択
• プロパティウィンドウのDisplayFields プロパティをアクティブした時に表示される「…」ボタンを押下

「入力フィールドの編集」エディタ

このエディタでは、コレクションにフィールドを追加や編集すると同時に各フィールドのテキストのフォントや色といったスタイルを設定することができます。

（図）フィールド毎に異なったスタイルを設定

ここでは、タイムスパンコントロールの入力フィールドに設定可能な7種類のフィールドについて、すべてのフィールドに共通な設定項目と各フィールドに特化した設定項目にわけて解説します。

すべてのフィールドクラスに共通な設定

これらのプロパティは、タイムスパンコントロールのすべての入力フィールドオブジェクトに共通な設定項目です。

リテラル文字フィールド(TimeSpanLiteralField)

リテラル文字フィールド（TimeSpanLiteralField クラス）は、コントロールに表示するリテラル文字を設定します。

符号入力フィールド (TimeSpanSignField)

符号入力フィールド（TimeSpanSignField クラス）は、符号を入力するフィールドです。

日入力フィールド(TimeSpanDayField)

日入力フィールド（TimeSpanDayField クラス）は、日数を入力するフィールドです。

時間入力フィールド(TimeSpanHourField)

時間入力フィールド（TimeSpanHourField クラス）は、時間を入力するフィールドです。

分入力フィールド(TimeSpanMinuteField)

分入力フィールド（TimeSpanMinuteField クラス）は、分数を入力するフィールドです。

秒入力フィールド(TimeSpanSecondField)

秒入力フィールド（TimeSpanSecondField クラス）は、秒数を入力するフィールドです。

小数入力フィールド(TimeSpanDecimalField)

小数入力フィールド（TimeSpanDecimalField  クラス）は、小数を入力するフィールドです。

ここでは、タイムスパンコントロールの表示フィールドに設定可能な7種類のフィールドについて、すべてのフィールドに共通な設定項目と各フィールドに特化した設定項目にわけて解説します。

すべてのフィールドクラスに共通な設定

これらのプロパティは、タイムスパンコントロールのすべての表示フィールドオブジェクトに共通な設定項目です。

リテラル文字フィールド(TimeSpanLiteralDisplayField)

リテラル文字表示フィールド（TimeSpanLiteralDisplayField クラス）は、コントロールに表示するリテラル文字を設定します。

符号表示フィールド(TimeSpanSignDisplayField)

符号表示フィールド（TimeSpanSignDisplayField クラス）は、符号を表示するフィールドです。

日表示フィールド(TimeSpanDayDisplayField)

日表示フィールド（TimeSpanDayDisplayField クラス）は、日数を表示するフィールドです。

時間表示フィールド(TimeSpanHourDisplayField)

時間表示フィールド（TimeSpanHourDisplayField クラス）は、時間を表示するフィールドです。

分表示フィールド(TimeSpanMinuteDisplayField)

分表示フィールド（TimeSpanMinuteDisplayField クラス）は、分数を表示するフィールドです。

秒表示フィールド(TimeSpanSecondDisplayField)

秒表示フィールド（TimeSpanSecondDisplayField クラス）は、秒数を表示するフィールドです。

小数表示フィールド(TimeSpanDecimalDisplaylField)

小数表示フィールド（TimeSpanDecimalDisplaylField クラス）は、小数を表示するフィールドです。