時刻コントロールに使用できる時刻書式の設定と活用について解説します。
概要の説明
時刻コントロールの書式は、Formatプロパティが参照するTimeFormatオブジェクトとDisplayFormatプロパティが参照するTimeDisplayFormatオブジェクトを使って設定します。これらのオブジェクトのPatternプロパティにキーワードを設定することで、書式を作成します。
なお、ShowLiteralsプロパティを使えば、入力中にリテラル文字列を表示するかどうかを指定できます。
Hour12ModeプロパティをHour12Mode.Hour12As0に設定すると、表示範囲を 「00:00:00 〜 11:59:59」にし、Hour12Mode.Hour0As12にすると、表示範囲を 「01:00:00 〜 12:59:59」 にします。
また、MidnightAs24プロパティをTrueに設定すると、真夜中（深夜0時）を「24時」として表示し、Falseにすると、真夜中（深夜0時）を「0時」として表示することができます。
1.リテラル文字列
時刻コントロールには、キーワード以外の文字列をリテラル文字列として表示させることができます。ただし、リテラル文字列のみをFormatプロパティまたはDisplayFormatプロパティに設定することはできません。また、キーワードをリテラル文字として表示させるには、キーワードの前に円記号（\、Chr(92)）を付けます。円記号を表示させる場合は \\ とします。なお、ShowLiteralsプロパティを使えば、入力中にリテラル文字列を表示するかどうかを指定できます。
2. フィールド
時刻コントロールのフィールドには、次の４種類があります。どのフィールドが表示されるかは、書式の定義に依存します。なお、リテラル文字列の領域は、フィールドとは解釈されません。- 午前／午後
- 時
- 分
- 秒
3. 時刻の基点
時刻コントロールでは、時刻を表示するときの基点をHour12ModeプロパティとMidnightAs24プロパティで設定することができます。Hour12ModeプロパティをHour12Mode.Hour12As0に設定すると、表示範囲を 「00:00:00 〜 11:59:59」にし、Hour12Mode.Hour0As12にすると、表示範囲を 「01:00:00 〜 12:59:59」 にします。
また、MidnightAs24プロパティをTrueに設定すると、真夜中（深夜0時）を「24時」として表示し、Falseにすると、真夜中（深夜0時）を「0時」として表示することができます。
入力書式
時刻コントロールの入力書式は、Formatプロパティが参照するTimeFormatオブジェクトを使って設定します。このオブジェクトのPatternプロパティにキーワードとリテラル文字列を設定することで、入力書式を作成します。 Patternプロパティでは、以下のキーワードが使えます。
午前または午後を表す文字列をキーボードから入力するには、以下のキーを押下します。
自由書式入力に設定した場合は、次の各プロパティが無効になります。
時刻に関するキーワード
| キーワード | 説明 |
|---|---|
| t | 12時間制で時刻を表示するときに午前（AMDesignatorプロパティで設定）または午後（PMDesignatorプロパティで設定）を表す文字列の最初の１文字を表示 |
| tt | 12時間制で時刻を表示するときに午前（AMDesignatorプロパティで設定）または午後（PMDesignatorプロパティで設定）を表す文字列を表示 |
| hh | 時を12時間制で表示（先頭に0を付ける） |
| HH | 時を24時間制で表示（先頭に0を付ける） |
| mm | 分を表示（先頭に0を付ける） |
| ss | 秒を表示（先頭に0を付ける） |
| \（Chr(92)） | キーワードをリテラル文字として表示 |
午前または午後を表す文字列をキーボードから入力するには、以下のキーを押下します。
| 区分 | 午前 | 午後 |
|---|---|---|
| 数値入力 | 1 | 2 |
| 文字入力 | a | p |
自由書式入力
TimeFormatオブジェクトのPatternプロパティに空の文字列（""またはString.Empty）を設定すると、自由書式入力が可能になります。自由書式入力では、時刻に変換可能なあらゆる値を受けつけますが、無効な文字が入力されてもInvalidInputクライアントイベントは発生しません。自由書式入力に設定した場合は、次の各プロパティが無効になります。
 |
自由書式入力で時刻に変換可能な値は、JavaScriptにおけるDateオブジェクトの |
表示書式
時刻コントロールの表示書式は、DisplayFormatプロパティが参照するTimeDisplayFormatオブジェクトを使って設定します。このオブジェクトのPatternプロパティにキーワードとリテラル文字列を設定することで、表示書式を作成します。Patternプロパティでは、以下のキーワードが使えます。
時刻に関するキーワード
| キーワード | 説明 |
|---|---|
| t | 12時間制で時刻を表示するときに午前（AMDesignatorプロパティで設定）または午後（PMDesignatorプロパティで設定）を表す文字列の最初の１文字を表示 |
| tt | 12時間制で時刻を表示するときに午前（AMDesignatorプロパティで設定）または午後（PMDesignatorプロパティで設定）を表す文字列を表示 |
| h | 時を12時間制で表示（先頭に0を付けない） |
| hh | 時を12時間制で表示（先頭に0を付ける） |
| H | 時を24時間制で表示（先頭に0を付けない） |
| HH | 時を24時間制で表示（先頭に0を付ける） |
| m | 分を表示（先頭に0を付けない） |
| mm | 分を表示（先頭に0を付ける） |
| s | 秒を表示（先頭に0を付けない） |
| ss | 秒を表示（先頭に0を付ける） |
| \（Chr(92)） | キーワードをリテラル文字として表示 |
サンプルコード
次のサンプルコードは、FormatプロパティとDisplayFormatプロパティを使って時刻を入力するための書式を設定する方法を示します。
次のサンプルコードは、上記と同じ設定をTimeFormatオブジェクトとTimeDisplayFormatオブジェクトを明示的に生成することで行います。
' 時刻の入力書式を設定します。 GcTime1.Format.Pattern = "tt hh時 mm分" ' 時刻の表示書式を設定します。 GcTime1.DisplayFormat.Pattern = "tt h時 mm分" ' 午前、午後の表示文字を設定します。 GcTime1.AMDesignator = "午前" GcTime1.PMDesignator = "午後"
// 時刻の入力書式を設定します。 GcTime1.Format.Pattern = "tt hh時 mm分"; // 時刻の表示書式を設定します。 GcTime1.DisplayFormat.Pattern = "tt h時 mm分"; // 午前、午後の表示文字を設定します。 GcTime1.AMDesignator = "午前"; GcTime1.PMDesignator = "午後";
次のサンプルコードは、上記と同じ設定をTimeFormatオブジェクトとTimeDisplayFormatオブジェクトを明示的に生成することで行います。
Imports GrapeCity.Web.Input.IMDate ' 時刻の入力書式を設定します。 GcTime1.Format = New TimeFormat("tt hh時 mm分") ' 時刻の表示書式を設定します。 GcTime1.DisplayFormat = New TimeDisplayFormat("tt h時 mm分") ' 午前、午後の表示文字を設定します。 GcTime1.AMDesignator = "午前" GcTime1.PMDesignator = "午後"
using GrapeCity.Web.Input.IMDate; // 時刻の入力書式を設定します。 GcTime1.Format = new TimeFormat("tt hh時 mm分"); // 時刻の表示書式を設定します。 GcTime1.DisplayFormat = new TimeDisplayFormat("tt h時 mm分"); // 午前、午後の表示文字を設定します。 GcTime1.AMDesignator = "午前"; GcTime1.PMDesignator = "午後";
関連トピック