Les fiches en direct s'affichent dans la section actuelle de la chronologie et affichent des informations pertinentes à l'heure actuelle.
Les fiches actives sont idéales lorsque les utilisateurs sont activement engagés dans une tâche, mais souhaitent consulter régulièrement Glass pour obtenir des informations supplémentaires. Par exemple, il peut vérifier leur temps de course à pied toutes les deux ou trois minutes ou contrôler un lecteur de musique pour ignorer ou mettre en pause un titre.
Si c'est la première fois que vous développez des solutions pour Glass, commencez par lire le guide des tâches continues. Ce document explique comment créer un logiciel GlassGlass complet à l'aide d'une carte active, en suivant nos bonnes pratiques de conception.
Fonctionnement
Les fiches actives permettent de conserver les fiches dans la section actuelle de la chronologie tant qu'elles sont pertinentes. Contrairement aux cartes statiques, les fiches actives ne sont pas conservées dans la chronologie, et les utilisateurs les suppriment explicitement lorsqu'elles en ont terminé.
Les utilisateurs démarrent généralement des fiches actives en prononçant une commande vocale dans le menu principal, qui lance un service en arrière-plan qui les affiche. Il peut ensuite appuyer sur la fiche pour afficher les éléments de menu qui peuvent l'utiliser, par exemple si elle est masquée.
Quand les utiliser
Les fiches en direct sont conçues pour des tâches récurrentes auxquelles les utilisateurs peuvent accéder fréquemment, comme un écran indiquant l'état d'exécution d'une action, une carte animée pendant la navigation ou un lecteur de musique.
Un autre avantage des fiches en direct est qu'elles sont bien adaptées aux interfaces utilisateur qui nécessitent une interaction en temps réel avec les utilisateurs et des mises à jour en temps réel.
Lorsque vous utilisez des fiches en direct, la chronologie permet toujours de contrôler l'expérience utilisateur. Par conséquent, si vous balayez l'écran vers l'avant ou vers l'arrière sur une fiche en direct, la navigation est effectuée sur la carte en temps réel. De plus, l'écran s'allume et s'éteint en fonction du comportement du système (après 5 secondes sans interaction de l'utilisateur ou pendant un mouvement de tête vers le haut).
Toutefois, les cartes en direct ont accès à de nombreuses fonctionnalités propres à une immersion, telles que les données de capteurs ou GPS. Vous pouvez ainsi créer des expériences attrayantes tout en permettant aux utilisateurs de rester dans l'expérience chronologique pour effectuer d'autres tâches, telles que la vérification de messages.
Architecture
Les cartes en temps réel nécessitent un contexte de longue durée pour les conserver pendant toute la durée de leur visibilité. Vous devez donc les gérer dans un service en arrière-plan.
Vous pouvez ensuite publier et afficher une fiche active dès le démarrage du service ou en réponse à d'autres événements surveillés par le service. Vous pouvez afficher les cartes en direct à faible fréquence (une fois toutes les deux ou trois secondes) ou haute fréquence (jusqu'à autant de fois que le système peut être actualisé).
Lorsque la fiche en ligne n'est plus pertinente, détruisez le service pour arrêter le rendu.
Rendu basse fréquence
Le rendu basse fréquence est limité à un petit ensemble de vues Android et ne peut mettre à jour l'affichage qu'une fois toutes les deux ou trois secondes.
Il s'agit d'un moyen simple de créer des fiches en direct avec un contenu simple qui ne nécessite pas de rendu constant ni de mises à jour fréquentes.
Rendu haute fréquence
Le rendu haute fréquence vous permet d'utiliser davantage d'options disponibles dans le framework graphique Android.
Le système vous offre la surface réelle de la carte en direct que vous dessinez directement à l'aide de vues et de mises en page 2D, ou même de graphiques 3D complexes avec OpenGL.
Créer des cartes en direct basse fréquence
Le rendu à basse fréquence nécessite une interface utilisateur fournie par un objet RemoteViews, qui est compatible avec le sous-ensemble suivant de vues et de mises en page Android:
Utilisez le rendu basse fréquence dans les cas suivants:
- Vous n'avez besoin que des API Android View standards répertoriées précédemment.
- Vous n'avez besoin que de mises à jour relativement rares (quelques secondes entre les actualisations).
À noter :
- Une fiche
PendingIntentdoit toujours être déclarée avecsetAction()pour que la chronologie puisse publier la fiche. - Pour modifier une fiche après sa publication, appelez
setViews()sur la fiche avec l'objet RemoteViews mis à jour avant de publier à nouveau.
Pour créer des fiches en direct basse fréquence:
Créez la mise en page ou la vue à afficher. L'exemple suivant montre une mise en page pour un jeu de basket-ball imaginaire:
<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" />Créez un service qui gère la fiche en direct et affiche votre mise en page ou votre vue. Cet exemple de service met à jour le score d'un match de basket imaginaire toutes les 30 secondes.
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; } }
Créer des cartes en direct haute fréquence
Le rendu haute fréquence vous permet de dessiner directement sur la surface au dos de la carte active.
Utilisez l'affichage haute fréquence dans les cas suivants:
- Vous devez mettre à jour la carte en direct fréquemment (plusieurs fois par seconde).
- Vous avez besoin de flexibilité dans ce que vous pouvez afficher. Le rendu haute fréquence vous permet d'utiliser des vues et des mises en page Android pour des graphismes OpenGL complexes.
À noter :
- Vous devez toujours créer un service d'arrière-plan à afficher sur la surface de la fiche active.
- Les fiches en direct doivent toujours comporter une valeur
PendingIntentdéclarée parsetAction(). - Utilisez
GLRenderersi vous effectuez le rendu OpenGL etDirectRenderingCallbackdans tous les autres cas.
Utiliser DirectRenderingCallback
Pour créer des fiches en direct avec des vues Android standards et une logique de dessin:
Créez une classe qui implémente
DirectRenderingCallback. La mise en œuvre des rappels dans ces interfaces vous permet d'effectuer des actions lors d'événements importants du cycle de vie de la carte en direct.L'exemple suivant crée un thread d'arrière-plan à afficher régulièrement, mais vous pouvez mettre à jour la fiche en réponse à des événements externes (par exemple, des mises à jour de capteurs ou de position).
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); } } } }Définissez une instance de votre
DirectRenderingCallbacken tant que rappel deLiveCardSurfaceHolder. Cela permet à la fiche en direct de savoir quelle logique utiliser pour effectuer le rendu.// 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; } }
Utiliser OpenGL
Créez une classe mettant en œuvre
GlRenderer. L'implémentation des rappels dans cette interface vous permet d'effectuer des actions lors d'événements importants du cycle de vie de la carte en direct. Cet exemple dessine un cube rotatif coloré.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(); } }Créez un service qui gère la carte active et définit la classe
CubeRenderercomme moteur de rendu de la carte active.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;
}
}
Mettre en avant une fiche
Lorsque vous publiez une fiche en ligne avec LiveCard.publish(), vous lui transmettez un paramètre pour contrôler si elle est immédiatement mise en surbrillance ou non.
Pour que la chronologie passe à la fiche immédiatement après sa publication, utilisez LiveCard.PublishMode.REVEAL.
Pour publier la carte en mode silencieux et permettre aux utilisateurs d'y accéder par eux-mêmes, utilisez LiveCard.PublishMode.SILENT.
En outre, la méthode LiveCard.navigate() vous permet d'accéder à la fiche après sa publication. Par exemple, si les utilisateurs tentent de démarrer votre carte en direct depuis le menu vocal principal et qu'elle a déjà démarré, vous pouvez y accéder directement avec cette méthode.
Créer et afficher un menu
Les fiches en direct ne peuvent pas afficher leur propre système de menu. Vous devez donc créer une activité pour afficher un menu pour la fiche.
L'activité du menu peut alors inclure des éléments permettant d'arrêter la carte en direct, de démarrer une immersion ou toute autre action que vous souhaitez effectuer. Vous pouvez également ajouter des activités liées aux paramètres système, telles que le contrôle du volume, en tant qu'élément de menu. Pour en savoir plus, consultez la section Paramètres de démarrage.
Créer des ressources de menu
La création de ressources de menu est la même que sur la plate-forme Android, mais suivez les consignes ci-dessous pour Glass:
- Pour chaque élément de menu, fournissez une icône d'élément de menu de 50 x 50 pixels. L'icône du menu doit être blanche, sur un arrière-plan transparent. Consultez les icônes d'éléments de menu en verre pour voir un exemple ou les télécharger pour votre usage personnel.
- Utilisez un nom court qui décrit l'action et qui est en majuscule. Un verbe impératif fonctionne bien (par exemple, Partager ou Répondre à tous).
- Glass n'affiche pas les fiches actives sans élément de menu. Au minimum, fournissez un élément de menu Stop (Arrêter) afin que les utilisateurs puissent supprimer la carte active de la chronologie.
Le widget CheckBox n'est pas compatible.
<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>
Créer une activité pour gérer les rappels de menu
Vous devez définir une activité de menu que votre fiche active appelle lorsque les utilisateurs appuient dessus.
Remplacez les méthodes de rappel Activity suivantes pour créer, afficher et ignorer correctement des menus dans votre activité de menu:
onCreateOptionsMenu()gonfle la ressource du menu XML.onAttachedToWindow()affiche le menu lorsque l'activité est sélectionnée.onPrepareOptionsMenu()affiche ou masque des éléments de menu si nécessaire. Par exemple, vous pouvez afficher différents éléments de menu en fonction de ce que font les utilisateurs. Par exemple, vous pouvez afficher différents éléments de menu en fonction de certaines données contextuelles.onOptionsItemSelected()gère la sélection des utilisateurs.onOptionsMenuClosed()pour terminer l'activité afin qu'elle n'apparaisse plus sur la fiche en ligne.
Vous devez terminer l'activité ici afin qu'elle se termine correctement lorsque vous fermez le menu ou que vous balayez l'écran vers le bas.
/**
* 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();
}
}
Rendre l'activité du menu transparente
Pour assurer la cohérence avec le style Glass, l'activité du menu doit être translucide, de sorte que la fiche en direct reste visible sous le menu:
Créez un fichier
res/values/styles.xmlet déclarez un style qui rend l'arrière-plan de l'activité transparent:<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>Dans votre fichier
AndroidManifest.xml, attribuez le thème à l'activité du menu:<?xml version="1.0" encoding="utf-8"?> <manifest ... > ... <application ... > ... <activity android:name=".MenuActivity" android:theme="@style/MenuTheme" ...> </activity> </application> </manifest>
Afficher le menu
Indiquez un PendingIntent pour l'action de la carte à l'aide de setAction(). L'intent en attente est utilisé pour démarrer l'activité de menu lorsque les utilisateurs appuient sur la carte:
Intent menuIntent = new Intent(this, MenuActivity.class);
mLiveCard.setAction(PendingIntent.getActivity(this, 0, menuIntent, 0));
mLiveCard.publish(LiveCard.PublishMode.REVEAL); // or SILENT
Compatibilité avec les commandes vocales contextuelles
Indiquez que votre
MenuActivityest compatible avec les commandes vocales contextuelles :// Initialize your LiveCard as usual. mLiveCard.setVoiceActionEnabled(true); mLiveCard.publish(LiveCard.PublishMode.REVEAL); // or SILENTModifiez votre
MenuActivitypour permettre l'appel via le flux vocal:/** * 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; } }
Pour en savoir plus, consultez le guide des commandes vocales contextuelles.
Utilitaires de menu
Plusieurs méthodes d'assistance sont disponibles pour modifier l'apparence et le comportement des menus. Pour en savoir plus, consultez MenuUtils.