こんにちは、プロダクト開発グループ SDK チームの山田です。

弊社では APPBOX SDK を利用してパッケージアプリというものを作成しております。

パッケージアプリとは、アプリとしては比較的シンプルなものとなりますが APPBOX SDK の機能を活用し、安価且つ短い期間でアプリのリリースができるものとなっております。

今回は、このアプリを作成する際にどういった SDK の機能を利用し、どういった構成になっているかといったところを簡単に紹介できればと思います。

参考：APPBOX パッケージ

※今回は Android 版アプリの話となります

アプリの構成について

まずは、作成するアプリがどういったものか、紹介できればと思います。

①アプリ初回起動時

チュートリアルを開始し、その後にユーザーの情報設定を行います。

②ホーム画面

ユーザー情報設定完了後や、通常起動時に遷移する画面となります。ここでは位置情報の権限許諾なども行っています。

また、ホーム画面ではタブの切り替えによってクーポンの利用や左上のメニューを押下することで、各種設定などを行えます。

このようなアプリとなっていますが、実はこれらのほとんどは SDK 機能の呼び出しのみで構成されています。

APPBOX SDK は機能を付属した画面も提供しているため、基本的にはこのアプリではホーム画面のタブやメニューのみを用意し、あとは SDK 提供の画面を利用しているといった構成となっています。

※チュートリアルやクーポンの内容、ホームタブ内の画面の構成などは APPBOX 管理画面よりいつでも変更可能です

そして、このアプリについては SDK の設定や呼び出す画面、呼び出す機能などを設定するファイルがあり、アプリとしてはその設定を読み込んでアプリの全体を構成するといった作りとなっています。

設定内容については、主にフッタータブの数や表示する画面、ドロワーメニュー内の項目やそこから呼び出す機能、位置情報やプッシュ通知の利用などといったものが設定可能です。

このアプリですと、おおまかとなりますが下記のような設定内容となっています。

プッシュ通知利用：あり（SDK 機能）
位置情報利用：あり（SDK 機能）
ユーザー情報利用：あり（SDK 機能）

フッタータブ数 : 2
フッタータブ 1 (ホーム) -> フリーレイアウト画面呼び出し（SDK 機能）
フッタータブ 2 (クーポン) -> クーポン画面呼び出し（SDK 機能）
ドロワーメニュー 1（店舗検索） -> 店舗検索画面呼び出し （SDK 機能）
ドロワーメニュー 2（ユーザー情報） -> ユーザー情報呼び出し（SDK 機能）
ドロワーメニュー 3（利用規約） -> 内部 WebView へ遷移（SDK 機能）
ドロワーメニュー 4（よくある質問） -> 内部 WebView へ遷移（SDK 機能）
ドロワーメニュー 5（お問い合わせ） -> 外部ブラウザへ連携

これらの設定をどう反映しているかについて、続けて紹介できればと思います。

SDK の設定について

APPBOX SDK には様々な設定があり、それらをビルドごとに設定できるようになっています。

参考：SDK 設定値

SDK の設定については下記のような各種設定用の config.gradle をアプリ毎に作成し、ビルド時に読み込みを行うようにしています。

config.gradle

ext {
      appboxBuildConfig = [
          appId                      : 'jp.iridge.appbox.sample',
          appName                    : 'サンプルアプリ',
          appboxAppId                : '"契約時に発行されるアプリ専用ID"',
          appboxTenantId             : '"契約時に発行されるテナントID"',
          versionCode                : 1,
          versionName                : '1.0.0',
          storePass                  : 'package_key_pass',
          keyAlias                   : 'package_key_alias',
          keyPass                    : 'package_key_alias_pass',
          appboxUseSegment           : 'true', 
          appboxUseLocationGps       : true, // 位置情報を利用するかどうか。利用する：true 利用しない：false
          appboxUseLocationBeacon    : true, // iビーコンによる位置情報を利用するかどうか。利用する：true 利用しない：false
          appboxUseLocationWiFi      : true  // Wi-Fiによる位置情報を利用するかどうか。利用する：true 利用しない：false
     ]
}

アプリ側の gradle では上記の設定を AndroidManifest.xml やソースコードへ反映をするようにしています。

app/build.gradle

apply from: 'config.gradle'
・
・
・
def locationSourceString = getLocationSources()
defaultConfig {
      minSdkVersion 24
    targetSdkVersion 35
    applicationId appboxBuildConfig.appId
    versionCode appboxBuildConfig.versionCode
    versionName appboxBuildConfig.versionName

        manifestPlaceholders.appName = appboxBuildConfig.appName
        manifestPlaceholders.useSegment = appboxBuildConfig.appboxUseSegment
        manifestPlaceholders.locationSources = locationSourceString
    buildConfigField "String", "APPBOX_TENANT_ID", appboxBuildConfig.appboxTenantId
    buildConfigField "String", "APPBOX_APP_ID", appboxBuildConfig.appboxAppId
}
・
・
・
// config 設定を読み取り、SDK 設定用の文字列に変換
def getLocationSources() {
    def locationSourceArray = []
    if (appboxBuildConfig.appboxUseLocationGps) {
        locationSourceArray += "GPS"
    }
    if (appboxBuildConfig.appboxUseLocationWiFi) {
        locationSourceArray += "Wi-Fi"
    }
    if (appboxBuildConfig.appboxUseLocationBeacon) {
        locationSourceArray += "iBeacon"
    }
    return locationSourceArray.join(",")
}

※ applicationId などは厳密には SDK の設定じゃないのですが build.gradle に設定する情報といったところで一括で指定できるようにしています

app/AndroidManifest.xml

<meta-data
      android:name="APPBOX_LOCATION_SOURCES"
      android:value="${locationSources}" />
<meta-data
      android:name="APPBOX_USES_SEGMENT_SETTINGS"
      android:value="${useSegment}"/>
・
・
・

また、位置情報を利用する場合は権限の有無なども必要になってきます。

こちらについては別途ビルド時に実行するシェルで今回のアプリに必要な権限を config.gradle から読み取り、権限を宣言をした AndroidManifest.xml を出力してビルド実行時の自動マージに任せるという動作をさせています。

アプリの設定について

アプリの設定については下記のような設定ファイルをアプリ毎に作成し、フッターメニューの指定に利用しています。

config.xml

<resources>
    <string-array name="footer_tab_destinations">
        <item>appbox://freelayout/home</item>
        <item>appbox://coupons</item>
    </string-array>

    <array name="footer_tab_icons">
        <item>@drawable/selector_ic_footer_tab_1</item>
        <item>@drawable/selector_ic_footer_tab_2</item>
    </array>
</resources>