ユニバーサルアプリやWPFアプリの実行時にウィンドウ上部中央に表示されるツールバーを非表示にする手順を紹介します。

現象

ユニバーサルアプリやWPFアプリをデバッグ実行すると、ウィンドウ上部の中央にツールバーが表示されます。 ツールバーのアイコンは左から以下のボタンが配置されます。

• ライブ ビジュアル ツリーに移動
• XAMLリアルタイムのプレビューで表示
• 要素の選択
• レイアウト ガイドを表示
• フォーカスがある要素を追跡
• バインドエラー
• XAMLホットリロード

最終的な画面イメージを確認したい場合や、ツールバーがコントロールに重なってしまうため、 デバッグ用のツールバーを非表示にしたい場合があります。

手順

Visual Studioを起動し、メインウィンドウを表示します。[ツール]メニューの[オプション]の項目をクリックします。


[オプション]ダイアログが表示されます。


左側のツリービューの[デバッグ]のノードを開きます。[XAML ホット リロード]の子ノードをクリックして選択します。 下図の画面が表示されます。


右側のエリアの[共通]セクションの[アプリ内ツールバーを有効にする]チェックボックスをクリックしてチェックを外します。
設定ができたら[OK]ボタンをクリックしてダイアログを閉じます。

動作の確認

プロジェクトを実行します。ツールバーが非表示になることが確認できました。

以前バージョンのVisual Studioでの手順

現象

ユニバーサルアプリやWPFアプリをデバッグ実行すると、ウィンドウ上部の中央にツールバーが表示されます。ツールバーのアイコンは左から

• ライブ ビジュアル ツリーに移動
• 選択を有効にする
• レイアウト ガイドを表示

ボタンとなっています。このデバッグ用のツールバーを非表示にしたい場合があります。

非表示にする手順

Visual Studioを起動します。[デバッグ]メニューの[オプション]メニューをクリックします。


デバッグの[オプション]ダイアログが表示されます。


左側のツリービューから[デバッグ]の[全般]をクリックして選択します。


右側のリストビューから[XAMLのUIデバッグツールを有効にする]の項目を探します。


[XAMLのUIデバッグツールを有効にする]のチェックボックスのチェックを外します。設定後ダイアログボックスの[OK]ボタンをクリックします。

動作の確認

プロジェクトを実行します。ツールバーが非表示になることが確認できました。

補足:ウィンドウ左上の数値を非表示にする

上記の設定で、ツールーバーは非表示になります。なお、ユニバーサルアプリでウィンドウ左上の数値(フレームレート表示)は表示された状態です。ウィンドウ左上のフレームレート表示を非表示にする手順はこちらの記事を参照してください。