Androidでの開発

Contents

このガイドでは、CapacitorまたはCordovaを使用して、AndroidシミュレータおよびデバイスにIonicアプリケーションをデプロイする方法について説明します。

Androidデバイスにアプリをデプロイしてデバッグするには、environment setup のステップを行う必要があります。

プロジェクト設定

アプリをAndroidシミュレータやデバイスにデプロイする前に、ネイティブプロジェクトを設定する必要があります。

  1. ネイティブプロジェクトが存在していない場合は生成します。

    Capacitorの場合は、以下を実行します。

     $ ionic capacitor add android

    Cordovaの場合は、以下を実行します。

     $ ionic cordova prepare android
  2. Package IDを設定します

    Capacitorの場合は、capacitor.config.jsonファイルを開き、appIdを変更します。

    Cordovaの場合は、config.xmlファイルを開き、idを変更し<widget>でルートを設定します。要素の属性を変更します。詳しくは the Cordova documentation をご覧ください。

Capacitorで実行する

CapacitorはAndroid Studioを使用して、シミュレータやデバイス向けのアプリを構築して実行します。

  1. Ionicアプリを開発し、それをネイティブプロジェクトと同期させます。

    変更が検知がある度に、iOSシミュレータやデバイスが変更を検知するより前に、IonicアプリをWebアセットにビルドする必要があります。その後、Webアセットをネイティブプロジェクトにコピーします。幸いなことに、このプロセスはIonic CLIコマンドひとつで簡単にできます。

     $ ionic capacitor copy android
  2. Android StudioでRun牡丹をクリックしてから、ターゲットのシミュレータまたはデバイスを選択します。

Android Studio Run Button Area

Cordovaで実行する

Ionic CLIは、コマンドひとつで、Ionicアプリを作成、コピーし、iOSシミュレータやデバイスにデプロイできます。 ionic serveのようなライブリロード 機能を利用するために、開発用のサーバを遅延することもできます。

次のコマンドを実行して、ライブリロードのための開発サーバーを起動するCLIプロセスを起動します。

$ ionic cordova run android -l

これで、アプリのソースファイルに変更が加えられたときに、Webアセットが再構築され、再度デプロイすることなくシミュレータまたはデバイスに反映されます。

Chrome DevToolsを使う

Chromeは、Androidシミュレータおよびデバイス用のWeb開発者ツールをサポートしています。シミュレータが実行されているか、デバイスがコンピュータに接続されているのを確認した上、chrome://inspect をURLバーに入力するとアプリのデバッグができます。

アプリケーションがデバイスまたはシミュレータ上で実行されていることを確認してください。そうしないと、リストに表示されません。

Android Chrome DevTools

ネイティブログの表示

ネイティブログは、Android Studioの Logcat にあります。

Logcat ウインドウが表示されていない場合、View » Tool Windows » Logcatから表示できます。

Android Studio Logcat

翻訳するUpdated 2019-03-19
Running on iOSTesting