Silverlight Reporting の基本

0 ユーザーが評価
この投稿には確認済みの回答があります。 0 返信 | 1 サポーター

トップ 10 投稿者 
女性
投稿 18
IG Employee
[IG] Yoshimi 投稿済み: 2011/1/20 16:07

Silverlight Reporting の基本

元記事 (英語) Mihail Mateev » Introduction to Silverlight Reporting 

この記事では、Siverlight Reporting プロジェクトを使用する方法をご紹介します。ソースコードとサンプル デモは Codeplex サイト (英語) からダウンロードできます。 このプロジェクトは、マイクロソフトの Pete Brown と David Poll により作成された Silverlight 4 を使用したシンプルなレポートを構築するベーシックなフレームワークです。

以下の機能が含まれます:

  • 自動改ページ
  • 高さの異なるライン項目のサポート
  • ページ カウント
  • テンプレート
  • ページ ヘッダーとフッター
  • 計算フィールドのあるレポート フッター
  • さまざまなステートで印刷にフックするイベント
Siverlight Reporting は IEnumerable 型の ItemsSource を使用します。特定の UI コンポーネントに関連付けされません。 Silverlight Reporting デモ アプリケーションは、WCF Service からのデータを使用した Silverlight Navigation アプリケーションです。
Microsoft DataGrid と Infargistics Silverlight XamGrid に別々のページが配置されます。

両コントロールは WCF Service から ItemsSource データを使用します。ソフトウェア要件:
  • Silverlight 4 Tools。ここからダウンロードできます。
  • Silverlight Reporting。 CodePlex (英語) からダウンロードできます。 
  • NetAdvantage for Silverlight Line of Business 10.2 (オプション)
    1.  

      アプリケーション作成手順:

      1. Silverlight Navigation アプリケーションを作成します。
      2. Silverlight WCF Service を実装して Silverlight クライアントへデータを送信します。
      3. クライアントでこのサービスへの参照を作成します。
      4. Silverlight application で Silverlight Reporting アセンブリを参照します。
      5. Silverlight Resource Dictionary とレポート テンプレートを作成します。
      6. WCF Service からのデータの読み込みと印刷を実装するシンプルな ViewModel を作成します。
      7. Navigation アプリケーションに 2 ページ作成します - 最初にレイアウトで Microsoft DataGrid を使用し、2 番目に Infragistics XamGrid を使用します。
      8. 静的なリソースとしてこの ViewModel をこれらの 2 ページに追加し、各ページ レイアウトに DataContext として追加します。
      9. 両グリッドの ItemsSource を ViewModel の Product プロパティへバインドします。
      10. Silverlight Commanding を使用してデータの読み込みと印刷にボタンを実装します。

      Silverlight ナビゲーション アプリケーションの作成:

       

      Silverlight WCF Service を実装しクライアントで参照します(デモ アプリケーションで実装)。

      Silverlight.Reporting アセンブリを参照:

       

       Silverlight Resource Dictionary をレポート テンプレートと共に作成します。

      4 つのテンプレート プロパティ (DataTemplate 型) があります。

      • PageHeaderTemplate
      • PageFooterTemplate
      • ItemTemplate
      • ReportFooterTemplate

          <ResourceDictionary
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:reporting="clr-namespace:System.Windows.Printing.Reporting;assembly=Silverlight.Reporting">
          <reporting:Report x:Key="Report"
                           Title="Products Review List">
              <reporting:Report.Resources>
                  <Style x:Key="HeaderText"
                            TargetType="TextBlock">
                      <Setter Property="FontWeight"
                                 Value="Bold" />
                      <Setter Property="TextAlignment"
                                 Value="Left" />
                      <Setter Property="HorizontalAlignment"
                                 Value="Stretch" />
                  </Style>
              </reporting:Report.Resources>
              <reporting:Report.PageHeaderTemplate>
                  <DataTemplate>
                      <Grid Margin="1 1 1 20">
                          <Rectangle Stroke="Black" />
                          <Grid>
                              <Grid.RowDefinitions>
                                  <RowDefinition Height="Auto" />
                                  <RowDefinition Height="Auto" />
                              </Grid.RowDefinitions>
                              <TextBlock Text="{Binding Title}"
                                            Grid.Row="0"
                                           
                                            FontWeight="Bold"
                                            Margin="5"
                                            HorizontalAlignment="Left"
                                            VerticalAlignment="Top" />

                              <TextBlock Text="{Binding CurrentPageNumber, StringFormat='Page {0}'}"
                                            Grid.Row="0"
                                            Margin="5"
                                            HorizontalAlignment="Right"
                                            VerticalAlignment="Top" />
                              <Grid Grid.Row="1"
                                       HorizontalAlignment="Stretch"
                                       Margin="4 0 0 4">
                                  <Grid.RowDefinitions>
                                      <RowDefinition Height="Auto" />
                                      <RowDefinition Height="Auto" />
                                  </Grid.RowDefinitions>
                                  <Grid.ColumnDefinitions>
                                      <ColumnDefinition Width="200" />
                                      <ColumnDefinition Width="200" />
                                      <ColumnDefinition Width="150" />
                                      <ColumnDefinition Width="150" />
                                  </Grid.ColumnDefinitions>
                                  <TextBlock Grid.Column="0"
                                                Style="{StaticResource HeaderText}"
                                                Text="SKU and Name" />
                                  <TextBlock Grid.Column="1"
                                                Style="{StaticResource HeaderText}"
                                                TextAlignment="Left"
                                                Text="Category" />
                                  <TextBlock Grid.Column="2"
                                                Style="{StaticResource HeaderText}"
                                                TextAlignment="Right"
                                                Text="Supplier" />
                                  <TextBlock Grid.Column="3"
                                                Style="{StaticResource HeaderText}"
                                                TextAlignment="Right"
                                                Text="UnitPrice" />
                                  <TextBlock Grid.Row="2"
                                                Style="{StaticResource HeaderText}"
                                                Text="Units in Stock" />
                                  <TextBlock Grid.Row="2" Grid.Column="1"
                                                Style="{StaticResource HeaderText}"
                                                Text="Quantity per Unit" />
                              </Grid>
                          </Grid>
                      </Grid>
                  </DataTemplate>
              </reporting:Report.PageHeaderTemplate>
              <reporting:Report.ItemTemplate>
                  <DataTemplate>
                      <Grid HorizontalAlignment="Stretch"
                               Margin="5 0 0 20">
                          <Grid.RowDefinitions>
                              <RowDefinition Height="Auto" />
                              <RowDefinition Height="Auto" />
                              <RowDefinition Height="Auto" />
                          </Grid.RowDefinitions>
                          <Grid.ColumnDefinitions>
                              <ColumnDefinition Width="200" />
                              <ColumnDefinition Width="200" />
                              <ColumnDefinition Width="150" />
                              <ColumnDefinition Width="150" />
                          </Grid.ColumnDefinitions>
                          <StackPanel Grid.Column="0"
                                         Orientation="Horizontal">
                              <TextBlock Text="{Binding SKU}"
                                            FontWeight="Bold" />
                              <TextBlock Text=", "
                                            FontWeight="Bold" />
                              <TextBlock Text="{Binding Name}"
                                            FontWeight="Bold" />
                          </StackPanel>
                          <TextBlock Grid.Column="1"
                                        Text="{Binding Category}"
                                        TextAlignment="Left" />
                          <TextBlock Grid.Column="2"
                                        Text="{Binding Supplier}"
                                        TextAlignment="Right" />
                          <TextBlock Grid.Column="3"
                                        Text="{Binding UnitPrice, StringFormat='{}{0:C}'}"

                                        TextAlignment="Right" />
                          <TextBlock Grid.Row="1" Text="{Binding UnitsInStock}" />
                          <TextBlock Grid.Row="1" Grid.Column="1" Text="{Binding QuantityPerUnit}" />
                          <TextBlock Grid.Row="2"
                                        Grid.ColumnSpan="4"
                                        TextWrapping="Wrap"
                                        Text="{Binding ReviewComments}" />
                      </Grid>
                  </DataTemplate>
              </reporting:Report.ItemTemplate>
              <reporting:Report.PageFooterTemplate>
                  <DataTemplate>
                      <Grid Margin="1 20 1 1">
                          <Rectangle Stroke="Black" />
                          <StackPanel Orientation="Horizontal"
                                         HorizontalAlignment="Right"
                                         VerticalAlignment="Center"
                                         Margin="5">
                              <TextBlock Text="{Binding CurrentPageNumber, StringFormat='Page {0}'}" />
                              <TextBlock Text="{Binding TotalPageCount, StringFormat=' of {0}'}" />
                            </StackPanel>
                        </Grid>
                  </DataTemplate>
              </reporting:Report.PageFooterTemplate>
              <reporting:Report.ReportFooterTemplate>
                  <DataTemplate>
                      <Grid Margin="1 20 1 1">
                          <Rectangle Stroke="Black" />
                            <Grid>
                              <Grid.ColumnDefinitions>
                                  <ColumnDefinition Width="200" />
                                  <ColumnDefinition Width="200" />
                                  <ColumnDefinition Width="150" />
                                  <ColumnDefinition Width="150" />
                              </Grid.ColumnDefinitions>
                                <TextBlock Grid.Column="1"
                                            Text="{Binding ProductsCount, StringFormat='{}{0} products'}"
                                            TextAlignment="Left" />
                              <TextBlock Grid.Column="2"
                                            Text="{Binding TotalPrice, StringFormat='{}{0:C}'}"
                                            TextAlignment="Right" />

                          </Grid>
                      </Grid>
                  </DataTemplate>
              </reporting:Report.ReportFooterTemplate>
          </reporting:Report>
      </ResourceDictionary>

      Add this ResourceDictionary to Application.Resources:

         <Application.Resources>
          <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
              <ResourceDictionary Source="Assets/Styles.xaml"/>
              <ResourceDictionary Source="Assets/ReportStyles.xaml"/>
            </ResourceDictionary.MergedDictionaries>
          </ResourceDictionary>
        </Application.Resources>

      
      

      WCF Service からのデータの読み込みと印刷を実装するシンプルな ViewModel を作成します。

      
      

      レポーティングに関連した ViewModel のコードがあります。

      すべてのコードは同じアプリケーション内にあります。

       

      public class DataViewModel : BaseViewModel
      
      {
      
      
      
      
      
      
      
      
      
      
      
              public DataViewModel()
      
              {
      
      
      
      
      
      
      
      
      
      
                  _products = new List<Product>();
      
      
      
      
      
      
      
      
      
      
                  _report = Application.Current.Resources["Report"] as Report;
      
      
      
      
      
      
      
      
      
      
       
      
      
      
      
      
      
      
      
      
      
                  InitializeReport();
      
      
      
      
      
      
      
      
      
      
              }
      
      
      
      
      
      
      
      
      
      
      ...
      
      
      
      
      
      
      
      
      
      
       
      
      
      
      
      
      
      
      
      
      
      
             public List<Product> Products
      
              {
      
      
      
      
      
      
      
      
      
      
                  get
      
      
      
      
      
      
      
      
      
      
                  {
      
      
      
      
      
      
      
      
      
      
                      return this._products;
      
      
      
      
      
      
      
      
      
      
                  }
      
      
      
      
      
      
      
      
      
      
                  set
      
      
      
      
      
      
      
      
      
      
                  {
      
      
      
      
      
      
      
      
      
      
                      if (this._products != value)
      
      
      
      
      
      
      
      
      
      
                      {
      
      
      
      
      
      
      
      
      
      
                          this._products = value;
      
      
      
      
      
      
      
      
      
      
                          this.OnPropertyChanged("Products");
      
      
      
      
      
      
      
      
      
      
                      }
      
      
      
      
      
      
      
      
      
      
                  }
      
      
      
      
      
      
      
      
      
      
              }
      
      
      
      
      
      
      
      
      
      
      ....
      
      
      
      
      
      
      
      
      
      
       
      
      
      
      
      
      
      
      
      
      
       
      
              private void InitializeReport()
      
      
              {
      
      
                  //_report = Application.Current.Resources["Report"] as Report;
                  _report.EndPrint += (s, e) => MessageBox.Show("Report printed.");
      
      
       
                  _report.BeginBuildReport += (s, e) =>
                  {
                      // 現在までの合計を初期化
                      _totals = new ReportTotals();
      
      
                  };
      
      
       
      
      
                  _report.BeginBuildReportItem += (s, e) =>
      
      
                  {
      
      
                      // このイベントは各レポート項目で発生するため、
      
      
                      // 現在までの合計を構築するために使用できます
      
      
                      var item = e.DataContext as Product;
      
      
       
      
      
                      _totals.ProductsCount++;
      
      
                      _totals.TotalPrice += item.UnitPrice * item.UnitsInStock;
      
      
       
      
      
                  };
      
      
       
      
      
                  _report.BeginBuildReportFooter += (s, e) =>
      
      
                  {
      
      
                      // レポート フッターのコンテキストとして「現在までの合計」を設定
      
      
                      e.DataContext = _totals;
      
      
                  };
      
      
       
      
      
              }
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
       ...
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
              public void Print()
      
              {
      
      
      
      
      
      
      
      
      
      
                  if (_products == null)
      
      
      
      
      
      
      
      
      
      
                  {
      
      
      
      
      
      
      
      
      
      
                      return;
      
      
      
      
      
      
      
      
      
      
                  }
      
      
      
      
      
      
      
      
      
      
                  this._report.Print();
      
      
      
      
      
      
      
      
      
      
              }
      
      
      
      
      
      
      
      
      
      
      ....
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
              public ICommand PrintReport
      
              {
      
      
      
      
      
      
      
      
      
      
                  get { return new PrintReportCommand(this); }
      
      
      
      
      
      
      
      
      
      
              }
      
      
      
      
      
      
      
      
      
      
              #endregion //PrintReport
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
       
      
      
      
      
      
      
      
      
      
      
      }
      
      
      
      
      
      
      
      
      
      
      
          public class PrintReportCommand : ICommand
      
          {
      
      
      
      
      
      
      
      
      
      
              private readonly DataViewModel _view;
      
      
      
      
      
      
      
      
      
      
       
      
      
      
      
      
      
      
      
      
      
              public PrintReportCommand(DataViewModel view)
      
      
      
      
      
      
      
      
      
      
              {
      
      
      
      
      
      
      
      
      
      
                  _view = view;
      
      
      
      
      
      
      
      
      
      
              }
      
      
      
      
      
      
      
      
      
      
       
      
      
      
      
      
      
      
      
      
      
              public bool CanExecute(object parameter)
      
      
      
      
      
      
      
      
      
      
              {
      
      
      
      
      
      
      
      
      
      
                  List<Product> products = parameter as List<Product>;
      
      
      
      
      
      
      
      
      
      
                  if (products != null && products.Count > 0)
      
      
      
      
      
      
      
      
      
      
                  {
      
      
      
      
      
      
      
      
      
      
                      return true;
      
      
      
      
      
      
      
      
      
      
                  }
      
      
      
      
      
      
      
      
      
      
                  return false;
      
      
      
      
      
      
      
      
      
      
              }
      
      
      
      
      
      
      
      
      
      
       
      
      
      
      
      
      
      
      
      
      
              public event EventHandler CanExecuteChanged;
      
      
      
      
      
      
      
      
      
      
       
      
      
      
      
      
      
      
      
      
      
              public void Execute(object parameter)
      
      
      
      
      
      
      
      
      
      
              {
      
      
      
      
      
      
      
      
      
      
                  _view.Print();
      
      
      
      
      
      
      
      
      
      
              }
      
      
      
      
      
      
      
      
      
      
          }
      
      
      
      
      
      
      
      
      
      
      

      Navigation アプリケーションにページ作成します - 最初にレイアウトで Microsoft DataGrid を使用し、2 番目に Infragistics XamGrid を使用します。
      静的なリソースとしてこの ViewModel をこれらの 2 ページに追加し、各ページ レイアウトに DataContext として追加します。次に両グリッドの ItemsSource を ViewModel の Products プロパティにバインドします。

       DataGrid のページの XAML コード:

      .....

      <UserControl.Resources>

      <my:DataViewModel x:Key="dateViewModel" x:FieldModifier="public" />

      </UserControl.Resources>

      <Grid x:Name="LayoutRoot" Background="LightSteelBlue" DataContext="{StaticResource dateViewModel}">

      <Grid.RowDefinitions>

          <RowDefinition Height="30" />

          <RowDefinition />           

      </Grid.RowDefinitions>

      <StackPanel Orientation="Horizontal">

          <Button x:Name="BtnMsGridLoadData" Style="{StaticResource PageButtonStyle}"

                                     Content="Load Data" Command="{Binding Load}" />

          <Button x:Name="BtnMsGridPrint" Style="{StaticResource PageButtonStyle}"

                                     Content="Generate Report" Command="{Binding PrintReport}"

                                     CommandParameter="{Binding Products}"/>

          <TextBlock x:Name="PageNameTextBlock" Style="{StaticResource ApplicationNameStyle}"

                             Text="MS Grid Reporting"/>           

      </StackPanel>

      <sdk:DataGrid AutoGenerateColumns="False" Grid.Row="1" HorizontalAlignment="Stretch" Margin="20" Name="dataGrid" VerticalAlignment="Stretch"

                     ItemsSource="{Binding Products}">

          <sdk:DataGrid.Columns>

              <sdk:DataGridTextColumn Header="SKU" Binding="{Binding SKU}" />

              <sdk:DataGridTextColumn Header="Name" Binding="{Binding Name}" />

              <sdk:DataGridTextColumn Header="Category" Binding="{Binding Category}" />

              <sdk:DataGridTextColumn Header="Supplier" Binding="{Binding Supplier}" />

              <sdk:DataGridTextColumn Header="UnitPrice" Binding="{Binding UnitPrice}" />

              <sdk:DataGridTextColumn Header="UnitsInStock" Binding="{Binding UnitsInStock}" />

              <sdk:DataGridCheckBoxColumn Header="OnBackOrder" Binding="{Binding OnBackOrder}" />

              <sdk:DataGridTextColumn Header="QuantityPerUnit" Binding="{Binding QuantityPerUnit}" />

          </sdk:DataGrid.Columns>

       

      </sdk:DataGrid>

       

      </Grid>

      
      ...
      

       

       

      同様のコードが Infragistics XamGrid のページにもあります:

      ... 

      <UserControl.Resources>

          <my:DataViewModel x:Key="dateViewModel2" x:FieldModifier="public" />

      </UserControl.Resources>

      <Grid x:Name="LayoutRoot" Background="LightSkyBlue" DataContext="{StaticResource dateViewModel2}">

          <Grid.RowDefinitions>

              <RowDefinition Height="30" />

              <RowDefinition />

          </Grid.RowDefinitions>

          <StackPanel Orientation="Horizontal">

              <Button x:Name="BtnMsGridLoadData" Style="{StaticResource PageButtonStyle}"

                                         Content="Load Data" Command="{Binding Load}" />

              <Button x:Name="BtnMsGridPrint" Style="{StaticResource PageButtonStyle}"

                                         Content="Generate Report" Command="{Binding PrintReport}"

                                         CommandParameter="{Binding Products}" />

              <TextBlock x:Name="PageNameTextBlock" Style="{StaticResource ApplicationNameStyle}"

                                 Text="XamGrid Reporting"/>           

          </StackPanel>

          <ig:XamGrid Grid.Row="1" HorizontalAlignment="Stretch" Margin="20" Name="xamGrid" VerticalAlignment="Stretch"

                     ItemsSource="{Binding Products}" AutoGenerateColumns="False">

              <ig:XamGrid.Columns>

                  <ig:TextColumn Key="SKU"/>

                  <ig:TextColumn Key="Name"/>

                  <ig:TextColumn Key="Category"/>

                  <ig:TextColumn Key="Supplier"/>

                  <ig:TextColumn Key="UnitPrice"/>

                  <ig:TextColumn Key="UnitsInStock"/>

                  <ig:CheckBoxColumn Key="OnBackOrder"/>

                  <ig:TextColumn Key="QuantityPerUnit"/>

              </ig:XamGrid.Columns>

          </ig:XamGrid>

      </Grid>

      ..... 

      アプリケーションをビルドして実行します

       

      ナビゲーション アプリケーションでデータが読み込まれる前の DataGrid

      ナビゲーション アプリケーションでデータが読み込まれた後の DataGrid

       印刷ダイアログ。XPS Document Writer が選択されています。

      XPS Document が作成されました。Report には特定のページ ヘッダー、フッター、項目データの視覚化、集計パーツが含まれます。
      Report テンプレートにはすべてのレポート設定が含まれます。

      Infragistics XamGrid はDataGrid と同様、 Silverlight Reporting で正しく動作します。

       Silverlight Reporting に以下の機能は含まれません。

      • Subreports とグループ化
      • 画像サポート (ページが実際のビジュアルツリーの一部ではないため) 
      • 印刷プレビュー
      • レポートのプログレス表示

      Silverlight Reporting は Silverlight 4 でレポートを作成する最適なサンプルです。

      デモ アプリケーションのソース コード:SilverlightReportingDemo.zip 

      -->

      ページ 1 / 1 (1 項目) | RSS
      Infragistics Japan
      インフラジスティックス ジャパン