Android v4 - スタートガイド

注: このガイドでは、Google タグの古い実装について説明します。 Android アプリのマネージャー。 新規ユーザーは<ph type="x-smartling-placeholder"></ph>を使用する必要があります タグ マネージャー + Firebase: Google タグ マネージャーを実装する 確認しました。

はじめに

Google タグ マネージャーを使用すると、デベロッパーがモバイルアプリの設定値を変更できる Google タグ マネージャーの管理画面を使用して作成する。アプリケーションのバイナリをビルドし直して再送信する必要はない アプリマーケットプレイス。

これは、アプリケーションの設定値やフラグを管理する際に便利です。 次のような項目が含まれます。

• さまざまな UI 設定と表示文字列
• アプリで配信される広告のサイズ、場所、タイプ
• さまざまなゲームの設定

構成値はルールを使用して実行時に評価することもできるため、 次のような構成です。

• 画面サイズに基づいて広告バナーのサイズを決定する
• 言語と地域を使用して UI 要素を構成する

また、Google タグ マネージャーを使用すると、 説明します。重要なイベントをデータレイヤーにプッシュし、 指定することもできます

始める前に

このスタートガイドを始める前に、次の手順を行います。

• Android SDK をインストールします。
• Google Play 開発者サービス SDK をダウンロードします。
• Google タグ マネージャー アカウントを作成する
• Google タグ マネージャー コンテナを設定する

これらのステップを完了したら、このガイドの残りの部分で、 Google タグ マネージャーを Android アプリ内で設定、使用する。

スタートガイド

このスタートガイドに従うと、次の方法を理解できます。

• Google タグ マネージャーをプロジェクトに追加する
• アプリでタグ マネージャーを初期化する
• タグ マネージャー コンテナから設定値を取得する
• 値とイベントを dataLayer に push する
• コンテナをプレビュー、デバッグし、公開する

このガイドでは、Cute Animals のコード スニペットを使用しています サンプル アプリケーション Google Play 開発者サービス SDK。 このプロジェクトの完全なソースは <android-sdk-directory>/extras/google/google_play_services/tagmanager/cuteanimals で入手できます。

1. Google タグ マネージャーをプロジェクトに追加する

Google タグ マネージャーをプロジェクトに追加するには:

1. <ph type="x-smartling-placeholder"></ph> Google Play 開発者サービス SDK をセットアップする
2. 以外の IDE を使用している場合 Android Studio で以下の権限を AndroidManifest.xml ファイル:

   <!-- For TagManager SDK -->
   <uses-permission android:name="android.permission.INTERNET" />
   <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

3. <ph type="x-smartling-placeholder"></ph>を有効にするには InstallReferrerReceiver: Google アナリティクス レシーバーを呼び出します キャンペーン データを設定するには、次のコードを AndroidManifest.xml ファイル:

   <!-- Used for install referrer tracking-->
   <service android:name="com.google.android.gms.tagmanager.InstallReferrerService" />
   <receiver
     android:name="com.google.android.gms.tagmanager.InstallReferrerReceiver"
     android:exported="true">
     <intent-filter>
       <action android:name="com.android.vending.INSTALL_REFERRER" />
     </intent-filter>
   </receiver>

2. プロジェクトへのデフォルトのコンテナ ファイルの追加

注: まだ Google タグ マネージャーの管理画面でコンテナを設定済みであること 完了したらこのステップに戻ってください。

Google タグ マネージャーでは、アプリの初回実行時にデフォルトのコンテナが使用されます。デフォルト 新しいコンテナを取得できるようになるとすぐに、コンテナは使用されなくなります。 接続します

デフォルトのコンテナ バイナリをダウンロードしてアプリケーションに追加するには:

1. Google タグ マネージャーの管理画面にログインします。
2. ダウンロードするコンテナのバージョンを選択します。
3. [ダウンロード] ボタンをクリックしてコンテナ バイナリを取得します。
4. ダウンロードしたコンテナ バイナリ ファイルを未加工リソースとしてプロジェクトに追加します。
   1. フォルダ内の raw サブフォルダが <project-root>/res/ が存在しない場合は、作成してください。
   2. 必要に応じてコンテナ バイナリ ファイルの名前を変更します。これは、 英小文字、数字、アンダースコアのみ使用できます
   3. コンテナ バイナリ ファイルをフォルダにコピーする <project-root>/res/raw。

バイナリ ファイルの使用をおすすめしますが、コンテナにルールやタグが含まれていない場合は、 シンプルな JSON ファイルを使用することもできます。

3. Google タグ マネージャーを初期化する

アプリケーションで Google タグ マネージャーを初期化するには:

1. TagManager シングルトンを取得します。

   TagManager tagManager = TagManager.getInstance(this);

2. TagManager シングルトンを使用して、コンテナの読み込みをリクエストします。その際、 Google タグ マネージャーのコンテナ ID とデフォルトのコンテナ 表示されます。コンテナ ID は大文字で指定し、Google タグのコンテナ ID と完全に一致する必要があります。 マネージャー ウェブ インターフェースloadContainerPreferNonDefault() の呼び出しは非ブロックである このメソッドは、 <ph type="x-smartling-placeholder"></ph> PendingResult:

   PendingResult<ContainerHolder> pending =
           tagManager.loadContainerPreferNonDefault(CONTAINER_ID,
           R.raw.defaultcontainer_binary);

3. を使用 ResultCallback を呼び出して、 ContainerHolder 読み込みが完了するかタイムアウトすると、次の処理が行われます。

   // The onResult method will be called as soon as one of the following happens:
   //     1. a saved container is loaded
   //     2. if there is no saved container, a network container is loaded
   //     3. the 2-second timeout occurs
   pending.setResultCallback(new ResultCallback<ContainerHolder>() {
       @Override
       public void onResult(ContainerHolder containerHolder) {
           ContainerHolderSingleton.setContainerHolder(containerHolder);
           Container container = containerHolder.getContainer();
           if (!containerHolder.getStatus().isSuccess()) {
               Log.e("CuteAnimals", "failure loading container");
               displayErrorToUser(R.string.load_error);
               return;
           }
           ContainerLoadedCallback.registerCallbacksForContainer(container);
           containerHolder.setContainerAvailableListener(new ContainerLoadedCallback());
           startMainActivity();
       }
   }, TIMEOUT_FOR_CONTAINER_OPEN_MILLISECONDS, TimeUnit.MILLISECONDS);

   注: デフォルトでは、コンテナは更新の対象となります。 12 時間ごとにネットワーク経由で トラフィックが配信されますコンテナを手動で更新する方法をご確認ください。

   ContainerHolder シングルトンを作成する

   ContainerHolder のインスタンスは、 説明します。そのため、上記の例では ContainerHolderSingleton ユーティリティ クラスを使用しています。 ContainerHolder インスタンスへのアクセスを管理します。これが、 ContainerHolderSingleton クラスは次のようになります。

   package com.google.android.tagmanager.examples.cuteanimals;
   
   import com.google.android.gms.tagmanager.ContainerHolder;
   
   /**
    * Singleton to hold the GTM Container (since it should be only created once
    * per run of the app).
    */
   public class ContainerHolderSingleton {
       private static ContainerHolder containerHolder;
   
       /**
        * Utility class; don't instantiate.
        */
       private ContainerHolderSingleton() {
       }
   
       public static ContainerHolder getContainerHolder() {
           return containerHolder;
       }
   
       public static void setContainerHolder(ContainerHolder c) {
           containerHolder = c;
       }
   }

サンプル アプリケーションのコード スニペット

次のスニペット サンプル Activity の onCreate() メソッドに実装されたパターン全体を示しています。

package com.google.android.tagmanager.examples.cuteanimals;

import java.util.concurrent.TimeUnit;
import java.util.Map;

import android.app.Activity;
import android.app.AlertDialog;
import android.content.DialogInterface;
import android.content.Intent;
import android.os.Bundle;
import android.util.Log;

import com.google.android.gms.common.api.PendingResult;
import com.google.android.gms.common.api.ResultCallback;
import com.google.android.gms.tagmanager.Container;
import com.google.android.gms.tagmanager.Container.FunctionCallMacroCallback;
import com.google.android.gms.tagmanager.Container.FunctionCallTagCallback;
import com.google.android.gms.tagmanager.ContainerHolder;
import com.google.android.gms.tagmanager.TagManager;

/**
 * Displays simple splash screen while GTM container is loading. Once the container is loaded,
 * launches the {@link MainActivity}.
 */
public class SplashScreenActivity extends Activity {
    private static final long TIMEOUT_FOR_CONTAINER_OPEN_MILLISECONDS = 2000;
    private static final String CONTAINER_ID = "GTM-XXXX";

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_splashscreen);

        TagManager tagManager = TagManager.getInstance(this);

        // Modify the log level of the logger to print out not only
        // warning and error messages, but also verbose, debug, info messages.
        tagManager.setVerboseLoggingEnabled(true);

        PendingResult<ContainerHolder> pending =
                tagManager.loadContainerPreferNonDefault(CONTAINER_ID,
                R.raw.defaultcontainer_binary);

        // The onResult method will be called as soon as one of the following happens:
        //     1. a saved container is loaded
        //     2. if there is no saved container, a network container is loaded
        //     3. the 2-second timeout occurs
        pending.setResultCallback(new ResultCallback<ContainerHolder>() {
            @Override
            public void onResult(ContainerHolder containerHolder) {
                ContainerHolderSingleton.setContainerHolder(containerHolder);
                Container container = containerHolder.getContainer();
                if (!containerHolder.getStatus().isSuccess()) {
                    Log.e("CuteAnimals", "failure loading container");
                    displayErrorToUser(R.string.load_error);
                    return;
                }
                ContainerLoadedCallback.registerCallbacksForContainer(container);
                containerHolder.setContainerAvailableListener(new ContainerLoadedCallback());
                startMainActivity();
            }
        }, TIMEOUT_FOR_CONTAINER_OPEN_MILLISECONDS, TimeUnit.MILLISECONDS);
  // Rest of the Activity definition.
}

4. コンテナから構成値を取得する

コンテナが読み込まれたら、 Container.get<type>() メソッド。構成値は、Terraform を使用して Google タグ マネージャーの値コレクション変数。たとえば、次のメソッドで UI 要素に使用することが決定された最新の色を取得し、 整数:

/**
 * Returns an integer representing a color.
 */
private int getColor(String key) {
    return colorFromColorName(containerHolder.getContainer().getString(key));
}

このコードは、コンテナから色名を取得するために次の 2 つの処理を行います。

1. 次のコマンドを使用して、ContainerHolder から Container を取得します。 <ph type="x-smartling-placeholder"></ph> ContainerHolder.getContainer()。
2. 次を使用して色の値を取得します。 <ph type="x-smartling-placeholder"></ph> Container.getString(key)。ここで Google タグ マネージャーの管理画面でキーと値を定義した。

5. イベントと値を dataLayer にプッシュする

Google タグ マネージャーには dataLayer もあり、ここから情報をプッシュできます。 アプリケーションに関する情報。アプリケーションの他の部分で読み込んだり、タグの配信に使用されたりします。 Google タグマネージャーの管理画面で設定した タグが表示されます

dataLayer に値をプッシュする

dataLayer は、使用可能な永続性レイヤを提供します。 Key-Value ペアをアプリケーションの他の部分で使用する Google タグ マネージャー タグへの入力として使用します。

dataLayer に値を push するには、次のパターンに従います。

1. <ph type="x-smartling-placeholder"></ph> DataLayer シングルトン:

   DataLayer dataLayer = TagManager.getInstance(context).getDataLayer();

2. を使用してイベントをプッシュする DataLayer.push():

   // Put the image_name into the data layer for future use.
   TagManager.getInstance(this).getDataLayer().push(IMAGE_NAME_KEY, imageName);

dataLayer から値を取得するには、次のコマンドを使用します。 <ph type="x-smartling-placeholder"></ph> DataLayer.get(key)。

dataLayer にイベントをプッシュする

dataLayer にイベントを push すると、アプリケーション コードを これらのイベントに応答して配信する タグを指定できます

たとえば、Google アナリティクスのスクリーン ビュー トラッキングの呼び出しをアプリケーションにハードコードする代わりに、 スクリーン イベントを dataLayer にプッシュし、 Google タグ マネージャーの管理画面。これにより、タグの変更や追加を柔軟に行うことができます。 画面イベントに応答する追加のタグを追加できます。アプリのコードを更新する必要はありません。

イベントを dataLayer に push するには、次のパターンを使用します。

1. <ph type="x-smartling-placeholder"></ph> DataLayer シングルトン:

   DataLayer dataLayer = TagManager.getInstance(context).getDataLayer();

2. を使用してイベントをプッシュする DataLayer.pushEvent():

   dataLayer.pushEvent("openScreen", DataLayer.mapOf("screenName", screenName));

   <ph type="x-smartling-placeholder"></ph> DataLayer.mapOf() は、地図のレイヤを簡単に生成できるユーティリティ メソッドです。 イベントのプッシュと同時に dataLayer を更新する Key-Value ペアです。

サンプル アプリケーションのコード スニペット

次のユーティリティ クラスは、画面に関する情報などのイベントをプッシュする方法を示しています。 アプリでの dataLayer での開閉:

package com.google.android.tagmanager.examples.cuteanimals;

import android.content.Context;

import com.google.android.gms.tagmanager.DataLayer;
import com.google.android.gms.tagmanager.TagManager;

/**
 * Utility class.
 */
public class Utils {
    private Utils() {
        // private constructor.
    }

    /**
     * Push an "openScreen" event with the given screen name. Tags that match that event will fire.
     */
    public static void pushOpenScreenEvent(Context context, String screenName) {
        DataLayer dataLayer = TagManager.getInstance(context).getDataLayer();
        dataLayer.pushEvent("openScreen", DataLayer.mapOf("screenName", screenName));
    }

    /**
     * Push a "closeScreen" event with the given screen name. Tags that match that event will fire.
     */
    public static void pushCloseScreenEvent(Context context, String screenName) {
        DataLayer dataLayer = TagManager.getInstance(context).getDataLayer();
        dataLayer.pushEvent("closeScreen", DataLayer.mapOf("screenName", screenName));
    }
}

6. プレビュー、デバッグ、公開

あるバージョンのコンテナを公開する前に、プレビューして動作を確認できます 意図したとおりに操作しますGoogle タグ マネージャーでは、コンテナの各バージョンをプレビューできる ウェブ インターフェースでリンクと QR コードを生成し、それらを使用してアプリを開く。 詳細ログモードを有効にして、予期しない動作をデバッグすることもできます。

プレビューしています

コンテナのバージョンをプレビューするには、次の操作を行います。

1. このプレビュー Activity を AndroidManifest ファイルに追加します。

   <!--  Add preview activity. -->
   <activity
       android:name="com.google.android.gms.tagmanager.PreviewActivity"
       android:label="@string/app_name"
       android:noHistory="true">  <!-- optional, removes the previewActivity from the activity stack. -->
       <intent-filter>
         <data android:scheme="tagmanager.c.com.google.android.tagmanager.examples.cuteanimals" />
         <action android:name="android.intent.action.VIEW" />
         <category android:name="android.intent.category.DEFAULT" />
         <category android:name="android.intent.category.BROWSABLE"/>
       </intent-filter>
   </activity>

   次の行を変更して、アプリのパッケージ名を含めます。

   <data android:scheme="tagmanager.c.com.google.android.tagmanager.examples.cuteanimals" />

2. Google タグ マネージャーの管理画面でプレビュー リンクを生成する <ph type="x-smartling-placeholder">
   </ph>
   1. Google タグ マネージャーにログインします。
   2. プレビューするコンテナのバージョンを選択します。
   3. プレビュー ボタンをクリックします
   4. アプリのパッケージ名を入力し、[Generate started preview link] をクリックします。
3. 生成されたリンクまたは QR コードを使用してアプリを起動します
4. プレビュー モードを終了するには、[終了プレビュー リンクを生成] で生成されたリンクを使用します ウェブ インターフェースの [ブロック] オプションで確認できます。

デバッグ

コンテナの実装のトラブルシューティングが必要な場合は、次のコマンドで詳細ログを有効にします。 <ph type="x-smartling-placeholder"></ph> TagManager.setVerboseLoggingEnabled(true):

// Modify the log level of the logger to print out not only
// warning and error messages, but also verbose, debug, info messages.
tagManager.setVerboseLoggingEnabled(true);

公開

コンテナをプレビューし、意図したとおりに機能していることを確認したら、次のことができます。 コンテナを公開します。お客様の ユーザーが次回開いたときに、コンテナの設定値、タグ、イベントを コンテナが更新されますコンテナの更新の詳細を確認する。

詳細設定

以降のセクションでは、インフラストラクチャをさらにカスタマイズするために使用する高度な構成オプションについて説明します。 Google タグ マネージャーの実装。

コンテナの更新

デフォルトでは、コンテナは 12 時間ごとに更新されます。手動で更新するには を使用します。 ContainerHolder.refresh():

ContainerHolderSingleton.getContainerHolder().refresh();

これはすぐには返されない非同期呼び出しです。ネットワーク トラフィックを減らすために、refresh() が次の場合があります 15 分に 1 回しか呼び出されない場合、何も行われません。

注: このスニペットでは、 ContainerHolderSingleton ユーティリティ クラス（初期化の例を参照） ご覧ください。

サンプル アプリケーションのコード スニペット

public void refreshButtonClicked(@SuppressWarnings("unused") View view) {
    Log.i(TAG, "refreshButtonClicked");
    ContainerHolderSingleton.getContainerHolder().refresh();

    // Push the "refresh" event to trigger firing an analytics tag.
    TagManager.getInstance(this).getDataLayer().push("event", "refresh");
    // Push the "custom tag" event to trigger firing a custom function call tag.
    TagManager.getInstance(this).getDataLayer().push("event", "custom_tag");
    updateCategories();
}