システムオーバーレイの作成 (フローティングアプリの実装) - Android

常に前面に表示されるシステムオーバーレイを使ったアプリを紹介します。

プロジェクトの作成

Android アプリケーションプロジェクトを作成します。
[New Android Application]ダイアログボックスが表示されますので、以下を設定します。
  • Application Name: "SystemOverlay"
  • Project Name: "SystemOverlay"
  • Package Name: "com.iPentec.systemoverlay"
  • Minimum Required SDK: "API 8: Android 2.2 (Froyo)"
  • Target SDK: "API 17: Android 4.2 (Jelly Bean)"
  • Compile With: "API 17: Android 4.2 (Jelly Bean)"
  • Theme: "Holo Light with Dark Action Bar"

UI

下図のUIを作成します。

MainActivity

メインアクティビティにはボタンを2津配置します。

overlay.xml

オーバーレイとして表示する画面のレイアウトです。
以下のXMLを記述します。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >
 
    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello! Overlay App"
        android:textSize="32dp" />
 
</LinearLayout>

デザイナで閲覧した場合下図の状態となります。


TextViewの文字サイズを大きくする場合は、プロパティウィンドウの"Text Size"を編集します。

AndroidManifest

AndroidManifest.xml を編集します。
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.iPentec.systemoverlay"
    android:versionCode="1"
    android:versionName="1.0" >

    <uses-sdk
        android:minSdkVersion="8"
        android:targetSdkVersion="17" />
    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>

    <application
        android:allowBackup="true"
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name"
        android:theme="@style/AppTheme" >
        <activity
            android:name="com.iPentec.systemoverlay.MainActivity"
            android:label="@string/app_name" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <service android:name="LayerService" ></service>
    </application>

</manifest>

解説

"uses-permision"で"android.permission.SYSTEM_ALERT_WINDOW"を追加します。このパーミッションが無い場合システムオーバーレイは利用できません。

EclipseのAndroidManifestエディターで編集した場合は下図の状態となります。


下記のserviceタグを記述しサービスを定義します。
  <service android:name="LayerService" ></service>

EclipseのAndroidManifestエディターで編集した場合は下図の状態となります。エディタ画面の下部の[Application Nodes]に"LKayerService"がついkされています。また右下の[Attributes for LayerService]欄のNameにはサービスを実装するクラス名を設定します。

コード

下記のコードを記述します。

MainActivity.java

package com.iPentec.systemoverlay;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.View;
import android.widget.Button;
import android.content.Intent;

public class MainActivity extends Activity {
  Button start_button;
  Button stop_button;

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
  }

  @Override
  public boolean onCreateOptionsMenu(Menu menu) {
    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.main, menu);
    return true;
  }

  public void button1_click(View view){
    startService(new Intent(MainActivity.this, LayerService.class));
  }

  public void button2_click(View view){  
    stopService(new Intent(MainActivity.this, LayerService.class));
  } 
}
解説
button1_click
Startボタンがタップされた場合の動作です。
  startService(new Intent(MainActivity.this, LayerService.class));
startServiceメソッドを呼び出しサービスを開始します。引数にはサービスのインテントを与えます。
button2_click
Stopボタンがタップされた場合の動作です。
  stopService(new Intent(MainActivity.this, LayerService.class));
stopService()メソッドを呼び出し、サービスを停止します。

LayerService.java

package com.iPentec.systemoverlay;

import android.view.View;
import android.content.Intent;
import android.view.WindowManager;
import android.app.Service;
import android.view.LayoutInflater;
import android.graphics.PixelFormat;
import android.os.IBinder;
import android.content.Context;

public class LayerService extends Service {
  View view;
  WindowManager wm;
  
  @Override
  public int onStartCommand(Intent intent, int flags, int startId){
    super.onStartCommand(intent, flags, startId);
  
    LayoutInflater layoutInflater = LayoutInflater.from(this);

    WindowManager.LayoutParams params = new WindowManager.LayoutParams(
      WindowManager.LayoutParams.WRAP_CONTENT,
      WindowManager.LayoutParams.WRAP_CONTENT,
      WindowManager.LayoutParams.TYPE_SYSTEM_ALERT,
      WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE |
      WindowManager.LayoutParams.FLAG_FULLSCREEN |
      WindowManager.LayoutParams.FLAG_NOT_TOUCH_MODAL,
      PixelFormat.TRANSLUCENT);
  
    wm = (WindowManager) getApplicationContext().getSystemService(Context.WINDOW_SERVICE);
      
    view = layoutInflater.inflate(R.layout.overlay, null);

    wm.addView(view, params);
      
    return START_STICKY;
  }

  @Override
  public void onCreate() {
      super.onCreate();
  }

  @Override
  public void onDestroy() {
    super.onDestroy();
    wm.removeView(view);
  }

  @Override
  public IBinder onBind(Intent intent) {
    // TODO Auto-generated method stub
    return null;
  }
}
解説
Serviceクラスから派生したカスタムサービスクラスのため、以下の4津のメソッドをオーバーライドする必要があります。
  @Override
  public int onStartCommand(Intent intent, int flags, int startId){
  }

  @Override
  public void onCreate() {
  }

  @Override
  public void onDestroy() {
  }

  @Override
  public IBinder onBind(Intent intent) {
  }
onCreateはサービス作成時、onDestroyはサービスの廃棄時、onBindはサービスがバインドされた際に呼び出されます。onBineでは呼び出し元から渡されたインテントを受け取ることができます。onStartComandはサービスが開始された際に呼び出されます。
onStartCommand
サービスが開始された際の処理です。
  @Override
  public int onStartCommand(Intent intent, int flags, int startId){
    super.onStartCommand(intent, flags, startId);
  
    LayoutInflater layoutInflater = LayoutInflater.from(this);

    WindowManager.LayoutParams params = new WindowManager.LayoutParams(
      WindowManager.LayoutParams.WRAP_CONTENT,
      WindowManager.LayoutParams.WRAP_CONTENT,
      WindowManager.LayoutParams.TYPE_SYSTEM_ALERT,
      WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE |
      WindowManager.LayoutParams.FLAG_FULLSCREEN |
      WindowManager.LayoutParams.FLAG_NOT_TOUCH_MODAL,
      PixelFormat.TRANSLUCENT);
  
    wm = (WindowManager)getApplicationContext().getSystemService(Context.WINDOW_SERVICE);
      
    view = layoutInflater.inflate(R.layout.overlay, null);

    wm.addView(view, params);
      
    return START_STICKY;
  }

LayoutInflater layoutInflater = LayoutInflater.from(this);
により、LayoutInflaterを取得します。

  WindowManager.LayoutParams params = new WindowManager.LayoutParams(
    WindowManager.LayoutParams.WRAP_CONTENT,
    WindowManager.LayoutParams.WRAP_CONTENT,
    WindowManager.LayoutParams.TYPE_SYSTEM_ALERT,
    WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE |
    WindowManager.LayoutParams.FLAG_FULLSCREEN |
    WindowManager.LayoutParams.FLAG_NOT_TOUCH_MODAL,
    PixelFormat.TRANSLUCENT);
システムオーバーレイで表示する画面のレイアウトパラメータを作成します。

  wm = (WindowManager)getApplicationContext().getSystemService(Context.WINDOW_SERVICE);
WindowManagerを取得します。

  view = layoutInflater.inflate(R.layout.overlay, null);
オーバーレイとして表示するXMLレイアウトファイルのViewを取得します。

  wm.addView(view, params);
WindowManagerにオーバーレイとして表示するViewを追加します。

  return START_STICKY;
START_STICKYを返します。システムはサービスを新たにインスタンス化し、サービスの再起動を行います。
onDestroy
サービスの廃棄時の処理です。
サービスが廃棄された際はWindowManagerのremoveView()メソッドを呼び出し
Override
public void onDestroy() {
  super.onDestroy();
  wm.removeView(view);
}

実行結果

プロジェクトを実行します。下図の画面が表示されます。


[Start]ボタンをタップします。画面の中央に"Hello! Overlay App"のテキストが表示されます。


[ホーム]ボタンを押してホーム画面に戻っても"Hello! Overlay App"のテキストは表示されたままです。アプリ一覧画面を表示しても、アプリケーションを起動しても"Hello! Overlay App"のテキストは表示されたままです。


元のアプリに切り替えて[Stop]ボタンを押すと"Hello! Overlay App"のテキストは非表示になります。

著者
iPentecのプログラマー、最近はAIの積極的な活用にも取り組み中。
とっても恥ずかしがり。
掲載日: 2013-04-22
iPentec all rights reserverd.