Kom i gang med Android VR og Google Kart Panoramabilder

I løpet av 2014 I / O-konferansen i Google, introduserte Google VR-kartleggeren Cardboard, en billig enhet laget av papp, som bruker linser og en brukers telefon for å gi enkel tilgang til virtuelle virkelighetsprogrammer. To år senere annonserte Google planer om å utvide på denne plattformen ved å selge en mer holdbar seer med en kontroller, kjent som Daydream View, som er bygget etter det samme konseptet med å bruke en telefon som den viktigste VR-leverandøren. For å få flere programmer utviklet som støtter denne plattformen, ga Google ut pappers SDKs for Android (standard SDK og NDK), iOS, Unity-spillmotor og Unreal-spillmotor. 

Denne opplæringen er den første i en kort serie om Android Cardboard og Daydream SDK. I denne serien viser jeg deg hvordan du bruker noen av SDKs verktøy og forhåndsdefinerte visninger for å legge til enkle funksjoner i appene dine. Det er et overraskende antall måter du kan integrere Cardboard SDK i appene dine for spill og multimedia! 

Jeg vil fokusere på tre eksempler som vil komme i gang i verden av VR-utvikling: en photosphere viewer, en 360-videoviser og en inngangsleser for Daydream-kontrolleren. Vi vil fokusere på photosphere viewer i denne opplæringen, og se på de andre to temaene i etterfølgende leksjoner.

Last ned kartong SDK og kjøre prøveprosjektene

I motsetning til de fleste biblioteker i Android er Android Cardboard SDK ikke offisielt tilgjengelig i et eksternt lager som kan importeres som en avhengighet gjennom Gradle. For å kunne bruke det, må du klone Android Cardboard SDK fra GitHub til datamaskinen via Git. 

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

Når du har lastet ned SDK, la oss starte med å kjøre en av de ferdigpakkede prøvene. På startskjermbildet for Android Studio velger du Import prosjekt. Deretter velger du rotmappen for SDK som du bare klonet og trykker på OK.

På dette punktet får du tilgang til alle bibliotekskomponentene og -prøvene som er tilgjengelige i Cardboard SDK for Android. Du kan velge en av prøvene som skal kjøres på enheten din, fra modul-rullegardinmenyen øverst i Android Studio-vinduet. For å sikre at alt fungerer som forventet, velg Prøvene-SDK-simplepanowidget og klikk på den grønne Løpe pil.

Når prøven har kompilert og installert, bør du se en informasjonsskjerm om Machu Picchu, komplett med en visning som roterer rundt en fotosphere når du flytter Android-enheten din.

Nå som du kan kjøre prøveapplikasjonene på enheten din, kan vi dykke inn i å lage nye Kart-aktiverte Android-apper.

Opprette en panoramaviser

La oss starte med å lage et nytt Android-prosjekt med en minimum SDK-versjon på 19 (KitKat). Etter at du har gjennomgått standardinnstillingene for å velge og lage en av appmaler, må du kopiere de nødvendige bibliotekene for prosjektet ditt fra kartong SDK biblioteker katalog inn i prosjektets rotmappe. I dette eksemplet kopierer du følgende mapper: felles, commonwidget, og panowidget.

Når bibliotekets filer er på riktig sted, åpner du prosjektet ditt settings.gradle fil. Du må legge til disse biblioteksmodulene til prosjektet ditt gjennom denne filen.

inkluderer ': app', 'common', 'commonwidget', 'panowidget'

Deretter må du referere til disse bibliotekene i din build.gradle fil under avhengig knutepunkt, slik at du får tilgang til de ferdiglagde komponentene for papp. Du må også legge til Googles protokollbuffere JavaNano-bibliotek, som er en kodegenerering og kjøretidsbibliotek for å hjelpe til med å håndtere de begrensede ressursene til Android-enheter.

avhengigheter compile fileTree (dir: 'libs', inkluderer: ['* .jar']) testCompile 'junit: junit: 4.12' compile 'com.android.support:appcompat-v7:25.0.0' kompilere prosjekt felles ') kompilere prosjekt (': commonwidget ') kompilere prosjekt (': panowidget ') kompilere' com.google.protobuf.nano: protobuf-javanano: 3.0.0-alpha-7 '

Når dine avhengigheter er satt opp, åpner du prosjektet ditt AndroidManifest.xml. Øverst på filen, innenfor manifest node, må du legge til INTERNETT og READ_EXTERNAL_STORAGE tillatelser for kartong SDK.

 

Innen aktivitet node for din Hoved aktivitet klasse, legg til en kategori til intent-filteret for PAPP viewer.

      

Nå som installasjonsprosessen er ferdig, kan vi grave inn i den morsomme delen: koden. Dette prosjektet vil lese et fotosphere bilde fra app / src / main / eiendeler og legg det inn i a VrPanoramaView. Du kan ta et photosphere-bilde gjennom det vanlige Android-kameraet, og legg det inn i denne katalogen. For dette eksempelet vil jeg bruke et bilde som heter openspace.jpg.

I oppsettfilen for din Aktivitet, Legg til en VrPanoramaView som du vil bruke i appen din.

   

Deretter åpner du Hoved aktivitet klasse. Du må først få en referanse til din VrPanoramaView i onCreate (Bundle), og så kan du laste inn din bitmap inn i det via loadPhotoSphere () hjelper metode som vi vil definere i et øyeblikk.

privat 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 () henter bildet vårt fra eiendomsmappen og laster det inn i VrPanoramaView med en VrPanoramaView.Options gjenstand. Det er verdt å merke seg at disse bildene kan være relativt store, slik at denne operasjonen normalt vil forekomme på en bakgrunnstråd, men denne leksjonen vil holde alt på brukergrensesnittet for enkelhet.

Privat ugyldig lastPhotoSphere () // Dette kan ta en stund. Skal gjøre på en bakgrunnstråd, men bra for nåværende eksempel VrPanoramaView.Options options = new VrPanoramaView.Options (); InputStream inputStream = null; AssetManager assetManager = getAssets (); prøv inputStream = assetManager.open ("openspace.jpg"); options.inputType = VrPanoramaView.Options.TYPE_MONO; mVrPanoramaView.loadImageFromBitmap (BitmapFactory.decodeStream (inputStream), alternativer); inputStream.close ();  fangst (IOException e) Log.e ("Tuts +", "Unntak i loadPhotoSphere:" + e.getMessage ()); 

Legg merke til at for VrPanoramaView.Options.inputType verdi, bruker vi TYPE_MONO. Dette betyr at VrPanoramaView Forventer et enkelt kanal bilde å vise, mens a input av TYPE_STEREO_OVER_UNDER forventer et bilde som er delt vertikalt med høyre og venstre øye som ser henholdsvis de øverste og nederste halvdelene av bildet.

Den endelige tingen du må gjøre er å sette pause og fortsette å gjengivne VrPanoramaView i onPause () og onResume (), så vel som å koble den i riktig 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 (); 

Nå som vi er ferdige med å sette opp appen, la oss fortsette og kjøre den. Appen din skal vise din fotosphere på skjermen, og du bør kunne flytte telefonen rundt for å vise forskjellige deler av bildet.

Hvis du trykker på kartongikonet i nederste høyre hjørne av Utsikt, Det vil dele bildet i to svake offset-bilder som kan ses gjennom en kartong eller dagdrøm seer.

Selv om det ikke er brukt i denne opplæringen, er det også verdt å merke seg at VrPanoramaView kan akseptere en VrPanoramaEventListener objekt som vil varsle appen din når et nytt bilde har lyktes eller ikke lastet inn.

Konklusjon

Gratulerer - du har laget din første kartongapp, en bildeviser for panoramautsikt og photosphere-bilder! Selv om dette er et forenklet eksempel, gir det deg grunnleggende om hvordan du lager dine egne apper for å bruke kartongviseren. For et fantastisk eksempel på en app som tar dette konseptet et skritt videre, anbefaler jeg på det sterkeste Google Expeditions utdanningsprogram. 

Jeg håper du har hatt glede av tærne i VR-verdenen. I neste veiledning viser jeg deg hvordan du spiller 360-graders videofiler via kartong SDK.

I mellomtiden kan du sjekke ut noen av våre andre Android VR-kurs og opplæringsprogrammer, her på Envato Tuts+.

  • Utforsk VR med Google Kart

    VR (virtuell virkelighet) er en spennende teknologi som lover nye perspektiver av nedsenkende opplevelse. Med Google Cardboard SDK for Android utvikler du VR ...
    Sue Smith
    Android
  • Pokémon GO stil økt virkelighet med Vuforia

    Med den virale suksessen til Pokemon GO har alle snakket om forstørret virkelighet. I denne opplæringen ser vi på å bruke Vuforia for forstørret virkelighet ...
    Tin Megali
    Mobil utvikling
  • Opprett et Pokémon GO Style Augmented Reality Game med Vuforia

    I denne opplæringen begynner vi å bygge en app med Augmented Reality ved hjelp av Vuforia on Unity 3D. Vi lærer å sette opp Vuforia og begynne å utvikle en AR ...
    Tin Megali
    Mobil utvikling
  • Pokémon GO Style Augmented Reality: Markører

    Nylig har Pokémon Go tatt verden med storm. En av de mest interessante og engasjerende delene av dette spillet er bruken av forstørret virkelighet, eller AR. AR er ...
    Derek Jensen
    Mobilapp