--- title: モバイルアプリのデバッグ date: 2020-08-05 categories: - app-development - mobile-development - mobiletogether - tools tags: - app-development - mobile-app-debugging - mobile-development-tools - mobiletogether description: 開発者は、アプリケーションの動作を理解し、問題を解決するために、モバイルアプリのデバッグツールを必要とします。MobileTogetherは、アプリケーションの実行フローを詳細にデバッグできる、多機能なツールを提供します。 --- Status: #blog Tags: #app-development #mobile-app-debugging #mobile-development-tools #mobiletogether Categories: [mobile-development](/blog/ja/category/mobile-development.md) # モバイルアプリのデバッグ MobileTogetherは、非常に複雑で洗練された、クロスプラットフォーム対応のソリューションを構築するためのツールです。開発者は、開発中のモバイルアプリのデバッグツールを使用して、問題の特定やアプリの動作の理解を行う必要があります。MobileTogether Designerは、アクションツリー内でアプリの実行フローを詳細にデバッグできる、豊富な機能を備えています [XPath/XQuery関数のデバッグ](/blog/ja/2021/03/developing-and-debugging-user-functions-in-mobile-apps.md). これらの機能は、単一のツールに統合された2つのモバイルアプリのデバッグビューとして提供されています。 アクションデバッガービューを使用すると、コントロールイベントやページイベントに関連するアクションをデバッグできます。このビューは、処理中にデバッグ対象として選択されたアクションに遭遇した場合に利用可能です。XPathデバッガービューは、XPath/XQuery評価ウィンドウを開き、式を詳細に追跡およびデバッグすることができます。 開発者は、プログラムの様々な箇所にブレークポイントを設定し、アプリをステップごとに実行することができます。また、いずれの画面でも一時停止させることができ、実行環境全体を詳細に調査することができます。 それでは、モバイルアプリのデバッグを実際に見ていきましょう ![](/blog/images/MT-debugger-lead.jpg) 以前の記事で、モバイル開発のための[プログラミング手法](https://www.altova.com/blog/programming-techniques-for-mobile-development/)について解説した際、空気質アプリを使って、モバイルアプリにおけるサブルーチンの例を紹介しました。このサブルーチンは、MobileTogetherのアクショングループとして実装されており、APIから返されたデータ（協定世界時（GMT）の時間と調整値）に基づいて、その地域の空気質データの取得時刻を計算しています。このサブルーチンをデバッグすることで、計算結果が正しいことを確認できます。 まず、`Calc`のローカル時間アクショングループの先頭にブレークポイントを設定し、サブルーチンが呼び出された際にプログラムの実行を一時停止させます [![モバイルアプリのデバッグにおけるブレークポイントの設定](/blog/images/set-break.png)](set-break.png) 必要な数だけブレークポイントを追加できます。また、後でそれらを見つける心配もありません。ブレークポイントは、メインのデバッグメニューから管理できます [![メインのデバッグメニューにあるオプション](/blog/images/debug-menu-1.png)](debug-menu-1.png) また、メニューを使って「次のブレークポイントで停止」オプションを設定しました。これで、アプリをシミュレーターで実行できます。アプリは通常通りに動作し、"Calc local time"というアクショングループが呼び出されるまで実行されます。 以下の画像は、アプリケーションがブレークポイントで一時停止した際のシミュレーターの表示画面です。ユーザーはロンドンの都市に関するレポートを選択し、アプリケーションがAPIを呼び出した結果、現在、返されたデータから現地時間（ロンドンの時間）を計算しようとしています [![プログラムの実行がブレークポイントで一時停止した際のデバッグ画面](/blog/images/stop-at-break.png)](stop-at-break.png) 画面の左側には、2つのデバッガーのウィンドウが開いています。一番上には、これから実行される処理が表示されており、赤いブレークポイントと緑色の矢印が現在のステップを示しています。その下のウィンドウには、アクショングループに至るまでの処理の呼び出し履歴が表示されています。 コールスタックの表示にある「+」ボタンは、アクショングループが呼び出された際に渡されたパラメータの値を表示します。 画面上部にある「ステップ実行」ボタンをクリックすると、処理を1ステップずつ進めることができます [![サブルーチンに渡されるパラメータを確認します](/blog/images/step-1.png)](step-1.png) ちょっと待ってください、ロンドンはイギリスのグリーンウィッチと同じタイムゾーンにあるはずですよね？ それなら、GMTからの調整は必要ないはずです。 私は全てのスマートアシスタントと検索エンジンに質問したところ、それらは全て「ロンドンとグリーンウィッチはどちらもブリティッシュ・サマータイムを使用しており、これはGMTより1時間進んでいる」と答えました。 いずれにしても、APIから提供されたデータがこれなので、引き続き作業を進めることができます。コメントを一つずつ確認していくと、最初の「更新ノード」アクションが見えてきます [![このサブルーチンが最初に実行する処理](/blog/images/step-2.png)](step-2.png) `localDateTime`ノードには、`$time`パラメータの値が設定されます。 次のステップ： [![dateTime文字列の修正](/blog/images/step-3.png)](step-3.png) 日付と時刻の間に「T」という文字を挿入することで、`add-hours-to-dateTime()`関数に必要な構文に合わせます。 次のステップ： [![調整から追加の時間を加算します](/blog/images/step-4.png)](step-4.png) 調整時間が増加します。 次のステップ： [![調整が必要な分を確認してください](/blog/images/step-5.png)](step-5.png) 調整が必要な箇所はありますか？ いいえ。 次のステップ： [![dateTimeから文字「T」を削除してください](/blog/images/step-6.png)](step-6.png) 「T」をスペースに置き換えてください。 次のステップ： [![サブルーチンの終了が検出されました](/blog/images/step-7.png)](step-7.png) コメント行は、アクショングループの終了を示します。これで、画面上部の緑色の「実行」ボタンを使って、アプリケーションの通常の動作を再開できます。次に、大気質指数を表示するサブページが開きます [![大気質に関するレポートが掲載されているサブページの画面表示](/blog/images/step-8.png)](step-8.png) その結果、モバイルアプリのデバッグにおいて、アクションビューを使用することで、私たちのロジックが正しいことを確認できました。 しかし、各ステップで中間結果を保存するのは、非常に手間がかかり、不必要です。そこで、これらのステップをまとめて、一つの式にすることができます [![日時調整を一度の操作で完了させる ](/blog/images/new-action-group.png)](new-action-group.png) 元の3つの操作は無効化され、代わりに、複雑な式を含む1つの操作に置き換えられます。この式をテストするには、XPathデバッガーのビューを使用できます。 ビューをスムーズに切り替えることも可能でしたが、最初のデバッグセッションを一時停止し、式を修正しました。今、この新しいバージョンをシミュレーターで実行します。今回、ブレークポイントで停止した際に、XPath/XQuery デバッガー ビューで、「Step into XPath」ボタンを使用して、モバイルアプリのデバッグを開始します [![モバイルアプリのデバッグを、表現ビューで行う](/blog/images/step-xpath1.png)](step-xpath1.png) XPath/XQuery評価ウィンドウが開かれ、デバッガーが式を評価し始めます [![モバイルアプリのデバッグ中に式を評価する](/blog/images/step-xpath2.png)](step-xpath2.png) それでは、XPathウィンドウにある「ステップ実行」ボタンを使用し、式を一つずつ確認していきましょう ![表情を内側から評価する](/blog/images/step-xpath3.png) 画像の下部にあるパネルには、アクショングループが呼び出された際に提供されたパラメータの内容が表示されています。変数 `$time` の値は、APIから返された文字列データを含むJSONノード `s` から取得されました。 次のステップ： [![add-dateTime() 関数で使用する文字列を準備します](/blog/images/step-xpath4.png)](step-xpath4.png) 式の中で、変数Tは依然として、`add-hours-to dateTime()`関数が持つ構文規則に従う必要があります。 次のステップ： ![](/blog/images/step-xpath5-1.png) 今、いよいよ本番に入り、処理が完了しました。今回の実行において、元の `$time` パラメータは 2020-08-03 07:00:00 で、調整に使用された `$adj` の値は -07:00 でした。その結果、最終的な結果は 2020-08-03T00:00:00 となりました。 次のステップは、分単位での調整が必要かどうかを確認するためのテストです。`$adj`パラメータは「00」で終わるため、このテストは失敗し、"T"が置き換えられ、サブページが表示されます [![新しい大気質に関するレポートの表示](/blog/images/san-fran-aqi.png)](san-fran-aqi.png) もしクロスプラットフォーム開発を行っているのであれば、モバイルアプリのデバッグ機能を持つツールが必要です。ぜひ、弊社のMobileTogetherをお試しください [ビデオデモンストレーション](https://www.altova.com/ja/mobiletogether/demos#video_Demos), もっと [サンプルアプリケーション](https://www.altova.com/ja/mobiletogether/demos), または、さらにその [オンラインマニュアル](https://www.altova.com/manual/MobileTogether/mobiletogetherdesigner/) 詳細な情報については、ぜひこちらをご覧ください。そして、もしあなたが、最も短い時間でクロスプラットフォームのモバイルアプリを開発したいとお考えなら、ぜひこちらから始めてください [MobileTogether Designerをダウンロードしてください](https://www.altova.com/ja/mobiletogether/download) 始めるために。