Silverlightで仮想化されたTreeViewを作ってみました

Visual Studio Express 2013 for WebでSilverlightが使えるか確認ついでに、仮想化されたTreeViewを作ってみたので、Githubにあげました。

Silverlightの標準のTreeViewは、仮想化されていないため、大量のItemを表示しようとすると、スクロールに隠れている部分のItemも生成されることとなり、表示に時間がかかりメモリも浪費します。

今回作ったものは、仮想化されているため、大量のItemがあっても、スムーズに表示されます。

実装方法

いちからVirtulaizingの仕組みを使ってTreeViewを作るのは面倒だったため、ListBoxを使ってTreeViewのように見せるようにしました。(ListBoxは仮想化されている)

下記のサイトでもListBoxをもとにした実装をしていますが、

動的にItemを追加できなかったり、キーボードによるTreeの開閉に対応していなかったりしたため、そこにも対応してなるべく標準のTreeViewに似せてみました。

Treeの展開については、対象のItemをRemove/Addするのではなく、PagedCollectionViewを使ってフィルタすることにより切り替えるようにしています。

動的にItemを追加/削除する部分については、子供全体が差し替わる場合(コレクション自体が別物になる)と部分的に変わる場合の両方に一応対応したつもりではありますが、あまり動作確認できていません。(そこだけ複雑になってしまった気がしています…)

おわりに

Visual Studio Express 2013 for Web を使えば、Silverlightアプリケーションを作れますが、Blendが使えないと、アニメーションやVisualState周りなどはきつそうです。ただ、テンプレートの編集やBinding設定などは、Visual Studio単体でも視覚的にできたので、Blendを使わないと、、といったところは少なくなっているように思えます。

BlendもExpressに付けてくれるとうれしいんですがね…

 

あと、MSはSilverlightをこのまま終わりにするのかが気になります。力をいれていく感じはもう数年前からなさそうなので。とはいえ、HTML5が代替になるかというと、それもまた違う気が。