Webページのデザイン
では、さっそくアプリケーションを作成していきましょう。作成するアプリケーションは、データグリッドと2つの直線ゲージを持ったWebページです。
ゲージはあらかじめダミーのデータで作成しておき、アプリケーション実行時にグリッドデータを読み込んでゲージの各設定を行います。
ページのレイアウト
使用するコントロールは、C1LinearGauge、C1GridView、Labelコントロールの各コントロールです。AccessDataSourceオブジェクトは、C1GridViewコントロールにデータベースデータを連結すると作成されます。
データグリッドの作成
最初にAccessデータベースのデータを表示するグリッドを作成します。
プロジェクトのApp_Dataフォルダにデータベース「在庫管理.mdb」を格納しておきます。「在庫管理.mdb」はテーブルを1つだけ持つ簡単なデータベースで、「品名」「最大在庫数」「最少在庫数」「現在庫数」の4つのフィールドを持っています。このデータの「最大在庫数」「最少在庫数」でレンジを作成し、「現在庫数」がどの位置にあるのかを表示することで、適正な在庫数なのか、在庫数が少ないのか、在庫過多なのかが一目で分かるようにします。
① ツールボックスからC1GridViewコントロールをドラッグ＆ドロップします。スマートタグからタスクトレイを開き、「データソースの選択」メニューで「新しいデータソース」を選びます。
② 「データソース構成ウィザード」が表示されますので、「Accessデータベース」をクリックします。「データソースにIDを指定します」欄に「AccessDataSource1」と入力されていますので、そのまま「OK」ボタンをクリックします。
③ 「参照」ボタンをクリックし、プロジェクトの「App_Data」フォルダに追加した「在庫管理.mdb」を選んで、OKボタンをクリック。「次へ」ボタンをクリックします。
