あいてぃーとふぼふ

WP7のLoopingSelector(応用編)

前回に引き続き、今回はLoopingSelectorコントロールをデータバインドで使用する方法をご紹介します。

どうやって実現する?

今回の方法では、LoopingSelectorとDataSourceを『Behavior』クラスにより間接的にデータバインドさせます。つまり、両者の間にBehaviorクラスを仲介させることにより、データバインドを橋渡しさせるわけです。この方法であれば、前回作成した『ILoopingSelectorDataSource』実装クラスを再利用できますし、少ない工数で実現することができそうですね!

こんな感じのXAMLになる!

先に、完成形となるXAMLの配置方法を左記に記載します。前回投稿したXMALと比較してもらえるとわかると思いますが、パッと見はほとんど同じように見えますね。大きな違いとしては、前回はDataSourceを直接設定していたのに対し、今回はBehaviorを設定してデータバインドを定義しています。設定されたBehaivorの内部では、バインドされた情報をもとにLoopingSelectorのDataSourceを初期化して、バインドされたプロパティとDataSourceを相互に関連付けます。

Behaviorを実装しよう!

では肝心のビヘイビアを実装しましょう。ソースコードは左記のとおりです。一見するとかなりのコード量に見えますが、前半は依存関係プロパティの定義が占めていますので、実際の処理はそんなに多くありません。重要なポイントは、依存関係プロパティの型がBindingクラスであるという点です。通常はIEnumerable型だったりint型だったりするわけですが、そんなことをしようものならたちまち『XamlParseException』が発生します。ですので、依存関係プロパティをBinding型とすることにより、バインド情報そのものを受け取るようにします。この対処方法は、WP7版のMvvmLightやPrismにおいても採用されていますね。

ただしこのままでは、Bindingクラスから値を取得することができないため、バインドされたプロパティとDataSourceの橋渡しが行えません。そこで活躍するのが、PrismやMvvmLight に含まれている『BindingListener』クラスです。このクラスを利用することにより、バインドされたプロパティの値を取得することができるようになり、晴れて双方向のデータバインドを実現することが可能となります!ヽ(゚´Д`)ノ゚

サンプルコードはこちらから!

LoopingSelectorに関するサンプルコードは以下のリンクからダウンロードすることが可能です。なお実行には『Silverlight for Windows Phone Toolkit』がインストールされている必要がありますのであらかじめご了承ください。
LoopingSelectorSample

さいごに!

ということで、最終的にはだいぶ簡潔にデータバインドを実現することができました。工数などに応じて適材適所だとは思いますが、BehaviorやTriggerActionは、ある程度使いこなせると非常に便利な機能ですね!それにしても、なんか最近イラストばかり描いていたから、久しぶりにシステムエンジニアらしい更新をした気がする…(; ̄ー ̄

WP7のLoopingSelector(基礎編)

WP7には『LoopingSelector』というコントロールが存在するのですが、知らない人も結構多いみたいです。それもそのはず、LoopingSelectorは『Silverlight for Windows Phone Toolkit』に含まれているコントロールであり、かつ『Microsoft.Phone.Controls.Primitives』というマイナーな名前空間に属しています。しかもToolkitのサンプルプログラムにも載っていません。

コントロールの機能としては、一覧が無限にループするアイテムリストのようなものと考えてもらえれば問題ないと思います。DatePickerやTimePickerコントロールでも利用されているため、目にしたことのある人は多いハズ。今回はこれを単体で利用する方法をご紹介します。

ちょっと実装しづらい

このコントロール、実はちょっと実装しづらいです。たとえばListBoxやComboBoxといったコントロールで一覧を設定する場合、ItemsSourceプロパティにIEnumelableコレクションを設定すればOKです。同様に、LoopingSelectorにもDataSourceというプロパティが存在していますが、設定できる型が『ILoopingSelectorDataSource』となっています。このため、IEnumelableコレクションを設定すれば利用できるという代物ではありません。しかも、上記のインタフェイスを実装したクラスは標準で用意されていないため、自前で実装しなければなりません。ちょっと面倒ですが仕方ありませんね。

ILoopingSelectorDataSourceを汎用的に実装しよう

ILoopingSelectorDataSourceの実装はそれほど難しくありません。今回は汎用的なコレクションを指定できるように実装してみたいと思います。実装内容は右記画像の通りです。意外と簡単ですね!肝は『GetNext』と『GetPrevious』の2つのメソッドです。GetNextメソッドでは、コレクションの次のオブジェクトを返却するように実装するわけですが、コレクションの末尾に到達した場合は再度先頭のオブジェクトを返却するようにします。こうすることにより、コレクションを無限にループさせているわけですね~。GetPreviousメソッドはGetPrevメソッドの逆回りです。

XAMLに配置しよう

では実際にLoopingSelectorをXAMLに配置してみましょう。左記のような感じになります。LoopingSelectorのDataSourceプロパティに先程実装したクラスを指定し、適当なコレクションを指定します。なお余談ですが、LoopingSelectorのItemSizeプロパティを指定し忘れると何も表示されないのでごっそい焦ります。う~ん…でもこうなってくるとItemsSourceやSelectedItemにデータバインドができればいろいろと便利そうですよね~。よし、やってみましょう!(≧∀≦)/

データバインドで利用しよう

できません(´・ω・`)!なぜなら上記クラスはFrameworkElementの派生クラスではないので、データバインドのソースとして親のDataContextを利用することができません。となると、先程作成したクラスにFrameworkElementを継承させればよいのでは?と思いますが、そう簡単な話でもありません。しかもWP7では、Silverlight3の制約に輪をかけて制限が厳しいで、何かするとすぐさま『XamlParseException:AG_E_PARSER_BAD_PROPERTY_VALUE』エラーが発生します。にんともかんとも。

データバインドで利用したい!

それでも、どうしてもデータバインドで利用したい(>ω<、)!という人は、BehaviorとBindingListenerによる実装方法を次回の投稿でご紹介します。サンプルプログラムもその際に公開しますね!