SilverlightでNUnitするには？

私は今まで勘違いをしていたようです。
SilverlightプロジェクトをNUnitと組み合わせられないと。
テストできないと。
しかしそうでもなかったようです。

ググっても全く情報が出てこなかったところからしてこんな勘違いをしていたのは私一人のような気もしますがメモしておきます。

まず勘違いその１
「Microsoft Visual Web Developer 2010 Expressは一つのソリューションに一つのプロジェクトだけ」
（ゆえにNUnitのテストプロジェクトも作れない！）

これは×です。
ちゃんと複数プロジェクトを持ったソリューションを作れます。
File > New > Projectときて、Solution:項目をCreate new SolutionからAdd to solutionに変更するのです。
これで既存のソリューションに新たにプロジェクトを作れます。
複数のプロジェクトを作れるのです。


勘違いその２
「Silverlightと普通の.netのランタイムは完全に違うため片方のアセンブリがもう片方を使うことはできない」
（ゆえにSilverlightのアセンブリをNUnitのアセンブリはテストできない！）

これはどうも半分正しい気がします。
経験からして上手くいかないこともあったような気がします（記憶が曖昧なのでみなさん検証してみてください）。
Silverlightが普通の.netのアセンブリを使うことは出来なかったような・・・。

で、うまくいく方法とはどういう方法かというと

NUnit（通常の.net）

↓（参照）

テスト用アセンブリ（通常の.net）

↓（参照）

テストされるアセンブリ（Silverlight）


これで出来ました。
SilverlightのコードをNUnitでテストすることができたのです。
つまりSilverlightが.netを使うのはできないけど.netがSilverlightを使うことは出来るのですね。

ただ、今これはIDEでやるとワーニングが出るのでもしかしたら正しい方法ではないのかもしれませんね。

SilverlightのDataTrigger

SilverlightでDataTrigger

以前、WPFでDataTriggerを使いました。
今回はSilverlightでDataTriggerを使います。

しかし、SiverlightにはWPFのようなDataTriggerはありません。
（SilverlightはWPFの別バージョンというより.net frameworkのサブセットみたいなものなので、ちょっと正確性にかけた表現ですが。）

Silverlightはランタイムをコンパクトに保つため、機能がないことが多いのですね。
よってDataTriggerもありません。
おしまい。

……ではあまりにひどいので、Silverlightには別バージョンのDataTriggerが用意されています。
名前空間は別の場所にあり、微妙に使い方も違います。

---

準備

SilverlightでDataTriggerを使うには

Microsoft.Expression.Interactions.dll
System.Windows.Interactivity.dll

が必要です。
この２つはどうやらBlend SDKの最新バージョンに入っているようです。

---

片道切符

では早速Silverilghtで使ってみます。
次のようなコードになります：
※以前WPFで使った時とは違い、INotifyPropertyChangedの実装が必要なことに注意です。

using System.ComponentModel;

namespace SilverlightDataTriggerDemo
{
    public class MyViewModel:ViewModel
    {
        private bool isViewModelEnabled;
        public bool IsViewModelEnabled
        {
            get { return isViewModelEnabled; }
            set
            {
                isViewModelEnabled = value;
                NotifyPropertyChanged("IsViewModelEnabled");
            }
        }
    }

    public class ViewModel:INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged = delegate { };

        protected void NotifyPropertyChanged(string propertyName)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }
    }
}

XAMLの方はこうです：

<UserControl x:Class="SilverlightDataTriggerDemo.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:vm="clr-namespace:SilverlightDataTriggerDemo"
    xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
    xmlns:ei="clr-namespace:Microsoft.Expression.Interactivity.Core;assembly=Microsoft.Expression.Interactions"

    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">
    <UserControl.Resources>
        <vm:MyViewModel x:Key="viewModel"/>
    </UserControl.Resources>

    <CheckBox 
        DataContext="{StaticResource viewModel}"
        IsChecked="{Binding IsViewModelEnabled, Mode=TwoWay}">
        <TextBlock>
            <i:Interaction.Triggers>
                <ei:DataTrigger Binding="{Binding IsViewModelEnabled}" Value="true"> 
                    <ei:ChangePropertyAction PropertyName="Text" Value="Changed!!"/>
                </ei:DataTrigger>
            </i:Interaction.Triggers>
        </TextBlock>
    </CheckBox>
</UserControl>

これを実行したSilverlightがこちらです：
（本物です。画像ではありません。操作できます）

上のチェックボックスにチェックを入れてください。
Checked!!と表示されるはずです。
チェックを入れるとビューモデルのIsViewModelEnabledプロパティがtrueになり、それを察知したDataTriggerがテキストを"Checked!!"に変更するのです。

しかし問題もあります。
チェックを一度入れてから外してみてください。
以前のサンプルとは違い、テキストが表示されたままです。

一方通行で、もとに戻らないのです。

---

可逆変化

元に戻すには、チェックが入っていない状態にテキストを表示させなくさせる操作が、明示的に必要です。（多分）
具体的には、XAMLをこうします：

<UserControl x:Class="SilverlightDataTriggerDemo.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:vm="clr-namespace:SilverlightDataTriggerDemo"
    xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
    xmlns:ei="clr-namespace:Microsoft.Expression.Interactivity.Core;assembly=Microsoft.Expression.Interactions"

    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">
    <UserControl.Resources>
        <vm:MyViewModel x:Key="viewModel"/>
    </UserControl.Resources>

    <CheckBox 
        DataContext="{StaticResource viewModel}"
        IsChecked="{Binding IsViewModelEnabled, Mode=TwoWay}">
        <TextBlock>
            <i:Interaction.Triggers>
                <ei:DataTrigger Binding="{Binding IsViewModelEnabled}" Value="true"> 
                    <ei:ChangePropertyAction PropertyName="Text" Value="Changed!!"/>
                </ei:DataTrigger>
                <ei:DataTrigger Binding="{Binding IsViewModelEnabled}" Value="false"> 
                    <ei:ChangePropertyAction PropertyName="Text" Value=""/>
                </ei:DataTrigger>
            </i:Interaction.Triggers>
        </TextBlock>
    </CheckBox>
</UserControl>

こうしてできたSilverlightがこれです。
（本物です。画像ではありません。操作してみてください）


どうでしょう！！
今度はチェックを外したら文字が消えます！
意図したとおりの、以前のサンプルと同じ動作です。
・・・・・・しかしそれにしてももう少しスマートな方法はないのでしょうか？
コンバーターを使うという手もありますがなるべくXAMLだけで済ませたいものです・・・

ブログにSilverlight埋め込みテスト

クリックでSilverlightデモ起動

クリックするとボタンが出ます。
ボタンをクリックするとダイヤログボックスが出ます。

さてSilverlightをブログに埋め込むにはどうすればいいんでしょうね？


どうやらこんなふうにタグを使えばいいようです。

<iframe src="http://blog.cnobi.jp/v1/blog/user/118c300f2ee0ad311e5962b0167205f5/1309324795" frameborder="0" width="400" height="400" scrolling="no"></iframe>

まあ当たり前な気もします。

SilverlightApplicationDemoTestPage.htmlというのは、VisualStudioがbin\DebugやReleaseフォルダ内に作り出すhtmlファイルです。