SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

ComponentZine(MultiRow)

Accessデータを表示させるWebページを自由なレイアウトで作る

MultiRow for ASP.NET 1.0Jを使ったAccessデータを表示するアプリケーションの作成

  • X ポスト
  • このエントリーをはてなブックマークに追加

セルの装飾

 続いて、セルを装飾していくことで、MultiRowを綺麗にデザインしていきます。

 RowHeaderCellとTextBoxCellの設定が終わったら、TextBoxCellのフィールドの種類ごとにCtrlキーを押しながらクリックし、プロパティウィンドウのCellStyleプロパティの「BackColor」で背景色を設定します。

 また、ツールバーにある「罫線」ボタンを押し、セルの四方に罫線を設定します。罫線の設定は、まず線の色を選び次に設定したい場所のボタンを押していきます。なお、「スタイル」を使うと、3D表示などの装飾を施すことができます。

ツールバーにある「罫線」ボタン
ツールバーにある「罫線」ボタン
線の色を選び次に設定したい場所のボタンを押す
線の色を選び次に設定したい場所のボタンを押す

 次に、RowHeaderCellとTextBoxCellのサイズを入力文字列に合わせて広げます。

 また、Headerセクションに、LabelCellを配置し、見出し文字を設定します。LabelCell(ラベル型セル)は、ASP.NET標準のLabelコントロールが持つ機能を、MultiRow for ASP.NET用に最適化したセル型で、テキストの表示を行います。

 デザインが完成したら、ツールバーにある[適用して終了]ボタンをクリックします。これで、デザイナでの編集内容がMultiRowコンポーネントに反映されます。

ツールバーにある「適用して終了」ボタンをクリック
ツールバーにある「適用して終了」ボタンをクリック

 Visual Studioに戻り、ここで一度プロジェクトを実行してみましょう。各TextBoxCellにデータが表示され、スクロールバーを移動させるとレコードデータが順番に表示されていればOKです。

ここまでの完成画面
ここまでの完成画面

ページングの設定

 Accessデータを表示させることができましたが、現時点では1ページにすべてのレコードが表示される状態になっています。せっかくなので、ページング機能を設定して1ページに1レコードを表示し、ボタンでレコードを移動するようにします。

  1. スマートタグからタスクトレイを開き、[ページングを有効にする]をクリックします。
    [ページングを有効にする]をクリック
    [ページングを有効にする]をクリック
  2. プロパティウィンドウで「PageSize」プロパティを「1」にします。これで、1ページ1レコードの表示に設定され、MultiRowコンポーネントにはページ移動のボタンが付加されます。
  3. ついでに、スクロールバーも非表示にしておきます。プロパティウィンドウで「ScrollBar」プロパティの値を「Both」から「None」に変えます。これで、カード型データベースのように1レコードずつデータを表示させることができます。
    できあがったMultiRowコンポーネント
    できあがったMultiRowコンポーネント

 後は、ページを飾ってできあがりです。

※注3 ページング機能について

 ページング機能を有効にするには、MultiRowクラスのAllowPagingプロパティをTrueに設定します。タスクトレイの[ページングを有効にする]は、このプロパティを設定するもので、Trueでコントロールのページング機能が有効になります。なお、PageIndexプロパティで制御されるページのインデックス値は「0」から始まりますが、ページャーボタンに表示されるページ番号は「1」から始まります。

 ページの移動は、ページャーバーのページャーボタンか、ツールバーのページ移動ツールボタンをクリックすることで行われます。グリッドがPageSizeプロパティで設定した値以上の行数を保持し、ページが複数となると、ツールバーの各ページ移動ボタンが有効になり、またページャーバーにページャーボタンが表示されます。

まとめ

 MultiRowコンポーネントは、お決まりの行列型グリッドではなく、セル型のコントロールをコンポーネント内に自在に配置でき、個々のセルのサイズやデザインが設定できるので、Windowsフォームと同じように自由なレイアウトが実現できます。さらに、データベースと連結したデータ表示が行えるので、アップロードの開発がとても楽になります。

 本記事ではデータの表示のみ紹介しましたが、新規入力や更新などもセルへの入力をそのままデータベースに反映でき、一切コードを書かずに行えるので、かなり使い勝手の良いコンポーネントになっています。

 帳票形式の画面や、受注画面などを好きなレイアウトでデザインしてデータベースとのインターフェースをWebページで作成したいとお考えの方には、かなりお勧めのコンポーネントと言えます。

参考資料

製品情報

この記事は参考になりましたか?

  • X ポスト
  • このエントリーをはてなブックマークに追加
ComponentZine(MultiRow)連載記事一覧

もっと読む

この記事の著者

瀬戸 遥(セト ハルカ)

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

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この記事は参考になりましたか?

この記事をシェア

  • X ポスト
  • このエントリーをはてなブックマークに追加
CodeZine(コードジン)
https://codezine.jp/article/detail/5388 2010/08/25 14:00

おすすめ

アクセスランキング

アクセスランキング

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

アクセスランキング

アクセスランキング