WcfListDataConnector を使用した Silverlight アプリケーションでの XamSchedule ソリューションの実装

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

トップ 10 投稿者 
女性
投稿 18
IG Employee
[IG] Yoshimi 投稿済み: 2010/12/8 13:40

WcfListDataConnector を使用した Silverlight アプリケーションでの XamSchedule ソリューションの実装

 

元記事 (英語): Mihail Mateev - http://blogs.infragistics.com/blogs/mihail_mateev/archive/2010/10/30/implementing-xamschedule-solution-in-silverlight-applications-using-a-wcflistdataconnector.aspx

XamSchedule スイートは、WCF サービスを介してさまざまなソースからデータ使用するための WcfScheduleDataConnector を提供します。カレンダーやその他のスケジュール機能を持つマルチ ユーザー アプリケーションの作成がとても簡単にできます。スケジュール アプリケーションがリモート サーバーのデータを使用する場合の最適な方法は、ListScheduleDataConnector の代わりに WcfScheduleDataConnector を使用することです。 この場合、クライアント側とサーバー側の通信にコネクターが使用されます。 そうでない場合、 ListScheduleDataConnector を使用してこの機能を実装する必要があります。

WcfListScheduleDataConnector はサーバー側の WCF サービスに以下の 2 つのクラスを提供します: WcfListConnectorServiceSingle WcfListConnectorServiceMulti。

WcfListConnectorServiceSingle は予定表のデータをクライアントへ提供します。
このサービス クラスの 1 インスタンスのみ作成され、すべてのリモートコールが同じスレッドで実行されます。
これにより、各リモートコールのオーバーヘッドを削減できます。ただし、このサービスはサービスに接続するクライアントの数が少ない場合にのみ使用することができます。
クライアントが多い場合や WcfListConnectorServiceSingle の使用でタイムアウトになる場合などは、WcfListConnectorServiceMulti を使用することをお勧めします。

サンプルでは、WCF サービスを使用してクライアントへリスト スケジュールのデータを提供しています。
WCF サービス クラス (Test2008DataService) は、WcfListConnectorServiceMulti クラスを継承し、アプリケーションでより多くのクライアントをサービスへ接続しています。
このサービスの新しいインスタンスが各リモート コールでサービスに作成され、呼び出しがそれぞれのスレッドを作成します。
このサービスに提供されるデータソースはスレッド セーフです。

重要ポイント:

  • 対応するデータ型を持つためのプロジェクト データベースは、Resource ResourceCalendar および Activity (Appointment, Task, Journal) プロパティです。そうでない場合、マッピングをファイルする前に独自にデータ変換を実装する必要があります。
  • メソッドは WcfListConnectorServiceMulti 継承でオーバーライドします。
  • エンド ポイントを構成ファイルに設定します。リモート WCF サービスを指定する 2 つの方法があります。
    サービスのエンド ポイントは、構成ファイルまたはリモート アドレスで定義でき、バインドはコネクターで直接指定できます。
    リモート WCF サービスの位置を定義する最も簡単な方法は、アプリケーションの複数のクライアントで使用して、エンドポイントを構成ファイル (ServiceReferences.ClientConfig) で定義し、WcfListScheduleDataConnector.EndpointConfigurationName をエンドポイント構成の名前として設定します。

デモ アプリケーションでは、複数ユーザーのスケジュール アプリケーションを作成する簡単な方法をご覧いただけます。SQL Server 2008 データベースおよび WcfListConnectorServiceMulti を使用してます。

ソフトウェア要件:

  1. NetAdvantage for Silverlight  Line of Business 2010 Vol.3
  2. NetAdvantage for .NET 2010 Vol.3
  3. NetAdvantage Ultimate 2010 Vol.3

デモ アプリケーションの作成手順

  • データベースをダウンロードして SQL Server 2008 R2 (Express またはそれ以上のライセンス) へアタッチします。
  • ASP.Net ウェブ アプリケーションでホストされる Silverlight アプリケーションを作成します。
  • ウェブ プロジェクトで Infragistics4.Services.Schedules.WcfConnectorService.v10.3 へ参照を追加します。
  • 新しい LINQ をリレーショナル オブジェクトの Resources、 ResourceCalendars、Appointments、Tasks および Journals へマップされた SQL クラスへ追加します。
  • WCF Service を WcfListConnectorServiceMulti を継承する Web プロジェクトの Test2008DataService へ追加します。
  • これらのメソッドを Test2008DataService クラスでオーバーライドします (マッピング フィールドを含む):

    GetItemSource
    InitializePropertyMappings
    OnRemoteCallReceived
    OnRemoteCallProcessed
    OnActivityAdded
    OnActivityChanged
    OnActivityRemoved

  • Web.Config でエンドポイントを設定します。
  • 構成ファイル (ServiceReferences.ClientConfig) でエンド ポイントを定義します。
  • Silverlight アプリケーションで WcfListScheduleDataConnector を追加します。
  • WcfListScheduleDataConnector.EndpointConfigurationName を エンドポイント構成の名前に設定します。
  • XamScheduleDataManager を追加します。
  • Schedule スイートの UI コンポーネント (XamDayView、XamScheduleView、 XamMonthView) を追加します。
  • 複数リソースと複数カレンダーのサポートを実装します。
  • 表示タイプの実行時の変更を実装します。
  • カレンダー表示モードにランタイム サポートを実装します。
  • アプリケーションを実行します。

 

 

データベースをダウンロードして SQL Server 2008 R2 (Express またはそれ以上のライセンス) へアタッチ

Test2008R2 データベースをダウンロードし、展開して SQL Server へアタッチします。

 

ASP.Net Web アプリケーションでホストされる Silverlight アプリケーションを作成

ASP.Net Web アプリケーションでホストされる Silverlight アプリケーションを作成し、XamScheduleWCFService という名前を付けます。

 

Web プロジェクトで Infragistics4.Services.Schedules.WcfConnectorService.v10.3 へ参照を追加します。

 

新しい LINQ をリレーショナル オブジェクトの Resources、 ResourceCalendars、Appointments、Tasks および Journals へマップされた SQL クラスへ追加します。

新しい LINQ をリレーショナル オブジェクトの Resources、 ResourceCalendars、Appointments、Tasks および Journals へマップされた SQL クラス (Test2008R2DataClasses) へ追加します。

 

 

メソッドを Test2008DataService クラスでオーバーライド:

GetItemSource:

   1: private Test2008R2DataClassesDataContext dataContext;
   2:  
   3:         protected override IEnumerable GetItemSource(ItemSourceType listManagerType)
   4:         {            
   5:             switch (listManagerType)
   6:             {
   7:                 case ItemSourceType.Appointment:
   8:                     return this.dataContext.Appointments;
   9:  
  10:                 case ItemSourceType.RecurringAppointment:
  11:                     return null;
  12:  
  13:                 case ItemSourceType.Resource:
  14:                     return this.dataContext.Resources;
  15:  
  16:                 case ItemSourceType.ResourceCalendar:
  17:                     return this.dataContext.ResourceCalendars;
  18:  
  19:             }
  20:  
  21:             return null;
  22:         }

 

InitializePropertyMappings – 実装済みのフィールド マッピングがあります。

   1: protected override void InitializePropertyMappings(ItemSourceType itemSourceType, object mappings)
   2: {
   3:     switch (itemSourceType)
   4:     {
   5:         case ItemSourceType.Appointment:
   6:             ((AppointmentPropertyMappingCollection)mappings).UseDefaultMappings = true;
   7:             break;
   8:  
   9:         case ItemSourceType.RecurringAppointment:
  10:             ((AppointmentPropertyMappingCollection)mappings).UseDefaultMappings = true;
  11:             break;
  12:  
  13:         case ItemSourceType.Resource:
  14:             ((ResourcePropertyMappingCollection)mappings).UseDefaultMappings = true;
  15:             break;
  16:  
  17:         case ItemSourceType.ResourceCalendar:
  18:             ((ResourceCalendarPropertyMappingCollection)mappings).UseDefaultMappings = true;
  19:             break;
  20:  
  21:     }
  22: }

 

OnRemoteCallReceived

   1: protected override void OnRemoteCallReceived(CallContext context)
   2: {
   3:     this.dataContext = new Test2008R2DataClassesDataContext();
   4:     base.OnRemoteCallReceived(context);
   5: }

 

OnRemoteCallProcessed

   1: protected override void OnRemoteCallProcessed(CallResult result)
   2: {
   3:     base.OnRemoteCallProcessed(result);
   4:  
   5:     this.dataContext.Dispose();
   6:     this.dataContext = null;
   7: }

 

OnActivityAdded

   1: protected override void OnActivityAdded(ActivityAddedEventArgs args)
   2: {
   3:     base.OnActivityAdded(args);
   4:     this.dataContext.SubmitChanges();
   5: }

OnActivityChanged

   1: protected override void OnActivityChanged(ActivityChangedEventArgs args)
   2: {
   3:     base.OnActivityChanged(args);
   4:     this.dataContext.SubmitChanges();
   5: }

OnActivityRemoved

   1: protected override void OnActivityRemoved(ActivityRemovedEventArgs args)
   2: {
   3:     base.OnActivityRemoved(args);
   4:     this.dataContext.SubmitChanges();
   5: }

 

Web.Config でエンドポイントを設定

Web.Config ファイルで WCF サービスのエンドポイントが正しく設定されていることを確認します。型:Infragistics.Services.Schedules.IWcfListConnectorService からのコントラクトが必要です。

   1: <?xml version="1.0"?>
   2:  
   3: <!--
   4:   For more information on how to configure your ASP.NET application, please visit
   5:   http://go.microsoft.com/fwlink/?LinkId=169433
   6:   -->
   7:  
   8: <configuration>
   9:     <connectionStrings>
  10:         <add name="Test2008R2ConnectionString" connectionString="Data Source=.\SQLExpress;Initial Catalog=Test2008R2;Integrated Security=True"
  11:             providerName="System.Data.SqlClient" />
  12:     </connectionStrings>
  13:     <system.web>
  14:         <compilation debug="true" targetFramework="4.0" />
  15:     </system.web>
  16:  
  17:     <system.serviceModel>
  18:         <behaviors>
  19:             <serviceBehaviors>
  20:                 <behavior>
  21:                     <serviceMetadata httpGetEnabled="true" />
  22:                     <serviceDebug includeExceptionDetailInFaults="false" />
  23:                 </behavior>
  24:             </serviceBehaviors>
  25:         </behaviors>
  26:       <serviceHostingEnvironment multipleSiteBindingsEnabled="true" />
  27:         <bindings>
  28:             <customBinding>
  29:                 <binding name="CustomBinding1">
  30:                   <binaryMessageEncoding>
  31:                     <readerQuotas maxStringContentLength="2147483647" />
  32:                   </binaryMessageEncoding>
  33:                   <httpTransport authenticationScheme="Anonymous" />
  34:                 </binding>              
  35:             </customBinding>
  36:         </bindings>
  37:         <services>
  38:             <service name="XamScheduleWCFService.Web.Test2008DataService">
  39:                 <endpoint address="" binding="customBinding" bindingConfiguration="CustomBinding1"
  40:                     contract="Infragistics.Services.Schedules.IWcfListConnectorService" />
  41:                 <endpoint address="mex" binding="mexHttpBinding" contract="IMetadataExchange" />
  42:             </service>
  43:         </services>
  44:     </system.serviceModel>
  45:   <system.webServer>
  46:     <modules runAllManagedModulesForAllRequests="true"/>
  47:   </system.webServer>
  48: </configuration>

 

構成ファイル (ServiceReferences.ClientConfig) でエンド ポイントを定義

ServiceReferences.ClientConfig ファイルを編集します。ServiceReferences.ClientConfig がない場合は、以下の例に従って作成してください。

   1: <configuration>
   2:   <system.serviceModel>
   3:     <bindings>
   4:       <customBinding>
   5:         <binding name="MyCustomBinding">
   6:           <binaryMessageEncoding />
   7:           <httpTransport maxReceivedMessageSize="2147483647" maxBufferSize="2147483647" />
   8:         </binding>
   9:       </customBinding>
  10:     </bindings>
  11:     <client>
  12:       <endpoint address="http://localhost:41558/Test2008DataService.svc"
  13:         binding="customBinding" bindingConfiguration="MyCustomBinding"
  14:         contract="WcfListConnectorServiceSL.IWcfListConnectorService"
  15:         name="MyEndpointConfigurationSQL" />      
  16:     </client>
  17:   </system.serviceModel>
  18: </configuration>

 

Silverlight アプリケーションに WcfListScheduleDataConnector を追加

   1: <ig:WcfListScheduleDataConnector 
   2:             Name="DataConnector" />

 

WcfListScheduleDataConnector.EndpointConfigurationName を エンドポイント構成の名前に設定

XAML で ServiceReferences.ClientConfig のエンドポイントを WcfListScheduleDataConnector.EndpointConfigurationName に設定します。

   1: <ig:WcfListScheduleDataConnector 
   2:             Name="DataConnector"
   3:             EndpointConfigurationName="MyEndpointConfigurationSQL"
   4:             PollingInterval="00:00:10"
   5:             PollingMode="Detailed" Loaded="DataConnector_Loaded"  
   6:             />

 

XamScheduleDataManager を追加

   1: <ig:XamScheduleDataManager Name="DataManager" CurrentUserId="mdour"  DataConnector="{Binding ElementName=DataConnector}" >
   2:      <ig:XamScheduleDataManager.Settings>
   3:          <ig:ScheduleSettings>
   4:              <ig:ScheduleSettings.AppointmentSettings>
   5:                  <ig:AppointmentSettings AllowEdit="True"  AllowResizing="StartAndEnd"/>
   6:              </ig:ScheduleSettings.AppointmentSettings>
   7:          </ig:ScheduleSettings>
   8:      </ig:XamScheduleDataManager.Settings>
   9:  </ig:XamScheduleDataManager>

 

Schedule スイートの UI コンポーネント (XamDayView、XamScheduleView、 XamMonthView)を追加

   1: <ig:XamDayView Grid.Row="1" Name="xamDayView1" Margin="5" BorderBrush="Black" MultiDayActivityAreaVisibility="Collapsed"
   2:                               DataManager="{Binding ElementName=DataManager}" ActiveCalendarChanged="DayView_ActiveCalendarChanged"
   3:                                />
   4:         <ig:XamScheduleView HorizontalAlignment="Stretch" Grid.Row="1" Name="xamScheduleView1" VerticalAlignment="Stretch" 
   5:                             DataManager="{Binding ElementName=DataManager}" Visibility="Collapsed" />
   6:         <ig:XamMonthView HorizontalAlignment="Stretch"  Grid.Row="1" Name="xamMonthView1" VerticalAlignment="Stretch" 
   7:                             DataManager="{Binding ElementName=DataManager}" Visibility="Collapsed" />

 

複数リソースと複数の予定表のサポートの実装

MainPage に 2 つのメソッド (SetAllCalendars および SetResource) を追加します。


SetAllCalendars はすべてのリソースの予定表を表示します。

   1: #region SetAllCalendars
   2: private void SetAllCalendars()
   3: {
   4:     this.DataManager.CalendarGroups.Clear();
   5:     foreach (Resource resource in this.DataManager.ResourceItems)
   6:     {
   7:  
   8:         if (resource != null)
   9:         {
  10:             CalendarGroup group = new CalendarGroup();
  11:  
  12:  
  13:             foreach (ResourceCalendar calendar in resource.Calendars)
  14:             {
  15:                 if (calendar != null)
  16:                 {
  17:                     group.Calendars.Add(calendar);
  18:                 }
  19:  
  20:             }
  21:  
  22:             this.DataManager.CalendarGroups.Add(group);
  23:         }
  24:  
  25:     }
  26:  
  27:     this.cboResources.SelectedIndex = -1;
  28:  
  29: }
  30: #endregion //SetAllCalendars

SetResource はすべてのリソースの予定表を表示します。

   1: #region SetResource
   2: private void SetResource(Resource resource)
   3: {
   4:  
   5:     this.DataManager.CalendarGroups.Clear();
   6:  
   7:     CalendarGroup group = new CalendarGroup();
   8:  
   9:     foreach (ResourceCalendar calendar in resource.Calendars)
  10:     {
  11:         if (calendar != null)
  12:         {
  13:             group.Calendars.Add(calendar);
  14:         }
  15:  
  16:     }
  17:  
  18:     this.DataManager.CalendarGroups.Add(group);
  19: }
  20: #endregion //SetResource

 

表示タイプのランタイムでの変更を実装

ページレ イアウトが各ビュー (day view、schedule view、 month view) の項目と共に ListBox コントロールに追加されます。

   1: <ListBox x:Name="ListScheduleViews" Margin="5 0 5 0"   SelectionMode="Single"  SelectionChanged="ListScheduleViews_SelectionChanged">
   2:     <ListBox.ItemsPanel>
   3:         <ItemsPanelTemplate>
   4:             <StackPanel Orientation="Horizontal" Margin="0" />
   5:         </ItemsPanelTemplate>
   6:     </ListBox.ItemsPanel>
   7:     <ListBoxItem x:Name="DayViewItem" Content="Day View" Tag="DayView" Margin="0 0 10 0" IsSelected="True" />
   8:     <ListBoxItem x:Name="ScheduleViewItem" Content="Schedule View" Tag="ScheduleView" Margin="0 0 10 0" IsSelected="False" />
   9:     <ListBoxItem x:Name="MonthViewItem" Content="Month View" Tag="MonthView" Margin="0 0 10 0" IsSelected="False" />
  10: </ListBox>

 

選択が変更された場合に、イベントはイベント ハンドラーを呼び出し、 3 つの UI コントロール (XamDayView、 XamScheduleView、および XamMonthView) の表示を変更します。

   1: #region ListScheduleViews_SelectionChanged
   2: private void ListScheduleViews_SelectionChanged(object sender, SelectionChangedEventArgs e)
   3: {
   4:     ListBoxItem item = e.AddedItems[0] as ListBoxItem;
   5:     if (item != null)
   6:     {
   7:         SetScheduleMode(item.Tag.ToString());
   8:     }
   9: }
  10: #endregion //ListScheduleViews_SelectionChanged
  11:  
  12: #region SetScheduleMode
  13: private void SetScheduleMode(string viewName)
  14: {
  15:     if (this.xamDayView1 == null || this.xamMonthView1 == null || this.xamScheduleView1 == null)
  16:     {
  17:         return;
  18:     }
  19:  
  20:     switch (viewName)
  21:     {
  22:         case "DayView":
  23:             this.xamDayView1.Visibility = System.Windows.Visibility.Visible;
  24:             this.xamMonthView1.Visibility = System.Windows.Visibility.Collapsed;
  25:             this.xamScheduleView1.Visibility = System.Windows.Visibility.Collapsed;
  26:             break;
  27:         case "ScheduleView":
  28:             this.xamDayView1.Visibility = System.Windows.Visibility.Collapsed;
  29:             this.xamMonthView1.Visibility = System.Windows.Visibility.Collapsed;
  30:             this.xamScheduleView1.Visibility = System.Windows.Visibility.Visible;
  31:             break;
  32:         case "MonthView":
  33:             this.xamDayView1.Visibility = System.Windows.Visibility.Collapsed;
  34:             this.xamMonthView1.Visibility = System.Windows.Visibility.Visible;
  35:             this.xamScheduleView1.Visibility = System.Windows.Visibility.Collapsed;
  36:             break;
  37:     }
  38: }
  39: #endregion //SetScheduleMode

 

予定表表示モードにランタイム サポートを実装

予定表の表示モードを変更する方法については xamSchedule ソリューションの使用方法を参照してください。

アプリケーションの実行:

 

予定表 「SecondaryCal」 をクリックします。

 

予定表に新しい予定が追加されています。

 

予定のサイズを変更して、期間が 1 時間になるように終了時刻を変更します。

 

リソース mmateev の予定表 「MateevCal」をクリックします。
新しい予定「Blue Sheet meeting」を追加します。

 

予定を [定期的な予定] に設定します。
アクティビティ ダイアログで [定期的なアイテム] ボタンをクリックします。
定期的な予定のパターンを [毎週金曜日] に設定します。期間を [終了日未定] に設定します。

 

[定期的な予定の設定] を閉じます。

最後に追加した予定が [定期的な予定] に設定されました。

 

新しい予定がサンプル データベース “Test2008R2” の Appointments テーブルに追加されています。

 

予定表の表示モードをオーバーレイに変更します。

 

リソースの変更:
現在のリソースを Mihail Mateev に変更します。
このユーザーの予定表のみが表示されます。

 

現在のリソースを Mike Dour に変更します。

 

[すべてのユーザー] ボタンをクリックしてすべてリソースの予定表を表示し、
予定表表示モードを Separate に変更します。

 

表示タイプを Schedule View に変更します。

 

表示タイプを Month View に変更します。
すべての予定表マンスリー ビューに表示されます。

デモ アプリケーション: XamScheduleWCFService.2.zip

サンプルデータ ベース:Test2008R2.zip

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