Qt Creator での JavaScript のデバッグ

コンソールへの出力

AppStudio アプリのデバッグで推奨される方法は、QML コードで console.log メッセージを使用することです。これらのメッセージは、Qt Creator コンソールに表示され、すべてのプラットフォームで同じです。この方法は、Qt キットをインストールしなくても機能します。AppStudio のみが必要です。

Qt Creator でアプリを実行するには、[Tools] > [External] > [AppStudio] メニューで [Run] をクリックします。キーボードで Alt + Shift + R キーを押すか、Qt Creator ウィンドウの左下にある [Run] ボタンをクリックすることもできます。

Qt Creator のデバッグ モード

AppStudio バージョン 4.0 にバンドルされている Qt Creator のバージョンは、Qt Creator のデバッグ ツールへの迅速なアクセスを提供します。アプリをデバッグ モードで開くには、Qt Creator で F5 キーを押すか、Qt Creator ウィンドウの左下にある [Start debugging of startup project] ボタンをクリックします。

Qt Creator でデバッグ ツールを使用する方法の詳細については、Qt ドキュメントの「Interacting with the Debugger」をご参照ください。

注意:

Qt ドキュメントは C++ のデバッグに関する情報を含んでいますが、この言語を使用するには、AppStudio で提供されていない Qt SDK ライセンスが必要です。

ブレークポイント

Qt Creator でブレークポイントを使用すると、アプリがコードの特定の行に達したときにアプリを中断して、制御をユーザーに渡すことができます。その後、ユーザーはアプリの状態を調べ、引き続き行ごとに実行するか、連続的に実行することができます。

次の方法で、アプリにブレークポイントを挿入できます。

  • ブレークポイントを挿入したい行にテキスト ポインターを置いて、F9 キー (MacOS では F8 キー) を押します。
  • 行番号の左にあるスペースをクリックします。
  • [Breakpoints] ビューの空の部分をダブルクリックし、表示された [Add Breakpoints] ウィンドウに行番号を入力します。
  • [Breakpoints] ビューで [Add Breakpoint] を選択し、表示された [Add Breakpoints] ウィンドウに行番号を入力します。

これでアプリは、ブレークポイントを設定した位置で停止するようになり、Qt Creator のデバッガが、通常通り再開するか、アプリを停止するか、またはコードの別の行にスキップするオプションを提供します。

[Edit Breakpoints] ウィンドウを開くには、[Breakpoints] ビューでブレークポイントをダブルクリックするか、コード ビューでブレークポイントを右クリックして、[Edit Breakpoint] をクリックします。このウィンドウで、異なるタイプのブレークポイントの他に、ブレークポイントでアプリが停止する前の条件、アプリを停止する前にブレークポイントが無視される回数、およびブレークポイントに達したときに自動的に渡すコマンドを設定できます。

ブレークポイントを移動するには、ブレークポイントを選択して、目的の位置にドラッグします。ブレークポイントを削除するには、F9 キー (MacOS では F8 キー) を再び押すか、ブレークポイントのアイコンをクリックするか、またはブレークポイントを右クリックして、[Delete Selected Breakpoints] または [Delete All Breakpoints] のいずれかを選択します。

ブレークポイントの詳細については、Qt ドキュメントの「Setting Breakpoints」をご参照ください。

QML プロファイラー

JavaScript は、アプリが期待通りに動作するのを妨げる予期しないエラーを引き起こす可能性があるのに加えて、QML アプリのパフォーマンスの低下の原因になることもあります。短期間に多すぎる JavaScript を実行すると、たとえば、遅延またはフレームの減少を引き起こす可能性があります。QML プロファイラー ツールを使用して、使用中の JavaScript 関数、メモリ使用量、入力イベントなどのデータを監視することによって、それらのパフォーマンスの低下の原因を見つけることができます。

QML プロファイラーを有効化するには、まず、アプリが Qt Creator を現在実行していないことを確認します。次に、アプリの [Project] ビューが開いた状態で、[Analyze] > [QML Profiler] の順に選択します。アプリが開き、[QML Profiler] セクションが、アプリの背後にある Qt Creator 内に開きます。プロファイルを作成するアプリ内で操作を実行し、[QML Profiler] セクションで [Stop] をクリックします。[QML Profiler] セクションは、アプリの挙動の [Scene Graph] を提供します。コード ビューは、アプリがコードの各部分を実行するのに費やした時間のパーセント値も表示します。

QML プロファイラーの詳細については、Qt ドキュメントの「Profiling QML Applications」をご参照ください。