Apprenez à développer des applications Android de réalité virtuelle à partir de zéro

Cet article vous guidera sur la façon de développer des applications Android de réalité virtuelle à partir de zéro, en supposant que vous connaissez déjà les bases du développement d'applications Android.

Conditions

• Android Studio 1.0 ou supérieur
• Version 19 du SDK Android
• Un appareil Android physique exécutant Android 16 (Jelly Bean) ou supérieur

Le fichier manifeste

 < manifeste ...

<uses-permission android:name="android.permission.NFC" />

<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />

<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />

 

<uses-permission android:name="android.permission.VIBRATE" />

...

<uses-sdk android:minSdkVersion="16" android:targetSdkVersion="19"/>

<uses-feature android:glEsVersion="0x00020000" android:required="true" />

<demande

...

<activité

android:name=".MainActivity"

android:screenOrientation="paysage">

...

 

<filtre d'intention>

<action android:name="android.intent.action.MAIN" />

<category android:name="android.intent.category.LAUNCHER" />

<category android:name="com.google.intent.category.CARDBOARD" />

</intent-filter>

</activité>

</application>

</manifest>

Explication des autorisations :

• <uses-sdk android:minSdkVersion=”16″/> indique que l'appareil doit exécuter l'API de niveau 16 (Jellybean) ou supérieur.
• <uses-sdk android:targetSdkVersion=”19″/> indique que notre application cible le niveau 19 de l'API (KitKat).
• <uses-feature android:glEsVersion=”0x00020000″ android:required=”true” /> indique que l'application utilise des graphiques et doit donc prendre en charge OpenGL ES 2.0.
• android:screenOrientation="landscape" indique que l'orientation d'écran requise pour l'activité est "paysage". Il s'agit de l'orientation que vous devez définir pour les applications VR. La vue utilisée par le SDK Cardboard, CardboardView, s'affiche uniquement en mode plein écran et paysage (landscape, reverseLandscape, sensorLandscape).
• Le paramètre android:configChanges="orientation|keyboardHidden" est également recommandé, mais pas obligatoire.
• L'autorisation android.permission.NFC est requise par le SDK Cardboard pour accéder à la balise NFC de Cardboard.
• android.permission.READ_EXTERNAL_STORAGE et android.permission.WRITE_EXTERNAL_STORAGE . Ces autorisations sont requises par le SDK Cardboard pour associer le téléphone de l'utilisateur à sa visionneuse VR.
• L'autorisation android.permission.VIBRATE est requise par notre application de démonstration pour faire vibrer le téléphone afin d'informer l'utilisateur que quelque chose s'est passé.
• Le filtre d'intention et plus particulièrement com.google.intent.category.CARDBOARD indiquent que cette activité est compatible avec les visionneuses de type Cardboard. Cette catégorie est utilisée par l'application Cardboard pour répertorier les applications compatibles installées sur le téléphone de l'utilisateur.

Prolonger l'activité Cardboard :

CardboardActivity est le point de départ pour coder une application en carton. CardboardActivity est l'activité de base qui permet une intégration facile avec les appareils Cardboard. Il expose les événements pour interagir avec Cardboards et gère de nombreux détails couramment requis lors de la création d'une activité pour le rendu VR.

Notez que CardboardActivity utilise le mode immersif collant, dans lequel l'interface utilisateur du système est masquée et le contenu occupe tout l'écran. Il s'agit d'une exigence pour une application VR, car CardboardView ne s'affichera que lorsque l'activité est en mode plein écran.

Android 4.4 (API niveau 19) introduit un nouvel indicateur SYSTEM_UI_FLAG_IMMERSIVE pour setSystemUiVisibility() qui permet à votre application d'aller vraiment en "plein écran". Cet indicateur, lorsqu'il est combiné avec les indicateurs SYSTEM_UI_FLAG_HIDE_NAVIGATION et SYSTEM_UI_FLAG_FULLSCREEN, masque les barres de navigation et d'état et permet à votre application de capturer tous les événements tactiles à l'écran.

Définissez un CardBoardView :

Tous les éléments de l'interface utilisateur d'une application Android sont créés à l'aide de vues. Le SDK Cardboard pour Android fournit sa propre vue, CardboardView, qui est une extension pratique de GLSurfaceView qui peut être utilisée pour le rendu VR. CardboardView rend le contenu en stéréo. Vous pouvez voir comment l'application de démonstration définit aCardboardView dans son fichier xml de présentation d'activité de la manière suivante :

 <com.google.vrtoolkit.cardboard.CardboardView    
android:fill_parent"    
android:layout_height="fill_parent" />

Ensuite, dans la classe d'activité principale, il initialise le CardboardView dans la méthode onCreate() :

 **
* Définit la vue sur notre CardboardView et initialise les matrices de transformation que nous utiliserons
* pour rendre notre scène. 
* @param saveInstanceState 
*/
@Passer outre
public void onCreate(Bundle saveInstanceState) {    
super.onCreate(savedInstanceState);    
setContentView(R.layout.common_ui);    
CardboardView cartonView = (CardboardView) findViewById(R.id.cardboard_view);    
// Associez un CardboardView.StereoRenderer à un cartonView.    
cartonView.setRenderer(ceci);    
// Associez la vue en carton à cette activité.    
setCardboardView(cardboardView);     
// Initialise les autres objets ici
....
}

Rendre la vue

Une fois que vous obtenez le CardboardView, vous l'associez à un moteur de rendu, puis vous associez le CardboardView à l'activité. Cardboard prend en charge deux types de moteurs de rendu, mais le moyen le plus rapide de démarrer consiste à utiliser CardboardView.StereoRenderer, qui est utilisé par l'application de démonstration.

CardboardView.StereoRenderer inclut ces méthodes clés :

• onNewFrame(), appelé à chaque rendu de l'application.
• onDrawEye(), appelé pour chaque œil avec des paramètres d'œil différents.

Leur implémentation est similaire à ce que vous feriez normalement pour une application OpenGL. Ces méthodes sont décrites plus en détail dans les sections suivantes.

Implémenter onNewFrame

Utilisez la méthode onNewFrame() pour coder la logique de rendu avant que les yeux individuels ne soient rendus. Toutes les opérations par image non spécifiques à une seule vue doivent avoir lieu ici. C'est un bon endroit pour mettre à jour votre modèle. Dans cet extrait, la variable mHeadView contient la position de la tête. Cette valeur doit être enregistrée pour être utilisée plus tard pour indiquer si l'utilisateur regarde un trésor :

 /**

* Prépare OpenGL ES avant de dessiner un cadre.

* @param headTransform La transformation de la tête dans le nouveau cadre.

*/

@Passer outre

public void onNewFrame(HeadTransform headTransform) {

...

headTransform.getHeadView(mHeadView, 0);

...

}

Implémenter onDrawEye

Implémentez onDrawEye() pour effectuer une configuration par œil.

C'est la viande du code de rendu, et très similaire à la construction d'une application OpenGL ES2 standard. L'extrait de code suivant montre comment obtenir la matrice de transformation de vue, ainsi que la matrice de transformation de perspective. Vous devez vous assurer que vous effectuez un rendu avec une faible latence. L'objet Eye contient les matrices de transformation et de projection de l'œil. Voici la séquence des événements :

• Le trésor vient dans l'espace des yeux.
• Nous appliquons la matrice de projection. Cela fournit la scène rendue pour l'œil spécifié.
• Le SDK Cardboard applique automatiquement la distorsion pour restituer la scène finale.

 /**

* Dessine un cadre pour un œil.

*

* @param eye L'oeil à rendre. Inclut toutes les transformations requises.

*/

@Passer outre

public void onDrawEye(Eye eye) {

GLES20.glClear(GLES20.GL_COLOR_BUFFER_BIT | GLES20.GL_DEPTH_BUFFER_BIT);

...

// Appliquez la transformation de l'œil à la caméra.

Matrix.multiplyMM(mView, 0, eye.getEyeView(), 0, mCamera, 0);

 

// Définir la position de la lumière

Matrix.multiplyMV(mLightPosInEyeSpace, 0, mView, 0, LIGHT_POS_IN_WORLD_SPACE, 0);

 

// Construire les matrices ModelView et ModelViewProjection

// pour calculer la position et la lumière du cube.

float[] perspective = eye.getPerspective(Z_NEAR, Z_FAR);

Matrix.multiplyMM(mModelView, 0, mView, 0, mModelCube, 0);

Matrix.multiplyMM(mModelViewProjection, 0, perspective, 0, mModelView, 0);

dessinCube();

 

// Dessine le reste de la scène.

...

}

Gestion des entrées

La visionneuse Cardboard comprend un bouton-poussoir qui utilise un aimant. Lorsque vous poussez l'aimant, le champ magnétique change et est détecté par le magnétomètre de votre téléphone. Ces événements d'aimant sont détectés par le SDK Cardboard pour vous.

Pour fournir un comportement personnalisé lorsque l'utilisateur tire sur l'aimant, remplacezCardboardActivity.onCardboardTrigger() dans l'activité de votre application. Dans l'application de chasse au trésor, si vous trouvez le trésor et tirez sur l'aimant, vous gardez le trésor :

 /**

* Incrémentez le score, masquez l'objet et donnez des commentaires si l'utilisateur tire l'aimant pendant

* regardant l'objet. Sinon, rappelez à l'utilisateur ce qu'il doit faire.

*/

@Passer outre

public void onCardboardTrigger() {

si (isLookingAtObject()) {

mScore++ ;

mOverlayView.show3DToast("Trouvé ! Cherchez-en un autre.\nScore = " + mScore);

...

} autre {

mOverlayView.show3DToast("Regardez autour de vous pour trouver l'objet !");

}

// Toujours donner des commentaires aux utilisateurs

mVibrator.vibrate(50);

}

Démarrez votre propre projet

Maintenant que vous êtes plus familiarisé avec le SDK Cardboard pour Android, il est temps de créer vos propres applications.

Qu'il s'agisse d'un nouveau projet que vous démarrez à partir de zéro ou d'un projet existant, voici ce que vous devez faire.

1) Téléchargez les deux fichiers JAR. Cliquez ici pour télécharger

2) Copiez et collez-le dans votre dossier app/libs (Trouvez ceci dans la vue Projet de la structure du projet Android Studio)

3) Faites un clic droit sur les bibliothèques et sélectionnez "Ajouter en tant que bibliothèque"

Ensuite, assurez-vous que les lignes suivantes sont présentes dans le fichier app/build.gradle de votre projet :

dependencies { … compile fileTree(dir: 'libs', include: ['*.jar']) }

Vous êtes prêt à donner un coup de pouce au développement d'applications de réalité virtuelle !

Êtes-vous un développeur Android ? Rejoignez Truelancer aujourd'hui et commencez à travailler en freelance