SHOEISHA iD

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

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

WCF RIAサービスを使ったWeb連携アプリを作ろう

SilverlightでAzureに飛び出そう!

WCF RIAサービスを使ったWeb連携アプリを作ろう 第1回


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

Silverlightアプリケーションの作成

 作成したサービスとコントロールをバインドして、動作を確かめます。

データソースの作成

 Home.xamlをアクティブにし、Visual Studioメニューから[データ]-[データ ソースの表示]を行って、クライアントプロキシコードを自動生成します。FormTemplateManagerプロジェクトのPropertiesにはDataSourcesが自動生成され、[データ ソース]ペインにはTransportationFeeContextが表示されます。

図11 [データ ソースの表示]によるコードの自動生成
図11 [データ ソースの表示]によるコードの自動生成

(1)コントロールにバインド

 今回は、プロジェクト名をコントロールにバインドします。[データ ソース]ペインの[TransportationFeeContext]-[TransportationFeeEntityModel]-[ProjectName]-[ComboBox]の順に選択します(ComboBoxが無い場合[カスタマイズ]でComboBoxをチェックします)。[ProjectName]のアイコンがComboBoxのアイコンに変わったら、[申請]ボタンの下あたりにドラッグしてください。

図12 バインドするコントロールの設定
図12 バインドするコントロールの設定

(2)テストデータの表示

 データベースにサンプルのデータが入っている場合は、F5キーでプロジェクト名が表示されます。

図13 動作の確認
図13 動作の確認

コントロールのイベントを設定

 続いて、Silverlightアプリケーションの各ボタンの動作を作成します。Home.xamlの2つのボタンにイベントを設定します。XAMLエディター側でClickイベントを追加すると[<新しいイベント ハンドラー>]を選択し、イベントを作成することができます。

図14 イベントの作成
図14 イベントの作成

(1)[申請]ボタンの動作

 [申請]ボタンのクリックでは、データベース更新のサンプルとして、固定値をデータベースに登録するようにしたいと思います。

リスト00 更新処理の作成
private void Claimbutton_Click(object sender, System.Windows.RoutedEventArgs e)
{
  Web.Models.TransportationFeeDataModel insertData = new Web.Models.TransportationFeeDataModel();
  insertData.AgreementDate = System.DateTime.Parse("2011/5/20");
  insertData.ExecuteDate = System.DateTime.Parse("2011/5/30");
  insertData.InboundCost = short.Parse("270");
  insertData.InboundRoot = "東京-川口";
  insertData.Name = "鈴木";
  insertData.OutboundCost = short.Parse("270");
  insertData.OutboundRoot = "川口-東京";
  insertData.ProjectName = "CodeZine Project";
  insertData.TemporaryCost = short.Parse("0");
  ((System.Windows.Controls.DomainDataSourceView)this.grid1.DataContext).Add(insertData);
  this.transportationFeeDataModelDomainDataSource.SubmitChanges();
}

(2)動作の確認

 F5キーで実行し、申請ボタンをクリックしてください。プロジェクト名が「CodeZine Project」に変わったら更新されています。

図15 動作確認
図15 動作確認

(3)データベースの確認

 Visual Studioのサーバーエクスプローラーでテーブルデータを表示しデータが追加されていることを確認してください。

図16 データベースの確認
図16 データベースの確認

まとめ

 今回のサンプルアプリケーションは、レイヤー分割に主眼におき、ビジネスロジックを作成していません。

 次回は、今回作成したサンプルアプリケーションをAzureに移行する手順を解説します。Azureに移行するデータベースは、モデルを通してモデルからSQL Azureのデータベースへ、SQL AzureのデータベースからASP.NETアプリケーションが使用するEntity Data Modelへと変換していきます。この手順により、コードレスでAzure移行を行います。この作業を通してAzureアプリケーションのレイヤー構成を分析することができます。

図17 サンプルアプリケーションのレイヤー構成
図17 サンプルアプリケーションのレイヤー構成

 アプリケーションのレイヤー設計をする際に、物理的な配置によるレイヤーの分離は、最もメンテナンスの良い分離です。しかしながら、Azureアプリケーションに限らず、N層アプリケーションでは完全な分離が難しいケースがあります。モデルを先に設計、実装することで工数削減とMVCの実装ができることについても解説します。

修正履歴

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

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

山田 祥寛(ヤマダ ヨシヒロ)

静岡県榛原町生まれ。一橋大学経済学部卒業後、NECにてシステム企画業務に携わるが、2003年4月に念願かなってフリーライターに転身。Microsoft MVP for Visual Studio and Development Technologies。執筆コミュニティ「WINGSプロジェクト」代表。主な著書に「独習シリーズ(Java・C#・Python・PHP・Ruby・JSP&サーブレットなど)」「速習シリーズ(ASP.NET Core・Vue.js・React・TypeScript・ECMAScript、Laravelなど)」「改訂3版JavaScript本格入門」「これからはじめるReact実践入門」「はじめてのAndroidアプリ開発 Kotlin編 」他、著書多数

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

WINGSプロジェクト 高尾 哲朗(タカオ テツロウ)

WINGSプロジェクトについて>有限会社 WINGSプロジェクトが運営する、テクニカル執筆コミュニティ(代表 山田祥寛)。主にWeb開発分野の書籍/記事執筆、翻訳、講演等を幅広く手がける。2018年11月時点での登録メンバは55名で、現在も執筆メンバを募集中。興味のある方は、どしどし応募頂きたい。著書記事多数。 RSS X: @WingsPro_info(公式)、@WingsPro_info/wings(メンバーリスト) Facebook

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

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

この記事をシェア

  • X ポスト
  • このエントリーをはてなブックマークに追加
CodeZine(コードジン)
https://codezine.jp/article/detail/5921 2011/06/07 14:20

おすすめ

アクセスランキング

アクセスランキング

イベント

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

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

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

メールバックナンバー

アクセスランキング

アクセスランキング