はじめに

本記事はWPFアプリケーションのビジュアルツリーを表示し、コントロールのプロパティ値変更などを支援する「Snoop」を使ってWPFでのUI作成を効率的に行う方法をまとめます。

Snoopとは

WPFアプリケーションのビジュアルツリーを表示するツールです。
UI画面上のコントロールが他のどんなコントローラを要素として構成されているかを確認できます。
また、コントロールのプロパティやコントロールのデータコンテキスト(MVVMパターンで実装している場合はViewModel)のプロパティも変更可能であり、その際の見た目の変わり方も確認できます。
詳細はこちらを参照ください。

何に使えるのか

以下のような場合にSnoopを使うことで作業効率を上げることができます。

コントロール中のどのプロパティを変更すると見た目が変更されるかわからない

SnoopではVisualStudio上でデバッグ中に、コントロールのプロパティ値を変更し、UIの変化をその場で確認できます。
そのため、プロパティ値の変更後にわざわざビルドしてUIの変化を確認する必要がなくなり、開発効率が向上すると考えられます。

使い方

基本的な使い方と実際に使っているイメージを示します。
(イメージは以下の3.以降の手順を対象としています。)

対象プロジェクトをデバッグ実行する
Snoopを起動する
双眼鏡のボタンの右側のボタンをクリックし、コントロールの動きを見たいWPFアプリケーションにドラッグドロップする
UI画面上で変化を見たいコントロールを"Ctrl+Shift"を押しながらマウスホバーする
ビジュアルツリー右側のプロパティタブでプロパティを変更
プロパティ変更に応じてコントロールの見た目が変化する

まとめ

本記事ではWPFアプリケーションのビジュアルツリーを表示し、コントロールのプロパティ値変更などを支援する「Snoop」を使ってWPFでのUI作成を効率的に行う方法をまとめました。
見た目の変化を即座に確認しながら開発を進めることができるため、活用していきたいですね。