トレースを読み込んだら、[トレースを表示] をクリックして、アップロードされたトレースを可視化します。各トレースのタブがウィンドウの上部パネルに表示されます。アップロードされたファイルに関連するトレースが含まれている場合、画面録画トレースまたはスクリーンショットのフローティング ビューが画面にオーバーレイされます。
図 1. Winscope でトレースを表示します。
以降のセクションでは、[トレース表示] 画面の UI 要素について説明します。
長方形
WindowManager、SurfaceFlinger、ViewCapture などの Winscope ビューの [LAYERS] パネルには、Z 軸上の位置と順序を視覚的に表すトレースからの長方形要素が含まれています。
[レイヤ] パネルのナビゲーション コントロールを使用して、長方形のレイヤの描画モード、間隔、回転を変更できます。
図 2. 長方形のコントロール。
グラデーションの形式
階層内のすべての要素をより効果的に検査するには、[長方形の形式] ボタンを使用して、長方形の描画形式を [グラデーション] に切り替えます。グラデーション形式では、長方形の書式ボタンが薄いグレーになります。
このモードでは、各長方形の不透明度は Z オーダーに基づいて低下し、Z オーダーが高い長方形ほど半透明になります。これにより、長方形が互いに隠れないようにしながら、階層内のすべての要素を確認できます。
図 3. 長方形のグラデーション。
不透明度の形式
長方形の描画形式を不透明度に変更するには、[長方形の形式] ボタンをクリックします。[不透明度] 形式では、[長方形形式] ボタンが暗いグレーになります。
このモードでは、各長方形は、サーフェスやビューの不透明度などの不透明度に基づいて描画されます。
図 4. 長方形の不透明度。
ワイヤーフレームの形式
長方形の表示をワイヤーフレームに変更するには、長方形の形式ボタンをクリックします。この表現により、階層内の個々の要素を簡単に調べて分析できます。ワイヤーフレーム_形式では、長方形の形式ボタンが、シャドウのないアウトラインに変わります。
図 5. 長方形のワイヤーフレーム。
回転
回転スライダーを使用して、長方形の遠近感を 0 ~ 45 度に変更し、要素が画面外に移動するシナリオを確認できます。
図 6. 長方形の回転。
スペース
間隔スライダーを使用してレイヤ間の間隔を調整し、要素の Z オーダーをより適切に検査できるようにフラット化されたビューまたはより広がったビューを作成します。
図 7. 長方形の向き。
ディスプレイとウィンドウの選択
SurfaceFlinger ビューで、複数のディスプレイを備えたデバイスでデータを記録すると、利用可能なディスプレイが表示され、目的のディスプレイのみを選択できます。
ViewCapture で、通知シェード、タスクバー、ランチャーなど、複数のシステム ウィンドウを録画する場合、メニューに使用可能なウィンドウが一覧表示されます。
パンとズーム
長方形の領域をクリックしてマウスをドラッグすると、長方形の位置を水平方向または垂直方向に調整できます。ズームイン、ズームアウト、ズームレベルのリセットには、スクロール ホイールまたはコントロール バーのズームボタンを使用します。
階層
Winscope ビューアには、階層ビューアが組み込まれていることが多いです。図 1 のビューアには、分析対象のトレースに応じたさまざまな階層が表示されます。たとえば、ビューアは WindowManager 内のウィンドウ階層や、System UI ウィンドウ内のビュー階層を表示できます。
特定の階層タイプの詳細については、それぞれのトレースのセクションをご覧ください。
このセクションでは、差分表示、V のみを表示、フラット、検索機能など、階層の一般的な使用方法について説明します。
図 8. 階層の制御。
差分を表示
[差分を表示] 機能を有効にすると、Winscope は現在の状態と以前の状態の差分を自動的にモニタリングして表示します。[差分を表示] 機能では、削除された要素は赤で、変更された要素は青で、新しく作成された要素は緑でハイライト表示されます。この視覚的な表現により、2 つの状態の違いをすばやく特定して理解できるため、変更を追跡して潜在的な問題を特定しやすくなります。
図 9. 差分階層を表示します。
検索およびフィルタする
階層ビューアには、正規表現(regex)を使用した検索機能があります。このフィルタは、要素の名前と値(プロパティの場合)の両方を対象とします。フィルタが階層内の子要素と一致すると、次の図に示すように、ツリーのルートまでの親のチェーン全体が表示されます。
図 10. 検索階層。
表示のみ
[表示のみを表示] 機能を使用すると、階層内の非表示要素をすべて除外できます。デフォルトでは、Winscope には表示要素と非表示要素の両方が表示されます。表示される要素は黒で描画され、非表示の要素はグレーで表示されます。
フラット
[フラット] ボタンは、要素間の親子関係を排除して階層構造を再編成します。このアクションは、すべての要素を同じレベルでレンダリングします。[可視のみを表示] オプションと組み合わせると、親要素を除く可視要素のみが階層に表示されます(次の図を参照)。
図 11. フラットな階層。
プロパティ
Winscope では、多くの視聴者がプロパティ ビューアを統合しています。このビューアには、階層ビューから選択した要素に関連付けられたさまざまなプロパティのリストが表示されます。たとえば、ビューアは WindowManager 内のアクティビティのプロパティや、システム UI 内のビューのプロパティを表示できます。
特定のプロパティの詳細については、SurfaceFlinger、WindowManager、ビュー キャプチャの各トレースのセクションをご覧ください。
このセクションでは、[差分表示]、[検索]、[デフォルト設定を表示] の各機能の一般的な階層について説明します。
差分を表示
[差異を表示] 機能の使用方法は、階層ビューで差異を表示すると同じです。
検索およびフィルタする
[検索] 機能の使用方法は、階層ビューでの検索と同じです。
デフォルトを表示
デフォルトでは、Winscope には、変更されたプロパティ値のみが表示されます。これは、それぞれのデータ型のデフォルト値ではありません。たとえば、Winscope では、ブール値の false
、整数の 0
、オブジェクトの null
、配列の []
は省略されます。この合理化により、ユーザーに表示されるプロパティのリストが簡素化されます。ただし、特定の状況では、要素に関連するすべての情報を包括的に把握することが有益です。このような場合、[デフォルトを表示] オプションを選択すると、空の値または null 値を含むプロパティを含め、Winscope で使用可能なすべてのプロパティが表示されます。
図 12. プロパティのデフォルト値。
一般的なショートカット
Winscope は、次のショートカットをサポートしています。
図 13. 一般的なショートカット。