Silverlight

Silverlight 3 新機能

はなおかじった — Wed, 25 Mar 2009 22:17:00 GMT

ネタもと：Get Started : The Official Microsoft Silverlight Site

以下、「WHAT'S NEW IN SILVERLIGHT BETA?」を翻訳。翻訳内容については正確性を保証しない。

Visual Studio および Expression Blend によって完全にサポートされた、Silverlight 3 の新機能ハイライトです。主要なメディアの拡張、ウェブブラウザのサポートなしにウェブアプリケーションをデスクトップで動作させる、3D-グラフィックをサポートする重要な図形処理の改良、GPU アクセサレーションと H.264 ビデオのサポート、そしてたくさんの RIA 開発生産性を改善する機能。同じく、全ての .NET 開発ツールを統合するために、Visual Studio 2010 は、編集可能な対話型 Silverlight デザイナーをサポートするでしょう。では、Silverlight 3の新機能の数々です。

より品質の高いビデオとオーディオのサポート
H.264 アドバンスドオーディオコーディング（AAC）のネイティブサポートと、ライブおよび音デマンド IIS7 スムーズストリーミング、Full-FD（720p+）再生、そして拡張可能なデコーダーパイプラインをサポートすることで、Silverlight 3はリッチ、フル-スクリーン、途切れのないメディアエクスペリエンスをデスクトップに提供します。新しく、また拡張された Silverlight 3のメディア機能は、次の通りです。
- ライブ、またオンデマンドの、HD（720p+）スムーズストリーミング
  IIS メディアサービス（旧 IIS メディアパック）、CPU やネットワークの状態をダイナミックに検出し、シームレスに切り替えることによるスムーズなストリーミング配信を可能にする、統合された HTTP メディア配信プラットフォームを提供します。
- フォーマット
  VC-1/WMA のネイティブサポートに加え、MPEG4 をベースとする H.264/AAC オーディオをネイティブサポートし、ハイクオリティーなコンテンツを、様々なコンピューターやデバイスに対して配信することを可能にします。
- フル-スクリーンでの HD 再生
  GPU によるハードウェアアクセサレーションによって、フル-スクリーンでの HD（720p+）再生を可能にします。
- メディアフォーマットの拡張サポート
  RAW AV のパイプラインにより、Silverlight はサードパーティーによる様々なコーデックサポートを可能にします。オーディオとビデオは、ネイティブにサポートするコーデックのみでなく、実行時に外部でデコードされ、Silverlight 上でレンダリングされます。
- 産業主導型コンテンツ保護
  Silverlight DRM は、PlayReady コンテンツ保護によって、AES 暗号化または Windows メディア DRM を使って保護されたブラウザー内エクスペリエンスを可能にします。
より豊かな経験の強化
Silverlight 3では、デザイナーと開発者次世代のウェブビジュアルを作成していただくため、新しい3D図形処理、アニメーション処理、ハードウェアアクセサレーション、テキスト処理の改良を行いました。これらの機能は、以下の通りです。
- 大局的3Dグラフィクス
  Silverlight 3は、開発者とデザイナーに3次元プレーンを提供します。利用者は、追加コードを書くことなしに、コンテンツを回転、拡大縮小させることができます。その他の変形や効果が含まれます。
- ピクセルシェーダー
  これらのソフトウェアによる効果は、ブルーアやドロップシャドウを含みます。さらに、効果を追加することが可能です。効果は、どんなグラフィックコンテンツにでも適用することができます。例えば、ボタンについて、ボタンを押した際にドロップ陰影効果を使うことで、変更でいるように表現することが可能です。
- ビットマップキャッシィング
  Silverlight 3では、ビットマップの中にベクトル図形やコントロールをキャッシュすることにより、アプリケーションのレンダリング性能を劇的に改善します。この機能は、背景や内部の外観の変化に影響されないでスケーリングを行うコンテンツに対して有効です。
- 新しいビットマップ API
  Silverlight 3では、開発者はビットマップにピクセルを描画することができます。写真を赤目修正したり、スキャンしたドキュメントを編集したり、スクリーン上のエレメントからビットマップにキャッシュされる特別な効果を作成したりすることができます。
- アプリケーションテーマのサポート
  開発者は、アプリケーションにスタイルを適用し、実行時に変更することができます。さらに、スタイルを階層化することができます。
- アニメーション効果
  Silverlight 3では、跳躍やバウンドのような新しい効果を提供します。これらはアニメーションを、よりいっそう自然にします。開発者は、数学的関数を用いて新しいアニメーションを開発することができます。
- コントロールのスキン拡張
  Silverlight 3では、コントロールのセットを外部に保持することによって、スキン機能を提供します。これは、スタイル、コントロールスキンをアプリケーション間で共有できることを意味します。
- テキスト描画の改良と、フォントのサポート
  Silverlight 3では、いっそう効率的な表現、および敏速なアニメーションテキストを実現しました。ローカルなフォントを使用することで、アプリケーションの読み込みスピードもアップします。
リッチなインターネットアプリケーション生産性の進歩
新機能は、以下の通りです。
- 60以上のコントロールとソースコード
  Silverlight 3は、60を超えるハイクオリティで、スキン化されたチャートやメディアのようなコントロール、dock や viewbox のような新しいレイアウトコンテナー、オートコンプリートやツリービュー、データグリッドのようなコントロールでいっぱいです。コントロールは、9つの専門的なデザインされたテーマを伴います。そして、修正してリコンパイルするか、あるいは提供されるまま使用することができるソースコードが付属します。その他、複数選択可能な ListBox コントロール、ファイル出力を簡単にする、ファイル保存ダイアログがあります。また、マルチページアプリケーションをサポートし、そのためのナビゲーターが付属します。
- ディープリンク
  Silverlight 3では、RIA でブックマーク可能な Deep Link をサポートします。
- SEO 対策
  Silverlight 3は、RIA でしばしば問題とされる、SEO 対策を可能にします。サーバー上のビジネスオブジェクトを利用することで、ASP.NET コントロールおよびサイトマップにより、HTML 中に簡単かつ自動的に RIA コンテンツがコピーされます。
- 拡張されたデータサポート
  - エレメント間バインディング
    UI デザイナーは、より説得力のある UI 経験のために、ふたつの UI プロパティをバインドすることができます。Silverlight では、XAML によって、CLR オブジェクトと UI コンポーネントのプロパティをバインドすることができます。例えば、スライダーをメディアプレイヤーのボリュームコントロールにバインドすることができます。
  - データフォーム コントロールは、データのページング、交信、検証、そしてフィールドの配置をサポートする機能を提供します。
  - データ検証の新しい機能は、正しくない入力値を自動的に見つけて、そして組み込まれた検証コントロールによってユーザーに警告を発することです。
  - ビジネスオブジェクトのサポートにより、クライアントとサーバーの両方で、N 階層データをサポートします。追加されたサポートにより、データを扱ってロード、ソート、フィルターそしてページングをすることはたやすくなるでしょう。新しく含まれることになった CollectionView は、サーバーサイドにおける合成操作を行います。新しい .NET RIA サービスが、これらの機能を提供します。
- パフォーマンスの改善
  - アプリケーションライブラリキャッシュは、描画性能を改善するためにクライアントでフレームワークをキャッシュして、アプリケーションのサイズを小さくします。
  - ディープズームの拡張によって、ユーザーはズーミングのための大きなイメージの集合を停滞なく操作することができます。
  - バイナリ XML は、通信をサーバーで圧縮して、データの交換スピードを上げます。
  - ローカル接続という機能は、クライアントサイドの2つの Silverlight アプリケーションが、サーバーへのラウンドトリップなしに互いに通信することを可能にします。例えば、ひとつはチャート、ひとつはデータグリッドを表示して、互いに通信しあうことができます。
拡張されたアクセシビリティ
Silverlight 3では、オペレーティングシステムが提供するハイコントラスト配色への変更を可能にして、視覚障害がある人が判読性を高める方法を用意しています。
ブラウザーの外で実行
Silverlight 3の新しいブラウザー外エクスペリエンスは、気に入った Silverlight アプリケーションを PC や Mac のデスクトップ、あるいはスタートメニューに配置して、追加のランタイムやブラウザープラグインをダウンロードすることなしに実行することを可能にします。さらに新しいエクスペリエンスは、コンピューターがインターネットに接続されているか否かにかかわらず、Silverlight アプリケーションを実行することを可能にします。伝統的な Web エクスペリエンスからの劇的な改良点です。次の機能が含まれます。
- ブラウザー外での実行が可能になったことで、Silverlight アプリケーションは軽快なウェブコンパニオンとして、デスクトップにインストールされ、そして実行することができます。
- デスクトップショートカットと、スタートメニューのサポートをしたことで、PC でも Mac でも、スタートメニューやアプリケーションフォルダーにリンクを保存して、ワンクリックで実行することができます。
- セーフアンドセキュアを実現するため、.NET フレームワークのセキュリティ機能を強化しました。Silverlight アプリケーションは分離ストレージを持つ安全な三度ボックスで実行されます。これらのアプリケーションは、伝統的なウェブアプリケーションとほぼ同じセキュリティ制約事項を持ちます。しかし、ユーザー操作を中断しないように、セキュリティ警告やプロンプトを表示しないように信頼される事があります。
- スムーズなインストールを実現するために、Silverlight アプリケーションはローカルキャッシュに格納されます。そして、実行には余分な権限を必要としません。
- 自動更新機能により、Silverlight アプリケーションは起動されると、サーバーに新しいバージョンがないか検索します。新しいバージョンがある場合、自動的に更新されます。
- インターネット接続の検出機能により、Silverlight アプリケーションはインターネットに接続されているかどうかを検出します。もし接続がたたれている場合、接続が復旧するまで、ユーザーのデータをキャッシュするなど、接続状態にインテリジェントに対応します。

[Silverlight 奮戦記]コントロールの大きさをブラウザに追従させる

はなおかじった — Fri, 12 Dec 2008 23:14:00 GMT

メールにて、質問をいただきました。タイトルのように、・・・あれ？逆だ。ブラウザのサイズ変更にコントロールを追従させる、だ。

私も知りません。

ではつまらないので、調べます。

まず、ドキュメント。CHM なドキュメントには、クラスライブラリの説明だけでなく、技術背景なども書かれています。目次でいうと、「Silverlight の概要」「はじめに」のあたりです。このあたりは、時間を作って一度目を通しておくことを勧めます。で、「ビジュアルデザイン」→「Silverlight のレイアウトシステム」のあたりが該当しそうです。読んでいくと、「全画面表示サポート」の中に、Content.ActualWidth プロパティへの参照があります。これっぽいです。

で、「Content.ActualWidth プロパティ」の説明を読んでいくと、表示が完了した直後に Resized イベントが発生し、それ以降に ActualWidth プロパティで現在の実際の横幅が取れるとあります。

じゃぁ、ってんで、Resized イベントのハンドラを追加してみます。すると、Page クラスについては SizeChanged イベントが発生するようです。なので、こっちをハンドルします。すると、SizeChangedEventArgs クラスが引数として付いてきます。この中の NewSize プロパティと PreviousSize プロパティで、変更前後の…書く順番間違えているけど…サイズが参照できます。なので、これを表示させます。

SizeChanged イベントが、一度しか発生しません。

どうも、Silverlight plug-in を呼び出している object 要素に指定した width, height 属性のために、サイズが変化しないようです。ですから、このサイズの指定を絶対値からパーセンテージに変更してみます。

やはり、一度しか発生しません。

よく見ると、Page.xaml に Width, Height プロパティを指定しています。これの説明を見ると、"Auto" という値も指定できるということです。なので、"Auto" にしてみます。

デザイナからコントロールが消えます。。。

ん。。。まぁ、そうかも、しれない、ね。。。とりあえず、これでやってみよう。

無事、サイズの変更がわかりました。つまり、ブラウザのサイズ変更に object 要素が追従し、object 要素の変更に Silverlight アプリケーションも追従するようになりました。

しかし、これではデザインに支障が出ます。どうしましょう？手っ取り早いのは、オブジェクト生成の時に "Auto" を指定することですが、XAML には "Auto" と記述できますが（シリアル化解除で適切に変換してくれているのだろう）、Double に対して "Auto" という文字列は指定できません。困った。つらつら眺めていると、Height および Width の既定値は、0 ではなく Double.NaN です。と書いてあります。これにしてみましょう。まず、Page.xaml の Width, Height に適当な数値を設定します。コンストラクタの InitializeComponent() 呼び出しの後、this.Width = double.NaN; と、this.Height = double.NaN; を追加します。そして実行。

うまくいきました。

やっぱり、読むならちゃんと読む。斜め読みはいかんね。。。

【業務連絡】XAP ファイルのダウンロード許可を

はなおかじった — Wed, 10 Dec 2008 23:14:00 GMT

業務連絡。

XAP ファイルのダウンロードを許可してくださいませ。

[Silverlight 奮戦記]入れ替え可能な絵を表示する

はなおかじった — Tue, 09 Dec 2008 22:58:00 GMT

会社の、新技術キャッチアッププロジェクトで調べたことをお送りしてきた Silverlight 奮戦記ですが、このたび、成果発表会が行われることになりました。

発表時間はごくわずかなので、デモを中心に「こんなことが出来ます」を、Google Web Toolkit、Adobe Integrated Runtime, Silverlight で行うことになったのですが、Silverlight で担当するのが、以前に Windows Application として作成した、「任意の絵をバックグラウンドにして設備管理をする」アプリケーションの、「任意の絵をバックグラウンドにする」の部分となりました！！わーわーわー！！って、喜んでる場合じゃねーよorz

Windows Application の場合、ローカルにあるファイルに、ローカルアプリケーションがアクセスすることになります。何も難しいことはありません。

Silverlight の場合、ローカルにあるファイルにアクセスできないはずなので、一旦 ASP.NET 等でサーバーにアップロードし、Silverlight アプリケーションがダウンロードして使用する、という形になります。

ということは、Silverlight 単体では出来ない、ということです。ASP.NET 他、他の Web Application とのコンビネーションになります。

まずは、開発環境から。β1の頃に書いたけど、RTM しているので、RTM バージョンということで。

Visual Studio 2008 Standard Edition 以上を用意します。それに、Service Pack 1 をあてます。場合によっては、SP1 準備ツールとかいうものを適用しておく必要があるかもしれません。SP1 をあてたら、インテリセンスが英語になってしまう不具合があるので、それを解消するパッチをあてます。

次、Silverlight 本体。「開発環境なんざいらねぇぜ。テキストエディタとコンパイラで作ってやるぜ！」という強者は、Visual Studio も要りません。Silverlight SDK のみを。普通の方は、Visual Studio 2008 SP1 用 Silverlight Tools を、ダウンロードします。

また、Silverlight2 のドキュメントが、CHM 形式でダウンロードできます。一応、Visual Studio の Document Explorer にインテグレートされますが、[F1] 等で参照しようとすると、高確率で WPF のヘルプが出てきます。Silverlight の CHM ファイルを検索すれば、Silverlight のものしか出てきませんので、検索するときには CHM ファイルのほうが便利だと思います。

MSDN ライブラリには、オンラインのドキュメントも、用意されています。

以上、環境整備終わり。

それではまず、下準備。これ、とっても重要。

上に「Silverlight の場合、ローカルにあるファイルにアクセスできないはず」とか書いたけど、そうなんだっけ？ってことで、「silverlight file upload」で検索すると、CodePlex に Silverlight File Upload というコントロールが見つかった。じゃぁ、こいつはどうやってローカルファイルにアクセスしているんだろう？ってんで MSDN を調べると、OpenFileDialog クラスが見つかった。これでローカルファイルにアクセスすることが出来る。

では、画像の表示。Windows Application では、Bitmap クラスを使用する。Silverlight ではどうかというと、そもそも System.Drawing 名前空間がない。では、他には？と探す…のは面倒なので、CHM ファイルで「Bitmap」を検索する。すると、Syste.Windows.Interop 名前空間に、HostingRenderTargetBitmap クラスというのが見つかる。でもこれにはアプリケーションコードでこのメンバを使用すると、MethodAccessException 例外がスローされます。などと書いてあるので、使えない。次、次。「目次」の「ビジュアルデザイン」を開くと、「グラフィクス」という項目がある。ここの中に「イメージング」があるので、これを開く。すると、イメージを描画するには、Image オブジェクトまたは ImageBrush オブジェクトを使用します。とある。Image クラスの説明には、BitmapImage クラスへのリンクもある。このふたつのクラスについて、調べる。すると、Image クラスはインターネットの向こうからしかイメージを取得できない。BitmapImage クラスも同じ。・・・困った。せっかく、ローカルファイルへのパスがわかっても、そこから画像オブジェクトを作成することが出来ない。分離ストレージに放り込んで、そこからストリームで画像を作成してやろうかと思っていたのだけれど、メモリ上で画像を扱えないのではこの方法は使えない。

困った。。。

じゃぁ、あれだ。他のウェブアプリケーションでサーバーにファイルをアップロードして、そいつを特定の名前で XAP ファイルと同じディレクトリにおいて、Silverlight からはそのファイルを参照すればいい、ってことですね。

決まったので、次、プロジェクトを作成する。

Visual Studio 2008 を起動する。新しいプロジェクトを作成する。とりあえず、ソリューション名を「SilverlightDemo」、プロジェクト名を「BackgroundMap」とする。

すると、Silverlight アプリケーションをホストするものをどうするか、聞いてくる。先にも書いたように、どうにかして、サーバーにファイルをアップロードしなければならない。なので、ウェブアプリケーションを作成することにする。すると、「BackgroundMap.Web」という名前の ASP.NET アプリケーションが作成される。

ちょい見すると、「BackgroundMapTestPage.aspx」というページが作られている。この中に、Silverlight をホストするコードが書かれている。しかし、このページにはビハインドコードがない。そこで、ホストするためのコードを Default.aspx にコピーして、デバッグのスタートページも Default.aspx に変更する。

コピーした、Silverlight をホストするコード
<%@ Register Assembly="System.Web.Silverlight"
    Namespace="System.Web.UI.SilverlightControls" TagPrefix="asp" %>
（飛ばして）
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <div style="height: 100%;">
        <asp:Silverlight ID="Xaml1" runat="server" Source="~/ClientBin/BackgroundMap.xap"
            MinimumVersion="2.0.31005.0" Width="100%" Height="100%" />
    </div>

さて、サーバーにファイルをアップロードして、どこかに保存しておくコードを作る。

FileUpload コントロールと、ポストバックを発生させるための Button コントロール、エラーが発生したときにメッセージを表示する Label コントロールを追加する。

FileUpload コントロールの説明を参照すると、HasFile プロパティというのがある。これで、ファイルを指定せずに「更新」ボタンを押したときの判定が出来る。FileBytes プロパティで、アップロードされたファイルのバイト配列が取得できる。このバイト配列を元にメモリストリームを作り、メモリストリームから Bitmap オブジェクトを作成、そのオブジェクトの Save メソッドで、ファイルに保存してやればいいだろう。と、大まかに流れを組み立てる。

では、「画像ファイル」として、「画像ではないファイル」を指定されたらどうするか。Bitmap クラスのコンストラクタを見ると、ArgumentException 例外を発生させるらしい。とりあえず、これだけを受けて、検査例外に読み替えてやればいいだろう。

ClientBin へのパスは、どうやって取得する？HttpRequest クラスに、Default.aspx への仮想パス名を格納したプロパティがあるはず。そこから MapPath メソッドで物理パス名に変換、System.IO.Path クラスの GetDirectoryName メソッドでパスに変換して、ClientBin を Combine してやればいいだろう。

ってことで、コード。

アップロードされたファイルを保存する
protected void Page_Load(object sender, EventArgs e) {
    Label1.Text = "";
    if (IsPostBack == false) {
        // 初期表示なのでファイルはないはず
        return;
    }
    if (this.FileUpload1.HasFile == false) {
        // ファイルが添付されていないので、以下の処理は必要なし
        return;
    }
    try {
        SaveBitmapFile();
    } catch (ArgumentException) {
        // 指定されたファイルが画像ではないと思われる。
        // 例外は握りつぶす。
        Label1.Text = "指定されたファイルは、画像ではないようです。画像を指定してください。";
    }
}
private void SaveBitmapFile() {
    // アップロードされたファイルをメモリ ストリームに取り込む。
    using (MemoryStream memStrm = new MemoryStream(this.FileUpload1.FileBytes, false)) {
        // メモリ ストリームから、ビットマップに変換する。
        using (Bitmap map = new Bitmap(memStrm)) {
            // App_Data へ、
            string saveFile = System.IO.Path.Combine(
                System.IO.Path.GetDirectoryName(
                this.MapPath(this.Request.FilePath)), @"ClientBin\MapData.png");
            // PNG 形式で保存する。
            map.Save(saveFile, System.Drawing.Imaging.ImageFormat.Png);
        }
    }
}

次、Silverlight の方。

なんも無し。Grid の中に Image を置くだけ。

Page.xaml
<Image x:Name="imgBackground" Stretch="Uniform" Source="MapData.png" />

え？「置いたイメージの大小によって、Image オブジェクトのサイズを変えろ」ですって？

余力があれば、チャレンジします。。。

おっと、最初に実行する前に、何でもいいので MapData.png って名前の画像ファイルを置いておいてくださいね。でないと、実行時にエラーになりますから。

ちょっと悔しい Silverlight 2 の記事

はなおかじった — Fri, 28 Nov 2008 23:06:00 GMT

Silverlight 2の業務アプリケーションへの活用経由、第1回 Silverlight 2の紹介（Silverlight 2の業務アプリケーションへの活用）

左の「日記カテゴリ」に、「Silverlight」があります。これは、業務技術先行勉強会で勉強したことをつづっていたわけですが、年末あたりに「成果発表会」？をやるらしく、「まとめろ」という指令が下りました。

んで、まとめていたのですが、できあがった資料と似たことが書いてある。

ちょこっと修正して、わんくまか囲む会で使ってやろうと思っていたので、悔しい、と感じた。

[Silverlight 奮戦記] (5) 折れ線グラフを作る

はなおかじった — Wed, 30 Jul 2008 21:05:00 GMT

前回のあらすじ。XML で記述されているファイルを取り出したらβ2が公開されて、仕様が変わっちゃってて困ったよ。

なんか、Silverlight でなくてもええやん？？って感じなんだけど、Silverlight なのっ！！

前回、XML ファイルからクラス化した情報を、グラフにする。検索すればコンポーネントが見つかるのだけど、あえてそれらは使わない。

「グラフにする」とは、どういう事か、というところを考える。

線を引けば良いわけだけど、じゃぁ、どうやって引くの？データの個数だけ、横に区切りがある。値の最大値にあわせて、縦にもいくつか区切りがある。その区切りにあわせてプロットすればよい。

いうのは簡単だぁ！

まず、横。グラフを描画する範囲。これを便宜上、「キャンバス」と呼ぶことにします。キャンバスの横幅（ピクセル数）をデータの個数で割れば、データとデータの間に何ピクセル置けばよいか、求まります。

同じく縦も、キャンバスの縦幅（ピクセル数）を、データの最大値で割れば、データ1単位あたり、何ピクセル取ればよいか求まります。

こうして求めたものを、単位ピクセル数とします。

データ配列のｎ番目に横の単位ピクセル数を掛け、値に縦の単位ピクセル数を掛けると、座標が求まります。

ところで、「値」ってどれ？

とりあえず、「累積稼働時間」としたけど、他の線を重ねたりするかもしれない。そんなわけで、インターフェイスを定義してみた。


public interface IGraphConvertible
{
    double Value {
        get;
    }
}

で、第3回では List<Log> としたのだけれど、これを、このインターフェイスのリストにしてみる。すると、「インターフェイスは実体化できません」と怒られた。そりゃそうか。で、abstruct クラスを作ってみた。


public abstract class GraphConvertibleObject : IGraphConvertible
{
    #region IGraphConvertible メンバ

    public abstract double Value {
        get;
    }

    #endregion
}

仮想クラスも実体化できないからなぁ。最初っから virtual なメソッドにすればいいんじゃね？とか思いながら動かすと、動いた。・・・ふ～ん。まぁ、いいや。

で、コレクションが変更になる。


public class GraphConvertibleCollection
    : System.Collections.Generic.List<GraphConvertibleObject>
{

}

当然、Log クラスも変更。


class Log
{
    public Log() {
        List = new GraphConvertibleCollection();
    }

    [XmlArrayItem(typeof(Warning))]
    public GraphConvertibleCollection List() {
        get;
        set;
    }
}

おっと、肝心の Warning クラスを忘れていた。


class Warning : GraphConvertibleObject
{
    [XmlAttruibute]
    public Int64 TotalRuntime() {
        get;
        set;
    }

    [XmlAttribute]
    public Int64 ErrorCode() {
        get;
        set;
    }

    [XmlText]
    public string LogMessage() {
        get;
        set;
    }

    public override double Value {
        get { return this.TotalRuntime; }
    }
}

それでは、グラフ化…というか、折れ線化するところ。


static public PointCollection NormalSeriesLine(
    GraphConvertibleCollection dataCollection, Size canvasSize, Size divideCount) {
    // 1
    PointCollection points = new PointCollection();
    // 2
    double stepX, stepY;
    if (divideCount.Width == 0) {
        stepX = canvasSize.Width / (double)dataCollection.Count;
    } else {
        stepX = canvasSize.Width / (double)divideCount.Width;
    }
    // 3
    if (divideCount.Height == 0) {
        // 4
        double maxY = 0;
        foreach (IGraphConvertible w in dataCollection) {
            if (w.Value > maxY) {
                maxY = w.Value;
            }
        }
        stepY = canvasSize.Height / (double)maxY;
    } else {
        stepY = canvasSize.Height / (double)divideCount.Height;
    }
    // 5
    points.Add(new Point(0, canvasSize.Height));
    // 6
    int cnt = 0;
    foreach (IGraphConvertible w in dataCollection) {
        long x = Convert.ToInt32(Math.Floor(++cnt * stepX));
        long y = Convert.ToInt32(Math.Floor(w.Value * stepY));
        // 7
        y = Convert.ToInt32(canvasSize.Height - y);
        // 8
        points.Add(new Point(x, y));
    }
    // 9
    return points;
}

引数は、dataCollection がデータのリスト。canvasSize は、描画範囲。divideCount は、それを縦横それぞれいくつに分割するか。複数の線を重ねるとき、あるデータ集団は10個あるけど、あるデータ集団は8個しかデータがないかもしれない。そもそも、今回もｎ回の故障履歴を元に、ｎ＋１回目の故障がどれくらいのタイミングで発生するかをグラフで見るものだから、故障回数とグラフの右端は等しいわけではない。そのため、別個に指定できるようにした。

1...PolyLine を返さずに PointCollection にしたのは、それぞれの頂点がアニメーションしたらおもしろいと思いません？後で変更できるように、とりあえず、PointCollection にしておく。

2...横軸の単位ピクセル数を求める処理。divideCount が0なら、データ数を用いることにする。

3...縦軸の単位ピクセル数を求める処理。

4...縦軸の場合、「データの数」なんてわかりやすいものはないので、全データをなめて最大値を求める。最小値は0なの。0以下になる場合は自分で考えよう。

5...これは、不要かも。(0, 0) の点を追加。

6...それぞれのデータを、座標に変換する処理。

7...普通、見慣れているグラフは上に行くほど Y の値が大きくなります。しかし、コンピュータの座標系は、左上が (0, 0) です。そのため、Y = 0 の線を軸に、反転させてやる必要があります。その処理。Matrix とかいうのがあって、それを指定すると一点一点反転させなくてもいいのだけれど、字を描いたとき、字まで反転しちゃうので、却下。

8...PointCollection に追加して。

9...返しておしまい。

おまけ

多角形をアニメーションさせる方法。元ネタ→Animating A Polygon?（英語）

PolyLine じゃ無理のようで、パスになりました。パスについては、[Silverlight 奮戦記] (2) 線を描くの回をご覧ください。


{
    Storyboard lineStory = new Storyboard();
    foreach (LineSegment line in figure.Segments) {
    PointAnimation anime = CreatePointAnimation(new Point(line.Point.X, canvas1.ActualHeight), line.Point);
        lineStory.Children.Add(anime);
        Storyboard.SetTarget(anime, line);
        Storyboard.SetTargetProperty(anime, new PropertyPath("Point"));
    }
    LayoutRoot.Resources.Add("lineStory", lineStory);
    lineStory.Begin();
}
private PointAnimation CreatePointAnimation(Point from, Point to) {
    PointAnimation anime = new PointAnimation();
    anime.AutoReverse = false;
    anime.BeginTime = new TimeSpan(1);
    anime.From = from;
    anime.To = to;
    anime.RepeatBehavior = new RepeatBehavior(1.0);
    anime.Duration = new Duration(TimeSpan.FromSeconds(3.0));
    return anime;
}

[Silverlight 奮戦記] (3,4) ファイルを読む β2 対応版

はなおかじった — Thu, 12 Jun 2008 21:39:00 GMT

Silverlight 2 β2 で、WebHttpRequest や WebClient が、本当に非同期通信になりました。

うん。なんかね、「非同期通信にしか対応していないよ」と書いてあったのに、Silverlight 上ではスレッドが1つしかなかったのね。それが、UI Thread と、Communication Thread に分かれたの。

はい、何が起こるかわかるよね。Communication Thread で UI Elements を操作しようとすると、例外が発生しますorz...

それと、Uri 型だった WebClient.BaseAddress が、ただの文字列になりましたorz...

そんなわけで、第3回と、第4回のコードを書き直し。

まず、SyncronizationContect を用意します。その名の通り、同期するためのコンテキストです。こいつに、UI Thread を参照させます。そして、通信を受け取った後、UI Thread で通信の内容を転写します。

元ネタは、開発者さんのブログ。

では、書き直したコード。


// 同期コンテキスト
SynchronizationContext syncContext;

public Page() {
    InitializeComponent();
    this.Loaded += new RoutedEventHandler(Page_Loaded);
}

void Page_Loaded(object sender, RoutedEventArgs e) {
    // 現在のコンテキストを参照させておく
    syncContext = SynchronizationContext.Current;
    WebClient client = new WebClient();
    // ただの文字列なので、Uri に変換
    Uri assmblUri = new Uri(client.BaseAddress);
    // β1ではパスだったのに、.xap に変わっているので、パスに変換
    string path = System.IO.Path.GetDirectoryName(assmblUri.LocalPath).Replace('\\', '/');
    // スキーマやホストをつなげて URI にできる文字列にする
    string uri = String.Format("{0}://{1}{2}/warnigLog.xml"
        , assmblUri.Scheme, assmblUri.Host, path, assmblUri.AbsolutePath);
    textBox1.Text = uri;
    Uri logUri = new Uri(uri);
    HttpWebRequest request = (HttpWebRequest)HttpWebRequest.Create(logUri);
    request.BeginGetResponse(new AsyncCallback(GetWarningLog), request);
}

private void GetWarningLog(IAsyncResult result) {
    HttpWebRequest request = (HttpWebRequest)result.AsyncState;
    HttpWebResponse response = (HttpWebResponse)request.EndGetResponse(result);
    // 同期コンテキストから呼び出す
    syncContext.Post(SynchronizedResponse, response);
}

private void SynchronizedResponse(object state) {
    HttpWebResponse response = state as HttpWebResponse;
    Stream stream = response.GetResponseStream();
    try {
        XmlSerializer serializer = new XmlSerializer(typeof(WarningLog));
        log = (WarningLog)serializer.Deserialize(stream);

        textBox1.Text += ":resieved\n";
        foreach (Warning w in log.WarningList) {
            textBox1.Text += (w.ToString() + "\n");
        }
    } catch (Exception ex) {
        textBox1.Text = ex.ToString();
    }
}

Silverlight 2 Beta 2

はなおかじった — Tue, 10 Jun 2008 21:19:00 GMT

Silverlight 2 Beta 2 SDK が公開されています。→Silverlight 2 SDKのBeta2が公開されています。（ひろえむの日々是勉強）

インストールするときは、アドオンや SDK の Beta1 をアンインストールしてから、インストーラを起動します。

これだけなら、ひろえむさんがリンクしてくださっているのでブログを書いたりしません。SDK Beta 2 では、ドキュメントが日本語化されています！beta 1 相当だけど。

Visual Studio ヘルプへのインテグレートの仕方は、こちら！。

あ...ば、ば、ば、ばっかヤローーー！！Beta 2 に Beta 1 のドキュメントつけてどーする！！

追加になったクラスのドキュメントが、全く見あたりません。

一部のクラスに、メンバの型が変更になっているものがあります。ドキュメントは、古い型のままです。

日本語化の努力は買う。賞賛する。でもね、それでもね。。。これは、ちょっと、どうよ？？

[Silverlight 奮戦記] (4) XML シリアル化とシリアル化解除

はなおかじった — Fri, 06 Jun 2008 23:37:00 GMT

前回のあらすじ。HTTP ベースサービスを利用して、XML ファイルを持ってくる、と決めた。

今回の目標。読み込む対象を決定する。

どんなデータが必要か、or あればよいかを考える。

まず、故障回数。まぁ、ログの件数を数えれば件数はできるから、いっか。累積稼働時間。これは必要。エラーコード。まぁ、必要。エラー内容を分類するかもしれないし。それと、メッセージ内容。要らないかもしれないけど、ログだし。

とりあえず、そんなところで。XML だし、後から追加できるから。

ということで、ログ1件のクラスは、こんな感じ。


class Warning
{
    [XmlAttruibute]
    public Int64 TotalRuntime() {
        get;
        set;
    }

    [XmlAttribute]
    public Int64 ErrorCode() {
        get;
        set;
    }

    [XmlText]
    public string LogMessage() {
        get;
        set;
    }
}

<Warning TotalRuntime="Int64" ErrorCode="Int64">LogMessage</Warning>

そして、ログファイルは、この1件のログがたくさん集まっているわけだから、XML が、こんな感じ。

<?xml version="1.0" encoding="utf-8" ?>
<Log>
    <List>
        <Warning TotalRuntime="Int64" ErrorCode="Int64">LogMessage</Warning>
    </List>
</Log>

このファイルのためのクラスは、次のようになる。


class LogList : List<Log>
{
    // シリアル化のために必要
    // 空クラス
}

class Log
{
    public Log() {
        List = new LogList();
    }

    [XmlArrayItem(typeof(Warning))]
    public LogList List() {
        get;
        set;
    }
}

あ、あっさりできた...

ここの注意点は、「[Xmlほにゃらら]」という、属性ですかね。XML の、要素なのか、属性なのか、内容なのか。それから、どんな型の配列なのか。その辺がきっちり押さえてあれば、よろしいかと。

それと、クラスに「[Serialize]」属性をつけなくて良いみたい。1.x の頃は必要だったけど、2.0 以降のどこかで不要になった？それとも、Silverlight では不要？

あれ？そうすると、LogList クラスも要らないかな？2.0 では、ジェネリックをシリアル化できなかったのだけど。。。

クラスの設計ができたので、それに沿った XML ファイルを作る。そして、配置する。作るのが面倒なときは、このクラスに適当なデータを放り込んで、シリアル化して作る。先にシリアル化しておくと、本当に望むとおりになっているか、確認もできる。

次、GetWarningLog メソッドの実装。

サンプルコードに、ストリームを取り出すところまで載っている。なので、真似すればいい。最後に、出力のところだけ、こっちに都合が良いように変えればいい、と。


#using System.Net;
#using System.IO;
#using System.Xml.Serialization;

private void GetWarningLog(IAsyncResult result) {
    HttpWebRequest request = (HttpWebRequest)result.AsyncState;
    HttpWebResponse response = (HttpWebResponse)request.EndGetResponse(result);
    Stream stream = response.GetResponseStream();
    try {
        XmlSerializer serializer = new XmlSerializer(typeof(WarningLog));
        WarningLog log = (WarningLog)serializer.Deserialize(stream);
        textBox1.Text += ":resieved\n";
        foreach (Warning w in log.WarningList) {
            textBox1.Text += (w.ToString() + "\n");
        }
    } catch (Exception ex) {
        textBox1.Text = ex.ToString();
    }
}

実行してみる。ロードが終わって、ワンテンポ遅れて、テキストボックスに XML ファイルの内容らしきもの（ToString メソッドの実装に依存）が表示されれば OK。例外が発生した場合は、例外の内容がテキストボックスに書かれる。

ん～？Silverlight っちゅう感じがしないのはなぜ？

Silverlight ってば

はなおかじった — Fri, 06 Jun 2008 23:35:00 GMT

サーバに、xap ファイルへの関連づけがいるらしい。→第5回　Silverlight 2でHello world（gihyo.jp）

というわけで、管理人さん、よろしくお願いしま～す→真っ白なワケ

zip ファイルも置きました。Silverlight 2 がインストールされていれば、ローカルでも表示できます。