Inizia con Android VR e Google Cardboard immagini panoramiche

Durante la conferenza Google I / O del 2014, Google ha introdotto il visore VR Cardboard, un dispositivo economico in cartone, che utilizza obiettivi e telefono di un utente per fornire un accesso semplice alle app di realtà virtuale. Due anni dopo, Google ha annunciato l'intenzione di espandersi su questa piattaforma vendendo un visualizzatore più duraturo con un controller, noto come Daydream View, che è stato costruito seguendo lo stesso concetto di utilizzo di un telefono come principale fornitore di VR. Per ottenere più app sviluppate che supportano questa piattaforma, Google ha rilasciato SDK Cardboard per Android (SDK standard e NDK), iOS, il motore di gioco Unity e il motore di gioco Unreal. 

Questo tutorial è il primo di una serie breve su Android Cardboard e Daydream SDK. In questa serie, ti mostrerò come utilizzare alcuni degli strumenti dell'SDK e le visualizzazioni preimpostate per aggiungere semplici funzionalità alle tue app. Esistono numerosi modi per integrare l'SDK Cardboard nelle tue app per giochi e multimedia! 

Mi concentrerò su tre esempi che ti consentiranno di iniziare nel mondo dello sviluppo della realtà virtuale: un visualizzatore di fotosfera, un visualizzatore di video a 360 ° e un lettore di input per il controller Daydream. Ci concentreremo sul visualizzatore di photosphere in questo tutorial e rivedremo gli altri due argomenti nelle lezioni successive.

Scarica l'SDK di cartone ed esegui i progetti di esempio

A differenza della maggior parte delle librerie Android, l'SDK Android Cardboard non è ufficialmente disponibile in un repository remoto che può essere importato come dipendenza tramite Gradle. Per poterlo utilizzare, dovrai clonare l'SDK del cartone Android da GitHub sul tuo computer tramite Git. 

git clone https://github.com/googlevr/gvr-android-sdk.git

Una volta scaricato l'SDK, iniziamo eseguendo uno degli esempi preconfezionati. Nella schermata di avvio di Android Studio, selezionare Importa progetto. Quindi, selezionare la cartella principale per l'SDK appena clonato e premere ok.

A questo punto avrai accesso a tutti i componenti e gli esempi di libreria disponibili nel SDK di cartone per Android. Puoi selezionare uno dei campioni da eseguire sul tuo dispositivo dal menu a discesa dei moduli nella parte superiore della finestra di Android Studio. Per assicurarsi che tutto funzioni come previsto, selezionare Campioni-sdk-simplepanowidget e clicca sul verde Correre freccia.

Una volta che l'esempio è stato compilato e installato, dovresti vedere una schermata informativa su Machu Picchu, completa di una vista che ruota attorno a una fotosfera quando sposti il ​​tuo dispositivo Android.

Ora che sei in grado di eseguire le applicazioni di esempio sul tuo dispositivo, immergiti nella creazione di nuove app Android compatibili con Cardboard.

Creazione di un visualizzatore panoramico

Iniziamo creando un nuovo progetto Android con una versione SDK minima di 19 (KitKat). Dopo aver eseguito i passaggi standard di selezione e creazione di uno dei modelli di app, dovrai copiare le librerie necessarie per il tuo progetto dal Cardboard SDK librerie directory nella cartella principale del tuo progetto. Per questo esempio, copia le seguenti cartelle: Comune, commonwidget, e panowidget.

Una volta che i file della libreria sono nella posizione corretta, apri il progetto settings.gradle file. Sarà necessario aggiungere quei moduli di libreria al progetto attraverso questo file.

include ': app', ": common", "commonwidget", "panowidget"

Successivamente, dovrai fare riferimento a queste librerie nel tuo build.gradle file sotto il dipendenze nodo, che consente di accedere ai componenti pre-fatti per Cardboard. Dovrai inoltre aggiungere la libreria JavaNano di Google Protocol Buffers, che è una generazione di codice e una libreria di runtime per aiutare a gestire le risorse limitate dei dispositivi Android.

dependencies compile fileTree (dir: 'libs', include: ['* .jar']) testCompile 'junit: junit: 4.12' compile 'com.android.support:appcompat-v7:25.0.0' progetto di compilazione (': common ') progetto di compilazione (': commonwidget ') progetto di compilazione (': panowidget ') compilare' com.google.protobuf.nano: protobuf-javanano: 3.0.0-alpha-7 '

Dopo aver impostato le dipendenze, apri il tuo progetto AndroidManifest.xml. Nella parte superiore del file, all'interno di manifesto nodo, sarà necessario aggiungere il INTERNET e READ_EXTERNAL_STORAGE autorizzazioni per l'SDK Cardboard.

 

All'interno del attività nodo per il tuo Attività principale classe, aggiungi a categoria al intent-filtro per il CARTONE spettatore.

      

Ora che il processo di installazione è terminato, possiamo scavare nella parte divertente: il codice. Questo progetto leggerà un'immagine di fotosfera da app / src / main / attività e inseriscilo in a VrPanoramaView. Puoi scattare una foto di photosphere tramite l'applicazione per fotocamera Android standard e inserirla in questa directory. Per questo esempio, userò un'immagine chiamata openspace.jpg.

Nel file di layout per il tuo Attività, aggiungere un VrPanoramaView che userete nella vostra app.

   

Quindi, apri il Attività principale classe. Dovrai prima ottenere un riferimento al tuo VrPanoramaView nel onCreate (Bundle), e poi puoi caricare il tuo Bitmap in esso tramite il loadPhotoSphere () metodo di supporto che definiremo tra un momento.

private VrPanoramaView mVrPanoramaView; @Override protected void onCreate (Bundle savedInstanceState) super.onCreate (savedInstanceState); setContentView (R.layout.activity_main); mVrPanoramaView = (VrPanoramaView) findViewById (R.id.pano_view); loadPhotoSphere (); 

loadPhotoSphere () recupera la nostra immagine dalla cartella delle risorse e la carica nel VrPanoramaView con un VrPanoramaView.Options oggetto. Vale la pena notare che queste immagini possono essere relativamente grandi, quindi questa operazione normalmente si verificherebbe su un thread in background, sebbene questa lezione manterrà tutto sul thread dell'interfaccia utente per semplicità.

private void loadPhotoSphere () // Potrebbe volerci un po 'di tempo. Dovrebbe fare su un thread in background, ma va bene per l'esempio corrente VrPanoramaView.Options options = new VrPanoramaView.Options (); InputStream inputStream = null; AssetManager assetManager = getAssets (); prova inputStream = assetManager.open ("openspace.jpg"); options.inputType = VrPanoramaView.Options.TYPE_MONO; mVrPanoramaView.loadImageFromBitmap (BitmapFactory.decodeStream (inputStream), opzioni); inputStream.close ();  catch (IOException e) Log.e ("Tuts +", "Eccezione in loadPhotoSphere:" + e.getMessage ()); 

Si noti che per il VrPanoramaView.Options.inputType valore, stiamo usando TYPE_MONO. Ciò significa che il VrPanoramaView si aspetta un'immagine a canale singolo da visualizzare, mentre a InputType di TYPE_STEREO_OVER_UNDER si aspetterebbe un'immagine divisa verticalmente con l'occhio destro e sinistro che vedono rispettivamente le metà superiore e inferiore di quell'immagine.

L'ultima cosa che devi fare è mettere in pausa e riprendere il rendering VrPanoramaView nel onPause () e onResume (), oltre a scollegarlo correttamente OnDestroy ().

@Override protected void onPause () mVrPanoramaView.pauseRendering (); super.onPause ();  @Override protected void onResume () super.onResume (); mVrPanoramaView.resumeRendering ();  @Override protected void onDestroy () mVrPanoramaView.shutdown (); super.onDestroy (); 

Ora che abbiamo finito di configurare l'app, andiamo avanti ed eseguiamola. La tua app dovrebbe visualizzare la tua photosphere sullo schermo e dovresti essere in grado di spostare il telefono per visualizzare diverse parti dell'immagine.

Se si preme sull'icona del cartone nell'angolo in basso a destra del vista, Divide l'immagine in due immagini leggermente sfalsate che possono essere viste attraverso un visore Cardboard o Daydream.

Sebbene non sia usato in questo tutorial, vale la pena notare che il VrPanoramaView può accettare a VrPanoramaEventListener oggetto che notificherà la tua app quando una nuova immagine ha avuto successo o non è riuscita a caricare.

Conclusione

Congratulazioni: hai creato la tua prima app di cartone, un visualizzatore di immagini per foto panoramiche e di fotosfera! Sebbene si tratti di un esempio semplificato, fornisce le nozioni di base su come creare le proprie app per utilizzare il visualizzatore Cardboard. Per un fantastico esempio di un'app che porta questo concetto un ulteriore passo avanti, consiglio vivamente l'app Education di Google Expeditions. 

Spero ti sia piaciuto immergere le dita dei piedi nel mondo della realtà virtuale. Nel prossimo tutorial, ti mostrerò come riprodurre file video a 360 gradi tramite l'SDK Cardboard.

Nel frattempo, dai un'occhiata ad alcuni dei nostri altri corsi ed esercitazioni per Android VR, proprio qui su Envato Tuts+.

  • Esplora la realtà virtuale con Google Cardboard

    VR (realtà virtuale) è una tecnologia eccitante che promette nuove prospettive di esperienza immersiva. Con Google Cardboard SDK per Android, lo sviluppo di VR ...
    Sue Smith
    androide
  • Pokémon GO Style Realtà Aumentata con Vuforia

    Con il successo virale di Pokemon GO, tutti parlano di realtà aumentata. In questo tutorial vedremo come utilizzare Vuforia per la realtà aumentata ...
    Tin Megali
    Sviluppo mobile
  • Crea un gioco di realtà aumentata in stile Pokémon GO con Vuforia

    In questo tutorial inizieremo a creare un'app con Augmented Reality utilizzando Vuforia su Unity 3D. Impareremo come impostare Vuforia e iniziare a sviluppare un AR ...
    Tin Megali
    Sviluppo mobile
  • Pokémon GO Style Realtà Aumentata: Markers

    Di recente, Pokémon Go ha conquistato il mondo. Una delle parti più interessanti e coinvolgenti di questo gioco è l'uso della realtà aumentata, o AR. AR è ...
    Derek Jensen
    App per dispositivi mobili