SHOEISHA iD

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

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

ComponentZine(ComponentOne)

データベースのデータを集計して分かりやすくレポートするASP.NETアプリケーションを簡単に作る

「ReportViewer for ASP.NET Wijmo」のC1ReportViewerコントロールを使ったアプリケーションの作成(2)

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

市区町村名でグループ化したレポートの作成

 次にもう一つレポートを作成します。これはデータを市区町村名でグループ化し、データにアクセスしやすくしたものです。グループ化するとグループ名でアウトラインが作成されるので、データが見やすくアクセスしやすくなります。

 レポートは、今作成したのと同じレポート定義ファイルの中に作成します。

 1. C1Reportデザイナ左ペインにある[レポートの作成]をクリックします。レポート新規作成ウィザードが起動します。

 2. すでにデータソースを選ぶ画面になっていますので、そのままテーブル「図書館一覧」をクリックし[次へ]ボタンをクリックします。

 3. 「利用可能なフィールド」が表示されますので、「市区町村」を除く4つのフィールドをダブルクリックして「詳細」に移動し、[次へ]ボタンをクリックします。ここで選択したフィールドがレポートに使用されます。

「市区町村」を除く4つのフィールドを「詳細」に移動する
「市区町村」を除く4つのフィールドを「詳細」に移動する

 4. 「表形式」をクリックし、[次へ]ボタンをクリックします。そして、レポートのスタイル「Solstice」を選びます。

レポートのスタイル「Solstice」を選ぶ
レポートのスタイル「Solstice」を選ぶ

 5. レポート名を設定するページに移り、「図書館リストグループ」という名前でレポートを保存します。

「図書館リストグループ」という名前でレポートを保存する
「図書館リストグループ」という名前でレポートを保存「Solstice」を選ぶ

 6. デザイナに戻ると、「図書館リストグループ」という名前のレポートが作成されていますので、[デザイン]タブをクリックします。そして、[並び替え/グループ化]ボタンをクリックします。

[並び替え/グループ化]ボタンをクリック
[並び替え/グループ化]ボタンをクリック

 7. 「並び替え/グループ化」ダイアログが表示されます。ここでは、グループ化するフィールドを指定します。まず、[追加]ボタンをクリックします。そして、「グループ書式」のリストから「市区町村」を選びます。「グループの保持」では「グループ全体」を選び、「ヘッダセクション」をクリックしてOKボタンをクリックします。

グループ化するフィールドを指定する
グループ化するフィールドを指定する

 8. デザインモードに戻ると、「市区町村_ヘッダ」と「市区町村_フッタ」が追加されています。この「市区町村_ヘッダ」がグループヘッダになり、ここに表示したいフィールドなどを作成します。

 リボンの「データフィールド」をクリックします。フィールドリストが表示されますので、「市区町村」をクリックします。

リボンの「データフィールド」をクリックし「市区町村」をクリック
リボンの「データフィールド」をクリックし「市区町村」をクリック

 9. マウスポインタが十字に代わりますので「市区町村_ヘッダ」の上でドラッグし、フィールドを配置します。

 10. リボンの[矩形の追加]ボタンをクリックし、「市区町村_ヘッダ」に四角形を描画します。

リボンの[矩形の追加]ボタンをクリック
リボンの[矩形の追加]ボタンをクリック

 11. [プロパティ]タブをクリックし、「BackColor」プロパティを「Tan」にします。そして、BorderColorプロパティを「Transparent」にします。

「BackColor」プロパティを「Tan」にする
「BackColor」プロパティを「Tan」にする

 12. 図形の上で右クリックしショートカットメニューから[最背面に移動]をクリックします。これで、図形はフィールドの背面に配置されます。

ショートカットメニューから[最背面に移動]をクリック
ショートカットメニューから[最背面に移動]をクリック

 13. フィールド「市区町村」をクリックして幅を調整し、次のプロパティを設定します。

プロパティ 設定値
Font-Size 14
ForeColor SeaShell

 14. リボンの[アンバウンド画像の追加]ボタンをクリックし、「book.jpg」を選んで四角形の横に配置します。そして、画像の上で右クリックしショートカットメニューから[最背面に移動]をクリックします。

四角形の横に画像を配置する
四角形の横に画像を配置する

 15. リボンから[直線の描画]をクリックし、四角形と画像の下側に直線を入れます。

[直線の描画]をクリックし、四角形と画像の下側に直線を入れる
[直線の描画]をクリックし、四角形と画像の下側に直線を入れる

 16. [ホーム]タブをクリックしてデザインモードに戻り、「PageHeader」と「Detail」に配置した各フィールドのサイズを調整し、データがきちんと表示できるようにします。

 17. 以上でグループヘッダの装飾は完了です。プレビューボタンをクリックして出来上がりを確認します。[アウトライン]タブをクリックしアウトラインができていることを確認してください。

プレビューして出来上がりを確認する
プレビューして出来上がりを確認する

 これで、2つ目のレポートが出来上がりです。レポート定義ファイルを上書き保存し、C1Reportデザイナを終了します。

次のページ
レポート表示処理の作成

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

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

もっと読む

この記事の著者

瀬戸 遥(セト ハルカ)

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

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

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

この記事をシェア

  • このエントリーをはてなブックマークに追加
CodeZine(コードジン)
https://codezine.jp/article/detail/6955 2013/01/28 14:00

おすすめ

アクセスランキング

アクセスランキング

イベント

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

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

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

メールバックナンバー

アクセスランキング

アクセスランキング