GcTimeSpanコントロールのデザイン
では、実際にGcTimeSpanコントロールをデザインします。
入力書式の設定
このプログラムでは、時間の表示形式を「hh:mm:ss」形式にし、時・分・秒の区切りに「時間」「分」「秒」という文字を使用することにします。
設定は「入力書式の設定」から行います。GcTimeSpanコントロールのスマートタグから［入力書式の設定］を選択し、［hh時間mm分ss秒］を選びます。この書式を選ぶと、「プレビュー」にあるように入力位置には「_」というリテラル文字がデフォルトで設定されます。
スマートタグから［入力書式の設定］を選ぶ
［hh時間mm分ss秒］を選ぶ
表示のデザイン
時間データはフォントをArial Blackにし、サイズを48と大きくします。また、各データの文字色と背景色も変更し、「時間・分・秒」というリテラル文字の上下位置も変更します。これらの設定は、GcTimeSpanコントロールのスマートタグから［入力フィールドの編集］を選ぶと表示される、ダイアログで行います。
「TimeSpanHourField」は時のデータを表示するフィールドで、同様に「TimeSpanMinuteField」は分のデータを、「TimeSpanSecondField」は秒のデータを表示するオブジェクトです。
また、「TimeSpanLiteralField」はそれぞれのデータを区切るリテラル文字を表すオブジェクトです。
- TimeSpanSignField （符号入力フィールド）
- TimeSpanDayField （日入力フィールド）
- TimeSpanHourField （時間入力フィールド）
- TimeSpanMinuteField （分入力フィールド）
- TimeSpanSecondField （秒入力フィールド）
- TimeSpanDecimalField （少数入力フィールド）
- TimeSpanLiteralField （リテラル文字フィールド）
ダイアログでは、プロパティを設定するオブジェクトを選択し、プロパティウィンドウで各プロパティを設定します。
各フィールドオブジェクトに共通のプロパティは、次のものがあります。
| プロパティ | 説明 |
|---|---|
| BackColor | フィールド背景色を設定します。 |
| Font | フィールドに表示される文字列のフォントを設定します。 |
| ForeColor | フィールド背景色を設定します。 |
| Margin | フィールド領域の外枠の距離を設定します。コントロールの境界線からの距離や、他のフィールドとの間隔を設定する際に使用します。 |
| Padding | フィールド領域からテキストの表示エリアまでの距離を設定します。 |
今回は、次のようにプロパティを設定します。
| オブジェクト | プロパティ | 設定値 |
|---|---|---|
| TimeSpanHourField | BackColor | MediumPurple |
| Font | Arial Black, 30pt, style=Bold | |
| ForeColor | LightGoldenrodYellow | |
| TimeSpanMinuteField | BackColor | MediumPurple |
| Font | Arial Black, 30pt, style=Bold | |
| ForeColor | LightGoldenrodYellow | |
| TimeSpanSecondField | BackColor | MediumPurple |
| Font | Arial Black, 30pt, style=Bold | |
| ForeColor | LightGoldenrodYellow | |
| - | - | - |
| TimeSpanLiteralField | Margin | 3, 0, 0, 0 |
| （3つとも） | Padding | 0, 40, 0, 0 |
完成した入力フィールドのデザイン
