[Xcode 5] Xcode 5のデバッグ機能 “Visual Debugger”

前回に引き続きXcode 5のデバッグ機能について見ていきます。

Visual Debugger

実行中のアプリケーションの変数の内容を表示する機能はXcode 4.6.3以前からありましたが、Xcode 5ではさらに強化されています。

Xcode 4.6.3でSingle View Applicationからプロジェクトを作成し、Xcode 4.6.3とXcode 5の両方で同じプロジェクトを動かしながら両バージョンの違いを見ていきます。(Visual Debuggerの「クイックルック機能」を試すためにAppDelegateクラスにUIImageのプロパティを追加し、バンドルした画像からインスタンスを生成するコードを追加しました。)

アプリの実行を一時停止した状態で、「Source code editor」と「Debug area」の変更点を見ていきます。
xcode5_debug_new_feature_13

Source code editor

まずはSource code editorの違いを見ていきます。

Xcode 4.6.3

コードにマウスカーソルを合わせると表示される「データチップ」ですが、Xcode 4.6.3では下の画像のような表示になっています。
AppDelegateクラスのimageプロパティまで展開してみましたが、階層を展開するごとにViewが現れてそこに表示されるようになっており、少しごちゃごちゃしてしまいます。
xcode5_debug_new_feature_14

Xcode 5

Xcode 5のデータチップは下の画像のような表示になっています。
xcode5_debug_new_feature_15

こちらも同じく、AppDelegateクラスのimageプロパティまで展開してみました。
iOSのポップオーバーのような1つのViewに全て表示されるようになっています。Xcode 4.6.3よりも表示がスッキリしています。
xcode5_debug_new_feature_16

また、「クイックルック機能」が追加されており、画像などを簡単に確認できるようになっています。
xcode5_debug_new_feature_17

インスペクタアイコンをクリックすると追加の情報を表示できます。
xcode5_debug_new_feature_18

Debug area

次にDebug areaを見ていきます。

Xcode 4.6.3

Xcode 4.6.3のDebug area は下の画像のような画面でした。 xcode5_debug_new_feature_19

Xcode 5

Xcode 5では画面構成が少し変更されました。
Debug area上部の左から2番めの青色のボタンは新たに追加されたもので、全てのブレークポイントのオン/オフ操作が行えるようです。
xcode5_debug_new_feature_20

Source code editorの「データチップ」と同様に、「クイックルック機能」を使うことができます。
xcode5_debug_new_feature_21

CGRectの場合は図で表示されます。
xcode5_debug_new_feature_25

インスペクタアイコンをクリックすると追加の情報を表示できます。
xcode5_debug_new_feature_22

まとめ

本記事では「Visual Debugger」について見ていきました。大きな変更ではありませんでしたが、画像のプレビューができるようになったことは地味に便利だと思いました。

参考ページ