WebXR sisendi valdamine: põhjalik ülevaade kontrolleri nuppude oleku jälgimisest

Kaasahaaravate tehnoloogiate, mis hõlmavad virtuaalreaalsust (VR) ja liitreaalsust (AR), maastik areneb kiiresti. Kaasahaaravate ja interaktiivsete XR-kogemuste loomise keskmes on võime täpselt tabada ja reageerida kasutaja sisendile. Veebipõhise XR-i jaoks pakub WebXR Device API võimsat raamistikku ning kontrolleri nuppude oleku jälgimise mõistmine on intuitiivsete ja reageerimisvõimeliste rakenduste ehitamise alus. See põhjalik juhend süveneb WebXR-i kontrolleri nuppude oleku jälgimise keerukustesse, andes arendajatele üle maailma võimaluse luua tõeliselt köitvaid kaasahaaravaid kogemusi.

Interaktsiooni alus: XR-kontrollerite mõistmine

Enne kui süveneme tehnilistesse üksikasjadesse, on oluline hinnata turul saadaolevate XR-kontrollerite mitmekesisust. Kuigi teatud disainiparadigmad on levinud, esineb platvormide ja tootjate vahel erinevusi. Üldiselt pakuvad XR-kontrollerid mitmesuguseid sisendmehhanisme:

• Nupud: Need on kõige levinumad sisendelemendid, mis pakuvad binaarseid olekuid (vajutatud või mitte). Need võivad olla ühekordse toimega nupud, kahekordse toimega nupud (nt päästik, mida saab teatud punktini pigistada) või isegi liitnupud.
• Pöidlakangid/juhtkangid: Need pakuvad analoogsisendit, võimaldades nüansirikast kontrolli liikumise ja pööramise üle.
• Puuteplaadid/jälitusplaadid: Sageli leidub neid voolujoonelisematel kontrolleritel, pakkudes puutetundlikke pindu, mis suudavad tuvastada puutepositsiooni, žeste ja koputusi.
• Haardeandurid: Need andurid tuvastavad, kui tugevalt kasutaja kontrollerit haarab, võimaldades loomulikke interaktsioone, nagu objektide haaramine.
• Orientatsiooni ja asukoha jälgimine: Kuigi see ei ole rangelt võttes nupu olek, on kontrollerite endi täpne ruumiline jälgimine sisendi kriitiline komponent.

Selle juhendi eesmärgil keskendume peamiselt nupu oleku jälgimisele, kuna see esindab põhilist interaktsioonimeetodit paljude XR-rakenduste jaoks.

WebXR sisendallikad: XRSession ja XRInputSource

WebXR Device API korraldab sisendit sisendallikate kontseptsiooni kaudu. Kui WebXR-i seanss on aktiivne, pakub brauser teavet ühendatud XR-seadmete ja nendega seotud sisendmehhanismide kohta.

XR-seansi haldamise peamine objekt on XRSession. Aktiivse seansi raames saate küsida saadaolevaid sisendallikaid:

            const inputSources = xrSession.inputSources;

            

              
                Copy
              
            
          

Iga element inputSources massiivis on XRInputSource objekt. See objekt on värav konkreetse sisendseadme, näiteks VR-kontrolleri või käejälgimissüsteemi, võimekuse ja hetkeoleku mõistmiseks.

XRInputSource'i peamised omadused nupu jälgimiseks

Füüsiliste kontrolleritega tegelemisel pakub XRInputSource objekt mitmeid olulisi omadusi:

• handedness: Näitab, kas sisendallikas on 'vasaku' või 'parema' käe jaoks. See on ülioluline sisendi sidumiseks õige visuaalse esituse või mängutegelasega.
• targetRayMode: Määrab, kuidas sisendallikas stseeniga suhtleb. Levinumad väärtused on 'gaze' (sisend pärineb kasutaja vaatepunktist) ja 'pointing' (sisend pärineb kontrollerist lähtuvast kiirest).
• gamepad: See on nupu oleku jälgimiseks kõige olulisem omadus. See pakub juurdepääsu standardsele Gamepad objektile, mis kapseldab kontrolleri tooreid sisendandmeid.

gamepad omaduses toimubki maagia. Gamepad objekt, mis on määratletud Gamepad API-ga, pakub üksikasjalikku teavet kontrolleri nuppude ja telgede kohta.

Gamepad objekt ja nuppude indekseerimine

Gamepad objektil, millele pääseb juurde xrInputSource.gamepad kaudu, on sisendi jälgimiseks kaks olulist massiivi:

• buttons: Massiiv GamepadButton objektidest. Iga GamepadButton esindab ühte nuppu kontrolleril.
• axes: Numbrite massiiv, mis esindab analoogsisendite, nagu pöidlakangide ja päästikute (kui neid käsitletakse telgedena), olekut.

Oluline on, et nupu olekutele pääseb juurde nende indeksi kaudu. Nuppude täpne vastavus indeksitele võib kontrolleritüüpide vahel erineda. Siiski püüab WebXR API pakkuda võimalusel standardiseeritud vastavust, eriti levinud nuppude puhul.

GamepadButton'i omaduste mõistmine

Igal GamepadButton objektil buttons massiivis on järgmised peamised omadused:

• pressed: Boole'i väärtus, mis on true, kui nuppu hetkel vajutatakse, ja vastasel juhul false. See on peamine omadus nupuvajutuse tuvastamiseks.
• touched: Boole'i väärtus, mis on true, kui nupul on puuteandur ja kasutaja seda hetkel puudutab. See on kasulik hõljumise olekute või peente puudutuste tuvastamiseks enne täielikku vajutust.
• value: Ujukomaarv vahemikus 0.0 kuni 1.0, mis esindab nupuvajutuse survet või intensiivsust. Standardsete nuppude puhul on see 0.0 või 1.0. Analoogpäästikute või adaptiivsete nuppude puhul võib see esindada vahepealseid väärtusi.

Nupu olekute jälgimine: põhiloogika

Nupu olekute jälgimise põhiprintsiip WebXR-is on pidevalt küsida Gamepad objekti olekut oma rakenduse renderdustsükli jooksul.

Siin on kontseptuaalne ülevaade selle rakendamisest:

1. Hankige XRSession objekt: See tehakse tavaliselt siis, kui XR-seanss on edukalt algatatud.
2. Käige läbi inputSources: Igas animatsioonikaadris käige läbi kõik ühendatud XRInputSource objektid.
3. Kontrollige gamepad'i saadavust: Kõigil sisendallikatel ei ole gamepad omadust (nt pilgupõhine sisend).
4. Juurdepääs gamepad.buttons'ile: Kui gamepad on saadaval, pääsege juurde selle buttons massiivile.
5. Kontrollige individuaalseid nupu olekuid: Käige läbi buttons massiiv ja kontrollige iga GamepadButton'i pressed omadust.

Praktiline näide: peamise nupu vajutuse tuvastamine

Illustreerime seda lihtsustatud JavaScripti näitega. See koodilõik eeldab, et teil on aktiivne xrSession objekt ja olete oma animatsioonitsüklis.

            let primaryButtonIsPressed = false;

function renderLoop(time, frame) {
  // Hangi praeguse kaadri jaoks XRReferenceSpace
  const xrRefSpace = frame.session.requestReferenceSpace('local');

  // Käi läbi sisendallikad
  for (const inputSource of frame.session.inputSources) {
    if (inputSource.gamepad) {
      const gamepad = inputSource.gamepad;

      // Levinud nupuindeksid:
      // Indeks 0: Peamine nupp (nt A Oculus Touchil, X Vive Wandsil)
      // Indeks 1: Teisene nupp (nt B Oculus Touchil, Y Vive Wandsil)
      // Indeks 2: Peamine päästik (sageli analoog)
      // Indeks 3: Teisene päästik (sageli analoog)
      // Indeks 4: Pöidlakangi/jälitusplaadi vajutus

      // Jälgime peamist nuppu (indeks 0)
      const primaryButton = gamepad.buttons[0];

      if (primaryButton) {
        // Tuvasta uus vajutus (üleminek mitte-vajutatust vajutatuks)
        if (primaryButton.pressed && !primaryButtonIsPressed) {
          console.log(`Peamine nupp vajutatud ${inputSource.handedness} kontrolleril!`);
          // Käivita siin oma rakenduse tegevus
          // Näiteks mürsu tulistamine, objekti valimine jne.
        }
        // Tuvasta vabastamine (üleminek vajutatust mitte-vajutatuks)
        if (!primaryButton.pressed && primaryButtonIsPressed) {
          console.log(`Peamine nupp vabastatud ${inputSource.handedness} kontrolleril.`);
          // Vajadusel käsitle nupu vabastamise loogikat
        }
        primaryButtonIsPressed = primaryButton.pressed;
      }

      // Saate seda laiendada, et jälgida teisi nuppe, päästikuid või telgi...
      // const triggerButton = gamepad.buttons[2]; // Näide päästiku kohta
      // if (triggerButton) {
      //   console.log(`Päästiku väärtus ${inputSource.handedness}: ${triggerButton.value}`);
      // }
    }
  }

  // ... ülejäänud renderdusloogika ...

  xrSession.requestAnimationFrame(renderLoop);
}

// Käivita animatsioonitsükkel, kui seanss on aktiivne
// xrSession.requestAnimationFrame(renderLoop);

            

              
                Copy
              
            
          

Nupuindeksite kaardistamine: labürindis navigeerimine

Nagu mainitud, on nupuindeksid kriitilise tähtsusega. Kuigi WebXR API püüdleb standardiseerimise poole, on oluline olla teadlik võimalikest variatsioonidest. Siin on üldine juhend levinud nupuindeksite kohta, kuigi alati tuleks testida oma sihtriistvaraga:

Levinud VR-kontrollerite vastavused (ligikaudsed):

Olulised kaalutlused:

• Kontrollerispetsiifilised kaardistamise tööriistad: Täpseks kaardistamiseks tutvuge konkreetsete VR-peakomplektide (nt Oculus Quest, HTC Vive, Valve Index) dokumentatsiooniga. Paljud arendajad kasutavad ka kogukonna juhitud kaardistamisressursse või ehitavad oma sisemisi kaardistamiskihte.
• XRSession.inputSources.gamepad.mapping: See omadus võib mõnikord anda vihjeid kontrolleri kaardistuse kohta (nt 'xr-standard').
• Testige põhjalikult: Parim lähenemine on testida oma rakendust sihtriistvaral ja jälgida, millised nupuindeksid vastavad soovitud tegevustele.

            let movementSpeed = 0;

function renderLoop(time, frame) {
  // ... (hankige xrSession, käige läbi inputSources) ...

  for (const inputSource of frame.session.inputSources) {
    if (inputSource.gamepad) {
      const gamepad = inputSource.gamepad;

      // Näide: peamise päästiku (indeks 2) kasutamine edasiliikumiseks
      const triggerButton = gamepad.buttons[2];
      if (triggerButton) {
        // Päästikunupu 'value' omadus pakub analoogsisendit
        movementSpeed = triggerButton.value;
        console.log(`Liikumiskiirus: ${movementSpeed.toFixed(2)}`);
        // Rakendage see liikumiskiirus oma tegelase või objekti kiirusele
      }

      // Näide: pöidlakangi X-telje (indeks 8) kasutamine pööramiseks
      const thumbstickX = gamepad.axes[8];
      if (thumbstickX !== undefined) {
        const turnAmount = thumbstickX;
        console.log(`Pöörde suurus: ${turnAmount.toFixed(2)}`);
        // Rakendage see pöörde suurus oma tegelase pööramisele
      }
    }
  }

  // ... ülejäänud renderdusloogika ...

  xrSession.requestAnimationFrame(renderLoop);
}

            

              
                Copy