Android や Genymotion で、Chrome で開発者ツールを使う方法

Android エミュレータ Genymotion で、Chrome で開発者ツールを使う方法

Androidアプリの動作確認で使用する高速エミュレーターGenymotionを使用する場合、
HTMLやCSSを直接操作して動作確認を行いたい場合、Chrome で開発者ツールの様な物が必要となるので、
簡単にできる導入方法を紹介。

端末で確認しながら、ブラウザで編集しつつ確認が出来ます。

用意する物
PCブラウザ：Chrome
USB接続されたAndroid端末 もしくは Genymotion

準備：
デバッグしたいAndroid環境を開発者オプションを有効にする。
１，設定 ＞ 端末情報 ＞ ビルド番号 を連打して開発者向けオプションを表示させる。
２，設定 ＞ 開発者向けオプション ＞ USBデバッグ にチェック

USB接続するためのドライバをインストールする
１，http://developer.android.com/sdk/win-usb.html

手順：
１，PCとAndroid端末をUSB接続する。
　　USB デバッグモードになることを確認
　　Genymotionの場合、起動する
２，Discover USB devices をチェック
３，Android の Chrome でデバッグするページを開く
４，PC の Chrome のアドレスバーに以下URLを入力
　　chrome://inspect/#devices
５，デバッグしたいページのURLが表示されるので、inspectをクリックする。
　　開発者ツールが表示される。

後は、通常の作業でいけます。

Android エミュレータ Genymotion でも問題なく表示されますので、
デバッグがはかどると思います！