ライブカードはタイムラインの現在のセクションに表示され、現在に関連する情報が表示されます。
ライブカードは、タスクに積極的に関与しているユーザーが Glass の補足情報を定期的にチェックする場合に適しています。たとえば、ランニングの時間を数分ごとにチェックする、曲をスキップまたは一時停止するときに音楽プレーヤーを制御する、などです。
Glass で初めて開発を行う場合は、まず進行中のタスクガイドをご覧ください。このドキュメントでは、設計のベスト プラクティスに従い、ライブカードを使用して完全な Glassware を作成する方法について説明します。
仕組み
ライブカードを使用すると、関連する限り、タイムラインの現在のセクションにカードを保持できます。静的カードとは異なり、ライブカードはタイムラインに保持されません。ユーザーは、使い終わった後に明示的にカードを削除します。
ユーザーは通常、メインメニューで音声コマンドを話しかけることでライブカードを起動します。これにより、カードをレンダリングするバックグラウンド サービスが開始されます。カードをタップすると、タイムラインからカードを閉じるなどの操作を行えるメニュー項目が表示されます。
アフィリエイト住所アセットの用途
ライブカードは、ユーザーが頻繁に出入りできる進行中のタスク用に設計されています。たとえば、あるアクションの実行ステータスを示すディスプレイ、ナビゲーション中のアニメーション マップ、音楽プレーヤーなどです。
ライブカードには、ユーザーとのリアルタイムのやり取りや UI のリアルタイム更新が必要な UI にも適しているという利点もあります。
ライブカードを使用している場合は、タイムラインでユーザー エクスペリエンスを制御できます。このため、ライブカードを前後にスワイプすると、ライブカード自体に基づいてタイムラインが移動します。さらに、画面はシステムの動作に基づいてオンとオフが切り替わります（ユーザーが操作しない状態で 5 秒経過した後、または頭を上下に動かしたとき）。
ただし、ライブカードは、センサーや GPS データなど、没入型と同じ機能の多くにアクセスできます。これにより、やりがいのあるエクスペリエンスを生み出すことができ、ユーザーはタイムライン エクスペリエンスを保ちながらメッセージの確認などを行うことができます。
アーキテクチャ
ライブカードは、表示されている間ずっと所有するために長い実行コンテキストを必要とするため、バックグラウンド サービス内で管理します。
これにより、サービスの開始後、またはサービスがモニタリングする他のイベントに応じて、ライブカードを公開してレンダリングできます。ライブカードは、低頻度（数秒に 1 回）、高頻度（システムが更新できる回数）でレンダリングできます。
ライブカードが不要になった場合は、サービスを破棄してレンダリングを停止します。
低周波数レンダリング
低頻度レンダリングは少数の Android ビューに限定され、数秒に 1 回しかディスプレイを更新できません。
シンプルなレンダリングにより、継続的なレンダリングや頻繁な更新を必要としないシンプルなコンテンツを使用して、ライブカードを簡単に作成できます。
高周波数レンダリング
高頻度レンダリングでは、Android グラフィック フレームワークで利用可能なオプションを使用できます。
このシステムでは、2D ビューやレイアウトを使用して直接描画するライブカードの実際の裏面や、OpenGL を使用する複雑な 3D グラフィックが提供されます。
低頻度のライブカードの作成
低頻度レンダリングには、RemoteViews オブジェクトが提供する UI が必要です。このオブジェクトは、次の Android レイアウトとビューのサブセットをサポートしています。
低周波数レンダリングを使用するのは、次のような場合です。
- 前述した標準の Android View API のみが必要です。
- 比較的まれにしか更新を行う必要がない（更新の間隔は数秒）
留意点:
- ライブカードがタイムラインを公開するためには、必ず
setAction()を使用してPendingIntentを宣言する必要があります。 - 公開後にカードを変更するには、更新された RemoteViews オブジェクトを持つカードで
setViews()を呼び出してから、もう一度公開します。
低頻度のライブカードを作成するには:
レンダリングするレイアウトまたはビューを作成します。次の例は、架空のバスケットボール ゲームのレイアウトを示しています。
<TextView android:id="@+id/home_team_name_text_view" android:layout_width="249px" android:layout_height="wrap_content" android:layout_alignParentRight="true" android:gravity="center" android:textSize="40px" /> <TextView android:id="@+id/away_team_name_text_view" android:layout_width="249px" android:layout_height="wrap_content" android:layout_alignParentLeft="true" android:gravity="center" android:textSize="40px" /> <TextView android:id="@+id/away_score_text_view" android:layout_width="249px" android:layout_height="wrap_content" android:layout_alignLeft="@+id/away_team_name_text_view" android:layout_below="@+id/away_team_name_text_view" android:gravity="center" android:textSize="70px" /> <TextView android:id="@+id/home_score_text_view" android:layout_width="249px" android:layout_height="wrap_content" android:layout_alignLeft="@+id/home_team_name_text_view" android:layout_below="@+id/home_team_name_text_view" android:gravity="center" android:textSize="70px" /> <TextView android:id="@+id/footer_text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentLeft="true" android:layout_marginBottom="33px" android:textSize="26px" />ライブカードを管理し、レイアウトやビューをレンダリングするサービスを作成します。このサンプル サービスは、30 秒ごとに架空のバスケットボール ゲームのスコアを更新します。
import java.util.Random; import com.google.android.glass.timeline.LiveCard; import com.google.android.glass.timeline.LiveCard.PublishMode; import android.app.PendingIntent; import android.app.Service; import android.content.Intent; import android.os.Handler; import android.os.IBinder; import android.widget.RemoteViews; public class LiveCardService extends Service { private static final String LIVE_CARD_TAG = "LiveCardDemo"; private LiveCard mLiveCard; private RemoteViews mLiveCardView; private int homeScore, awayScore; private Random mPointsGenerator; private final Handler mHandler = new Handler(); private final UpdateLiveCardRunnable mUpdateLiveCardRunnable = new UpdateLiveCardRunnable(); private static final long DELAY_MILLIS = 30000; @Override public void onCreate() { super.onCreate(); mPointsGenerator = new Random(); } @Override public int onStartCommand(Intent intent, int flags, int startId) { if (mLiveCard == null) { // Get an instance of a live card mLiveCard = new LiveCard(this, LIVE_CARD_TAG); // Inflate a layout into a remote view mLiveCardView = new RemoteViews(getPackageName(), R.layout.main_layout); // Set up initial RemoteViews values homeScore = 0; awayScore = 0; mLiveCardView.setTextViewText(R.id.home_team_name_text_view, getString(R.string.home_team)); mLiveCardView.setTextViewText(R.id.away_team_name_text_view, getString(R.string.away_team)); mLiveCardView.setTextViewText(R.id.footer_text, getString(R.string.game_quarter)); // Set up the live card's action with a pending intent // to show a menu when tapped Intent menuIntent = new Intent(this, MenuActivity.class); menuIntent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK | Intent.FLAG_ACTIVITY_CLEAR_TASK); mLiveCard.setAction(PendingIntent.getActivity( this, 0, menuIntent, 0)); // Publish the live card mLiveCard.publish(PublishMode.REVEAL); // Queue the update text runnable mHandler.post(mUpdateLiveCardRunnable); } return START_STICKY; } @Override public void onDestroy() { if (mLiveCard != null && mLiveCard.isPublished()) { //Stop the handler from queuing more Runnable jobs mUpdateLiveCardRunnable.setStop(true); mLiveCard.unpublish(); mLiveCard = null; } super.onDestroy(); } /** * Runnable that updates live card contents */ private class UpdateLiveCardRunnable implements Runnable{ private boolean mIsStopped = false; /* * Updates the card with a fake score every 30 seconds as a demonstration. * You also probably want to display something useful in your live card. * * If you are executing a long running task to get data to update a * live card(e.g, making a web call), do this in another thread or * AsyncTask. */ public void run(){ if(!isStopped()){ // Generate fake points. homeScore += mPointsGenerator.nextInt(3); awayScore += mPointsGenerator.nextInt(3); // Update the remote view with the new scores. mLiveCardView.setTextViewText(R.id.home_score_text_view, String.valueOf(homeScore)); mLiveCardView.setTextViewText(R.id.away_score_text_view, String.valueOf(awayScore)); // Always call setViews() to update the live card's RemoteViews. mLiveCard.setViews(mLiveCardView); // Queue another score update in 30 seconds. mHandler.postDelayed(mUpdateLiveCardRunnable, DELAY_MILLIS); } } public boolean isStopped() { return mIsStopped; } public void setStop(boolean isStopped) { this.mIsStopped = isStopped; } } @Override public IBinder onBind(Intent intent) { /* * If you need to set up interprocess communication * (activity to a service, for instance), return a binder object * so that the client can receive and modify data in this service. * * A typical use is to give a menu activity access to a binder object * if it is trying to change a setting that is managed by the live card * service. The menu activity in this sample does not require any * of these capabilities, so this just returns null. */ return null; } }
高頻度のライブカードの作成
高周波数レンダリングでは、ライブカードの裏側のサーフェスに直接描画できます。
高周波レンダリングを使用するケース:
- ライブカードは 1 秒間に何度も更新する必要があります。
- レンダリングできる柔軟性が必要です。高頻度レンダリングでは、Android ビューとレイアウトを使用して複雑な OpenGL グラフィックを作成できます。
留意点:
- ライブカードのサーフェスにレンダリングするバックグラウンド サービスは常に作成する必要があります。
- ライブカードには、
setAction()で宣言されたPendingIntentが常に必要です。 - それ以外の場合は、
GLRendererを使用して OpenGL とDirectRenderingCallbackをレンダリングします。
DirectRenderingCallback の使用
標準の Android ビューと描画ロジックを使用してライブカードを作成するには:
DirectRenderingCallbackを実装するクラスを作成します。これらのインターフェースにコールバックを実装すると、ライブカードのサーフェス ライフサイクルの重要なイベント中にアクションを実行できます。次の例では、定期的にレンダリングするバックグラウンド スレッドを作成しますが、外部イベント（センサーや位置情報の更新など）に応じてカードを更新することもできます。
public class LiveCardRenderer implements DirectRenderingCallback { // About 30 FPS. private static final long FRAME_TIME_MILLIS = 33; private SurfaceHolder mHolder; private boolean mPaused; private RenderThread mRenderThread; @Override public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) { // Update your views accordingly. } @Override public void surfaceCreated(SurfaceHolder holder) { mPaused = false; mHolder = holder; updateRendering(); } @Override public void surfaceDestroyed(SurfaceHolder holder) { mHolder = null; updateRendering(); } @Override public void renderingPaused(SurfaceHolder holder, boolean paused) { mPaused = paused; updateRendering(); } /** * Start or stop rendering according to the timeline state. */ private void updateRendering() { boolean shouldRender = (mHolder != null) && !mPaused; boolean rendering = mRenderThread != null; if (shouldRender != rendering) { if (shouldRender) { mRenderThread = new RenderThread(); mRenderThread.start(); } else { mRenderThread.quit(); mRenderThread = null; } } } /** * Draws the view in the SurfaceHolder's canvas. */ private void draw() { Canvas canvas; try { canvas = mHolder.lockCanvas(); } catch (Exception e) { return; } if (canvas != null) { // Draw on the canvas. mHolder.unlockCanvasAndPost(canvas); } } /** * Redraws in the background. */ private class RenderThread extends Thread { private boolean mShouldRun; /** * Initializes the background rendering thread. */ public RenderThread() { mShouldRun = true; } /** * Returns true if the rendering thread should continue to run. * * @return true if the rendering thread should continue to run */ private synchronized boolean shouldRun() { return mShouldRun; } /** * Requests that the rendering thread exit at the next opportunity. */ public synchronized void quit() { mShouldRun = false; } @Override public void run() { while (shouldRun()) { draw(); SystemClock.sleep(FRAME_TIME_MILLIS); } } } }DirectRenderingCallbackのインスタンスをLiveCardSurfaceHolderのコールバックとして設定します。これにより、ライブカードは自身をレンダリングするために使用するロジックを認識できます。// Tag used to identify the LiveCard in debugging logs. private static final String LIVE_CARD_TAG = "my_card"; // Cached instance of the LiveCard created by the publishCard() method. private LiveCard mLiveCard; private void publishCard(Context context) { if (mLiveCard == null) { mLiveCard = new LiveCard(this, LIVE_CARD_TAG); // Enable direct rendering. mLiveCard.setDirectRenderingEnabled(true); mLiveCard.getSurfaceHolder().addCallback( new LiveCardRenderer()); Intent intent = new Intent(context, MenuActivity.class); mLiveCard.setAction(PendingIntent.getActivity(context, 0, intent, 0)); mLiveCard.publish(LiveCard.PublishMode.SILENT); } else { // Card is already published. return; } } private void unpublishCard(Context context) { if (mLiveCard != null) { mLiveCard.unpublish(); mLiveCard = null; } }
OpenGL の使用
GlRendererを実装するクラスを作成します。このインターフェースにコールバックを実装すると、ライブカードのサーフェス ライフサイクルの重要なイベント中にアクションを実行できます。この例では、色付きの回転キューブを描画します。import com.google.android.glass.timeline.GlRenderer; import android.opengl.GLES20; import android.opengl.Matrix; import android.os.SystemClock; import java.util.concurrent.TimeUnit; import javax.microedition.khronos.egl.EGLConfig; /** * Renders a 3D OpenGL Cube on a {@link LiveCard}. */ public class CubeRenderer implements GlRenderer { /** Rotation increment per frame. */ private static final float CUBE_ROTATION_INCREMENT = 0.6f; /** The refresh rate, in frames per second. */ private static final int REFRESH_RATE_FPS = 60; /** The duration, in milliseconds, of one frame. */ private static final float FRAME_TIME_MILLIS = TimeUnit.SECONDS.toMillis(1) / REFRESH_RATE_FPS; private final float[] mMVPMatrix; private final float[] mProjectionMatrix; private final float[] mViewMatrix; private final float[] mRotationMatrix; private final float[] mFinalMVPMatrix; private Cube mCube; private float mCubeRotation; private long mLastUpdateMillis; public CubeRenderer() { mMVPMatrix = new float[16]; mProjectionMatrix = new float[16]; mViewMatrix = new float[16]; mRotationMatrix = new float[16]; mFinalMVPMatrix = new float[16]; // Set the fixed camera position (View matrix). Matrix.setLookAtM(mViewMatrix, 0, 0.0f, 0.0f, -4.0f, 0.0f, 0.0f, 0.0f, 0.0f, 1.0f, 0.0f); } @Override public void onSurfaceCreated(EGLConfig config) { // Set the background frame color GLES20.glClearColor(0.0f, 0.0f, 0.0f, 1.0f); GLES20.glClearDepthf(1.0f); GLES20.glEnable(GLES20.GL_DEPTH_TEST); GLES20.glDepthFunc(GLES20.GL_LEQUAL); mCube = new Cube(); } @Override public void onSurfaceChanged(int width, int height) { float ratio = (float) width / height; GLES20.glViewport(0, 0, width, height); // This projection matrix is applied to object coordinates in the onDrawFrame() method. Matrix.frustumM(mProjectionMatrix, 0, -ratio, ratio, -1.0f, 1.0f, 3.0f, 7.0f); // modelView = projection x view Matrix.multiplyMM(mMVPMatrix, 0, mProjectionMatrix, 0, mViewMatrix, 0); } @Override public void onDrawFrame() { GLES20.glClear(GLES20.GL_COLOR_BUFFER_BIT | GLES20.GL_DEPTH_BUFFER_BIT); // Apply the rotation. Matrix.setRotateM(mRotationMatrix, 0, mCubeRotation, 1.0f, 1.0f, 1.0f); // Combine the rotation matrix with the projection and camera view Matrix.multiplyMM(mFinalMVPMatrix, 0, mMVPMatrix, 0, mRotationMatrix, 0); // Draw cube. mCube.draw(mFinalMVPMatrix); updateCubeRotation(); } /** Updates the cube rotation. */ private void updateCubeRotation() { if (mLastUpdateMillis != 0) { float factor = (SystemClock.elapsedRealtime() - mLastUpdateMillis) / FRAME_TIME_MILLIS; mCubeRotation += CUBE_ROTATION_INCREMENT * factor; } mLastUpdateMillis = SystemClock.elapsedRealtime(); } }ライブカードを管理するサービスを作成し、
CubeRendererクラスをライブカードのレンダラとして設定する。import com.google.android.glass.timeline.LiveCard; import com.google.android.glass.timeline.LiveCard.PublishMode; import android.app.PendingIntent; import android.app.Service; import android.content.Intent; import android.os.IBinder; /** * Creates a {@link LiveCard} rendering a rotating 3D cube with OpenGL. */ public class OpenGlService extends Service { private static final String LIVE_CARD_TAG = "opengl"; private LiveCard mLiveCard; @Override public IBinder onBind(Intent intent) { return null; } @Override public int onStartCommand(Intent intent, int flags, int startId) { if (mLiveCard == null) { mLiveCard = new LiveCard(this, LIVE_CARD_TAG); mLiveCard.setRenderer(new CubeRenderer()); mLiveCard.setAction( PendingIntent.getActivity(this, 0, new Intent(this, MenuActivity.class), 0)); mLiveCard.publish(PublishMode.REVEAL); } else { mLiveCard.navigate(); } return START_STICKY; } @Override public void onDestroy() { if (mLiveCard != null && mLiveCard.isPublished()) { mLiveCard.unpublish(); mLiveCard = null; } super.onDestroy(); } }
import android.opengl.GLES20;
import java.nio.ByteBuffer;
import java.nio.ByteOrder;
import java.nio.FloatBuffer;
/**
* Renders a 3D Cube using OpenGL ES 2.0.
*
* For more information on how to use OpenGL ES 2.0 on Android, see the
* <a href="//developer.android.com/training/graphics/opengl/index.html">
* Displaying Graphics with OpenGL ES</a> developer guide.
*/
public class Cube {
/** Cube vertices */
private static final float VERTICES[] = {
-0.5f, -0.5f, -0.5f,
0.5f, -0.5f, -0.5f,
0.5f, 0.5f, -0.5f,
-0.5f, 0.5f, -0.5f,
-0.5f, -0.5f, 0.5f,
0.5f, -0.5f, 0.5f,
0.5f, 0.5f, 0.5f,
-0.5f, 0.5f, 0.5f
};
/** Vertex colors. */
private static final float COLORS[] = {
0.0f, 1.0f, 1.0f, 1.0f,
1.0f, 0.0f, 0.0f, 1.0f,
1.0f, 1.0f, 0.0f, 1.0f,
0.0f, 1.0f, 0.0f, 1.0f,
0.0f, 0.0f, 1.0f, 1.0f,
1.0f, 0.0f, 1.0f, 1.0f,
1.0f, 1.0f, 1.0f, 1.0f,
0.0f, 1.0f, 1.0f, 1.0f,
};
/** Order to draw vertices as triangles. */
private static final byte INDICES[] = {
0, 1, 3, 3, 1, 2, // Front face.
0, 1, 4, 4, 5, 1, // Bottom face.
1, 2, 5, 5, 6, 2, // Right face.
2, 3, 6, 6, 7, 3, // Top face.
3, 7, 4, 4, 3, 0, // Left face.
4, 5, 7, 7, 6, 5, // Rear face.
};
/** Number of coordinates per vertex in {@link VERTICES}. */
private static final int COORDS_PER_VERTEX = 3;
/** Number of values per colors in {@link COLORS}. */
private static final int VALUES_PER_COLOR = 4;
/** Vertex size in bytes. */
private final int VERTEX_STRIDE = COORDS_PER_VERTEX * 4;
/** Color size in bytes. */
private final int COLOR_STRIDE = VALUES_PER_COLOR * 4;
/** Shader code for the vertex. */
private static final String VERTEX_SHADER_CODE =
"uniform mat4 uMVPMatrix;" +
"attribute vec4 vPosition;" +
"attribute vec4 vColor;" +
"varying vec4 _vColor;" +
"void main() {" +
" _vColor = vColor;" +
" gl_Position = uMVPMatrix * vPosition;" +
"}";
/** Shader code for the fragment. */
private static final String FRAGMENT_SHADER_CODE =
"precision mediump float;" +
"varying vec4 _vColor;" +
"void main() {" +
" gl_FragColor = _vColor;" +
"}";
private final FloatBuffer mVertexBuffer;
private final FloatBuffer mColorBuffer;
private final ByteBuffer mIndexBuffer;
private final int mProgram;
private final int mPositionHandle;
private final int mColorHandle;
private final int mMVPMatrixHandle;
public Cube() {
ByteBuffer byteBuffer = ByteBuffer.allocateDirect(VERTICES.length * 4);
byteBuffer.order(ByteOrder.nativeOrder());
mVertexBuffer = byteBuffer.asFloatBuffer();
mVertexBuffer.put(VERTICES);
mVertexBuffer.position(0);
byteBuffer = ByteBuffer.allocateDirect(COLORS.length * 4);
byteBuffer.order(ByteOrder.nativeOrder());
mColorBuffer = byteBuffer.asFloatBuffer();
mColorBuffer.put(COLORS);
mColorBuffer.position(0);
mIndexBuffer = ByteBuffer.allocateDirect(INDICES.length);
mIndexBuffer.put(INDICES);
mIndexBuffer.position(0);
mProgram = GLES20.glCreateProgram();
GLES20.glAttachShader(mProgram, loadShader(GLES20.GL_VERTEX_SHADER, VERTEX_SHADER_CODE));
GLES20.glAttachShader(
mProgram, loadShader(GLES20.GL_FRAGMENT_SHADER, FRAGMENT_SHADER_CODE));
GLES20.glLinkProgram(mProgram);
mPositionHandle = GLES20.glGetAttribLocation(mProgram, "vPosition");
mColorHandle = GLES20.glGetAttribLocation(mProgram, "vColor");
mMVPMatrixHandle = GLES20.glGetUniformLocation(mProgram, "uMVPMatrix");
}
/**
* Encapsulates the OpenGL ES instructions for drawing this shape.
*
* @param mvpMatrix The Model View Project matrix in which to draw this shape
*/
public void draw(float[] mvpMatrix) {
// Add program to OpenGL environment.
GLES20.glUseProgram(mProgram);
// Prepare the cube coordinate data.
GLES20.glEnableVertexAttribArray(mPositionHandle);
GLES20.glVertexAttribPointer(
mPositionHandle, 3, GLES20.GL_FLOAT, false, VERTEX_STRIDE, mVertexBuffer);
// Prepare the cube color data.
GLES20.glEnableVertexAttribArray(mColorHandle);
GLES20.glVertexAttribPointer(
mColorHandle, 4, GLES20.GL_FLOAT, false, COLOR_STRIDE, mColorBuffer);
// Apply the projection and view transformation.
GLES20.glUniformMatrix4fv(mMVPMatrixHandle, 1, false, mvpMatrix, 0);
// Draw the cube.
GLES20.glDrawElements(
GLES20.GL_TRIANGLES, INDICES.length, GLES20.GL_UNSIGNED_BYTE, mIndexBuffer);
// Disable vertex arrays.
GLES20.glDisableVertexAttribArray(mPositionHandle);
GLES20.glDisableVertexAttribArray(mColorHandle);
}
/** Loads the provided shader in the program. */
private static int loadShader(int type, String shaderCode){
int shader = GLES20.glCreateShader(type);
GLES20.glShaderSource(shader, shaderCode);
GLES20.glCompileShader(shader);
return shader;
}
}
ライブカード フォーカス
LiveCard.publish() を使用してライブカードを公開する場合は、このパラメータを渡してすぐにフォーカスするかどうかを制御します。
パブリッシュ後すぐにカードにタイムラインに移動する場合は、LiveCard.PublishMode.REVEAL を使用します。通知なしでカードを公開し、ユーザー自身でカードに移動できるようにするには、LiveCard.PublishMode.SILENT を使用します。
また、LiveCard.navigate() メソッドを使用すると、公開後にカードに移動できます。たとえば、ユーザーがメインの音声メニューからライブカードを開始しようとしたときに、すでに開始されている場合、この方法でライブカードにジャンプできます。
メニューを作成して表示する
ライブカードには独自のメニュー システムを表示できないため、ライブカードのメニューを表示するアクティビティを作成する必要があります。
メニュー アクティビティには、ライブカードを停止、没入させる、その他の操作などの項目を含めることができます。音量コントロールなどのシステム設定アクティビティをメニュー項目として追加することもできます。詳細については、設定の開始をご覧ください。
メニュー リソースを作成する
メニュー リソースの作成は Android プラットフォームの場合と同じですが、Glass に関するガイドラインは次のとおりです。
- メニュー項目ごとに、50 × 50 ピクセルのメニュー項目アイコンを指定します。透明な背景では、メニュー アイコンの色を白色にする必要があります。サンプルについては、Glass のメニュー アイテム アイコンをご覧ください。また、ダウンロードして使用することもできます。
- タイトルは、アクションを表す短い名前にします。命令動詞は適切に機能します（例: Share、Reply all）。
- Glass にメニュー項目のないライブカードは表示されません。少なくとも、ユーザーはタイムラインからライブカードを削除できるように [停止] メニュー項目を指定します。
CheckBox ウィジェットはサポートされていません。
<menu xmlns:android="http://schemas.android.com/apk/res/android"> <item android:id="@+id/menu_item_1" android:title="@string/Menu_Item_1" <!-- must have "Stop" menu item --> android:icon="@drawable/menu_item_1_icon" /> <!-- white on transparent icon --> </menu>
メニュー コールバックを処理するアクティビティを作成する
ユーザーがライブカードをタップしたときにライブカードが呼び出すメニュー アクティビティを定義する必要があります。
次の Activity コールバック メソッドをオーバーライドして、メニュー アクティビティのメニューの作成、表示、非表示を適切に行います。
onCreateOptionsMenu()は、XML メニュー リソースをインフレートします。onAttachedToWindow()は、アクティビティがフォーカスされているときにメニューを表示します。onPrepareOptionsMenu()は、必要に応じてメニュー項目を表示または非表示にします。たとえば、ユーザーの操作に基づいてさまざまなメニュー項目を表示できます。たとえば、一部のコンテキスト データに基づいてさまざまなメニュー項目を表示できます。onOptionsItemSelected()がユーザーの選択を処理します。onOptionsMenuClosed(): アクティビティを終了してライブカードの上に表示しないようにします。
選択で閉じるか下にスワイプしてメニューを正しく終了するには、ここでアクティビティを終了する必要があります。
/**
* Activity showing the options menu.
*/
public class MenuActivity extends Activity {
@Override
public void onAttachedToWindow() {
super.onAttachedToWindow();
openOptionsMenu();
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
MenuInflater inflater = getMenuInflater();
inflater.inflate(R.menu.stopwatch, menu);
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle item selection.
switch (item.getItemId()) {
case R.id.stop:
stopService(new Intent(this, StopwatchService.class));
return true;
default:
return super.onOptionsItemSelected(item);
}
}
@Override
public void onOptionsMenuClosed(Menu menu) {
// Nothing else to do, closing the activity.
finish();
}
}
メニュー アクティビティを透明にする
Glass のスタイルに合わせて、メニュー アクティビティを半透明にして、ライブカードがメニューの下に表示されるようにします。
res/values/styles.xmlファイルを作成し、アクティビティの背景を透明にするスタイルを宣言します。<resources> <style name="MenuTheme" parent="@android:style/Theme.DeviceDefault"> <item name="android:windowBackground">@android:color/transparent</item> <item name="android:colorBackgroundCacheHint">@null</item> <item name="android:windowIsTranslucent">true</item> <item name="android:windowAnimationStyle">@null</item> </style> </resources>AndroidManifest.xmlファイルで、メニュー アクティビティにテーマを割り当てます。<?xml version="1.0" encoding="utf-8"?> <manifest ... > ... <application ... > ... <activity android:name=".MenuActivity" android:theme="@style/MenuTheme" ...> </activity> </application> </manifest>
メニューの表示
setAction() を使用して、カードのアクションに PendingIntent を指定します。ペンディング インテントは、ユーザーがカードをタップしたときにメニュー アクティビティを開始するために使用されます。
Intent menuIntent = new Intent(this, MenuActivity.class);
mLiveCard.setAction(PendingIntent.getActivity(this, 0, menuIntent, 0));
mLiveCard.publish(LiveCard.PublishMode.REVEAL); // or SILENT
コンテキスト音声コマンドのサポート
MenuActivityがコンテキスト音声コマンドをサポートしていることを示します。// Initialize your LiveCard as usual. mLiveCard.setVoiceActionEnabled(true); mLiveCard.publish(LiveCard.PublishMode.REVEAL); // or SILENT音声フローによる呼び出しをサポートするように
MenuActivityを変更します。/** * Activity showing the options menu. */ public class MenuActivity extends Activity { private boolean mFromLiveCardVoice; private boolean mIsFinishing; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); mFromLiveCardVoice = getIntent().getBooleanExtra(LiveCard.EXTRA_FROM_LIVECARD_VOICE, false); if (mFromLiveCardVoice) { // When activated by voice from a live card, enable voice commands. The menu // will automatically "jump" ahead to the items (skipping the guard phrase // that was already said at the live card). getWindow().requestFeature(WindowUtils.FEATURE_VOICE_COMMANDS); } } @Override public void onAttachedToWindow() { super.onAttachedToWindow(); if (!mFromLiveCardVoice) { openOptionsMenu(); } } @Override public boolean onCreatePanelMenu(int featureId, Menu menu) { if (isMyMenu(featureId)) { getMenuInflater().inflate(R.menu.stopwatch, menu); return true; } return super.onCreatePanelMenu(featureId, menu); } @Override public boolean onPreparePanel(int featureId, View view, Menu menu) { if (isMyMenu(featureId)) { // Don't reopen menu once we are finishing. This is necessary // since voice menus reopen themselves while in focus. return !mIsFinishing; } return super.onPreparePanel(featureId, view, menu); } @Override public boolean onMenuItemSelected(int featureId, MenuItem item) { if (isMyMenu(featureId)) { // Handle item selection. switch (item.getItemId()) { case R.id.stop_this: stopService(new Intent(this, StopwatchService.class)); return true; } } return super.onMenuItemSelected(featureId, item); } @Override public void onPanelClosed(int featureId, Menu menu) { super.onPanelClosed(featureId, menu); if (isMyMenu(featureId)) { // When the menu panel closes, either an item is selected from the menu or the // menu is dismissed by swiping down. Either way, we end the activity. isFinishing = true; finish(); } } /** * Returns {@code true} when the {@code featureId} belongs to the options menu or voice * menu that are controlled by this menu activity. */ private boolean isMyMenu(int featureId) { return featureId == Window.FEATURE_OPTIONS_PANEL || featureId == WindowUtils.FEATURE_VOICE_COMMANDS; } }
詳しくは、状況に応じた音声コマンドのガイドをご覧ください。
メニュー ユーティリティ
メニューの外観や動作を変更するためのヘルパー メソッドが用意されています。詳しくは、MenuUtils をご覧ください。