CodeZine(コードジン)

特集ページ一覧

業務アプリ開発で要求される複雑なカレンダー画面を、C#やVBで簡単に実装する

CalendarGrid for Windows Formsを活用したWindowsフォームアプリケーションの作成

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

GUIの作成

 実際にカレンダーを作成してみましょう。作成するカレンダーは、外出交通費精算を行うカレンダーコントロールです。

 表示は週単位で、4つの入力用セルと1つのボタン、ページングと「今日へ移動」ボタン、タイトルヘッダー・フッターを持ちます。

 そして、「精算」ボタンをクリックするとメッセージボックスを表示します。

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

GcCalendarGridコントロールの作成

 では、GcCalendarGridコントロールを作成していきます。

 (1)ツールボックスからフォームにGcCalendarGridコントロールをドラッグ&ドロップします。

 デフォルトでは月単位のカレンダーになっています。

フォームにGcCalendarGridコントロールをドラッグ&ドロップ
フォームにGcCalendarGridコントロールをドラッグ&ドロップ

 (2)DockプロパティをFillに設定します。

フォーム全体にGcCalendarGridコントロールを配置する
フォーム全体にGcCalendarGridコントロールを配置する

 (3)このままでも十分使用できますが、まずは週単位の表示に切り替えます。GcCalendarGridコントロールのタスクトレイの「表示形式」から「WeekView」を選びます。カレンダーが週表示に代わります。

タスクトレイの「表示形式」から「WeekView」を選ぶ
タスクトレイの「表示形式」から「WeekView」を選ぶ
カレンダーが週表示に代わる
カレンダーが週表示に代わる

 (4)今度はセルをカスタマイズしていきます。まず、スマートタグから「フラットスタイル」を「Popup」に変更します。

スマートタグから「フラットスタイル」を「Popup」に変更
スマートタグから「フラットスタイル」を「Popup」に変更

 (5)次に、スマートタグから「デザイナ」をクリックすると、デザイナが表示されます。

スマートタグから「デザイナ」をクリック
スマートタグから「デザイナ」をクリック

 (6)デザイナでは、編集したいセルをクリックし1セルずつ設定します。最初は曜日を表示しているセルをクリックして、「CellStyle」プロパティを展開し、以下のプロパティを設定します。

プロパティ設定値
AlignmentMiddleLeft
BackColorMistyRose
文字が左揃えで背景色が薄いピンクに変更
文字が左揃えで背景色が薄いピンクに変更

 (7)次に日にちが表示されているセル(A2のセル)をクリックし、BackColorを薄い水色に変えます。

 (8)その下の空白のセル(A3のセル)の上でコンテキストメニューを表示して、「挿入」-「下に行を挿入」選択し、行を追加します。同じ操作を繰り返しセルを2行追加します。

「挿入」-「下に行を挿入」メニューを選択
「挿入」-「下に行を挿入」メニューを選択

 (9)「先負」と表示されているセル(A5のセル)をクリックし、「CellType」プロパティのリストから「ButtonCellType」をクリックします。

 そして、「CellType」プロパティを展開し、「DateFormat」の「{Rokuyou}」を削除し、以下のプロパティを設定します。

プロパティ設定値
Value精算
CellStyleAlignmentMiddleLeft

 これで、ボタン型のセルに設定できます。

ボタン型のセルになる
ボタン型のセルになる

 (10)空白のセルをマウスでドラッグして選択し、「CellType」-「BackColor」プロパティを「LightYellow」に変更します。そして、「CellType」プロパティを「GcNumberCellType」に変更します。

「CellType」プロパティを「GcNumberCellType」に変更
「CellType」プロパティを「GcNumberCellType」に変更

 (11)最後にセルの右側にある境界線をドラッグし、セルの列幅を「120」に広げます。

セルの列幅を「120」に設定
セルの列幅を「120」に設定

 (12)これまでの設定をGcCalendarGridコントロールに反映させます。デザイナの「ファイル」-「適用して終了」メニューを選択します。フォームデザイナに戻ると、セルの設定が反映されています。

デザイナの「ファイル」-「適用して終了」メニューを選択
デザイナの「ファイル」-「適用して終了」メニューを選択
セルの設定が反映されている
セルの設定が反映されている

 (13)今度はタイトルヘッダーを追加します。ヘッダー部にある「追加」-「CalendarTitleCaption」ボタンをクリックします。

「追加」-「CalendarTitleCaption」ボタンをクリック
「追加」-「CalendarTitleCaption」ボタンをクリック

 日付がもう一つ追加されますので、この日付をクリックしてプロパティウィンドウの「Text」プロパティの値を「{0}」から「外出交通費精算」に変更します。これで、「外出交通費精算」というタイトル文字が追加されます。

「外出交通費精算」というタイトル文字が追加
「外出交通費精算」というタイトル文字が追加

 (14)フッターにある「追加」-「CalendarTitleLabel」をクリックして、タイトルフッターにラベルを追加します。クリックし、Textプロパティを「内容を確認後、精算ボタンを押してください」に変更します。

フッターにある「追加」-「CalendarTitleLabel」をクリック
フッターにある「追加」-「CalendarTitleLabel」をクリック
Textプロパティを変更
Textプロパティを変更

 (15)以上でGcCalendarGridコントロールの設定は終了です。

 アプリケーションを実行します。空白セルの↓ボタンをクリックすると電卓が表示され、数値を入力することができます。

Textプロパティを変更
Textプロパティを変更

「精算」ボタンがクリックされた時の処理

 フォームデザイナで「精算」ボタンをダブルクリックすると、CellClickイベントハンドラが作成されますので、ここに処理を記述します。

 まず、イベント発生のハンドラeから「CellPosition」プロパティでイベントが発生したセルの位置を特定します。

 そして、「RowIndex」プロパティでボタン型セルの行番号を取得し、このボタンが押されたときのみ処理を実行するようにします。

Visual Basic
Public Class Form1

    Private Sub GcCalendarGrid1_CellClick(sender As System.Object, e As GrapeCity.Win.CalendarGrid.CalendarCellEventArgs) Handles GcCalendarGrid1.CellClick
        Dim ret As DialogResult

        If e.CellPosition.RowIndex = 5 Then
            ret = MessageBox.Show("この金額で申請します。よろしいですか?", "確認", MessageBoxButtons.OKCancel, MessageBoxIcon.Question)
        End If
    End Sub
End Class
C#
namespace CalendarGrid_Winform_cs
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }

        private void gcCalendarGrid1_CellClick(object sender, GrapeCity.Win.CalendarGrid.CalendarCellEventArgs e)
        {
            DialogResult ret;
            if (e.CellPosition.RowIndex == 5)
            {
                ret = MessageBox.Show("この金額で申請します。よろしいですか?", "確認", MessageBoxButtons.OKCancel, MessageBoxIcon.Question);
            }
        }
    }
}

 以上で完成です。

まとめ

 多彩なデザインを可能にするGcCalendarGridコントロールは、アプリケーションに実装したい機能に沿って、自由度の高いカレンダーを作ることができるコントロールです。レイアウトや各種セルの設定はデザイナを操作して直観的に行えます。



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

バックナンバー

連載:ComponentZine(CalendarGrid)

著者プロフィール

  • 瀬戸 遥(セト ハルカ)

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

あなたにオススメ

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