Oculus Unity: diferència entre les revisions

De FFAWiki
Línia 179: Línia 179:
# Afegir el Prefab UIHelpers a l'escena
# Afegir el Prefab UIHelpers a l'escena
##[[Fitxer:UIHelpers.png|sense marc]]
##[[Fitxer:UIHelpers.png|sense marc]]
# Al EventSystem assignem el RigthHandAnchor al RayTransform i el LaserPointer al Cursor
# A l'EventSystem assignem el RigthHandAnchor al RayTransform i el LaserPointer al Cursor
## [[Fitxer:EventSysitem.png|sense marc|458x458px]]
##[[Fitxer:EventSysitem.png|sense marc|458x458px]]
==Creació del Lobby==
==Creació del Lobby==
# Crear un Canvas amb la configuració de l'imatge i afegir el script OVR Raycaster
# Crear un Canvas amb la configuració de la imatge i afegir el script OVR Raycaster
## [[Fitxer:CanvasLobby.png|sense marc|447x447px]]
##[[Fitxer:CanvasLobby.png|sense marc|447x447px]]
# Crear un script objecte DefaultRoom
# Crear un script objecte DefaultRoom
## [[Fitxer:DefaultRoom.png|sense marc|455x455px]]
## [[Fitxer:DefaultRoom.png|sense marc|455x455px]]
# Modificar el script NetworkManager com l'imatge
# Modificar el script NetworkManager com la imatge
## [[Fitxer:NetworkManagerNew.png|sense marc|652x652px]]
##[[Fitxer:NetworkManagerNew.png|sense marc|652x652px]]
# Crear un botó per connectar-se, assignar al OnClick la funció ConnectToServer del NetworkManager i el setActive false del mateix botó
# Crear un botó per connectar-se, assignar a l'OnClick la funció ConnectToServer del NetworkManager i el setActive false del mateix botó
## [[Fitxer:ButtonConnectarVr.png|sense marc|472x472px]]
##[[Fitxer:ButtonConnectarVr.png|sense marc|472x472px]]
# Crear un empty GameObject Sales
# Crear un empty GameObject Sales
## Crear el botó Unir-se, assignar al OnClick el setActive false del mateix botó, el setActive false del botó crear (creat més endavant), el setActive true del empty unir (creat més endavant)
## Crear el botó Unir-se, assignar a l'OnClick el setActive false del mateix botó, el setActive false del botó crear (creat més endavant), el setActive true de l'empty unir (creat més endavant)
### [[Fitxer:ButtonUnir.png|sense marc|431x431px]]
###[[Fitxer:ButtonUnir.png|sense marc|431x431px]]
## Crear el botó Crear, assignar al OnClick el setActive false del mateix botó, el setActive false del botó Unir-se, el setActive true del empty crear (creat més endavant)
## Crear el botó Crear, assignar a l'OnClick el setActive false del mateix botó, el setActive false del botó Unir-se, el setActive true de l'empty crear (creat més endavant)
### [[Fitxer:ButtonCrear.png|sense marc|458x458px]]
###[[Fitxer:ButtonCrear.png|sense marc|458x458px]]
## Crear el empty Unir amb els inputs i botons necesaris, en el botó Entrar al OnClick assignar la funció Connecar del NetworkManager
## Crear l'empty Unir amb els inputs i botons necessaris, en el botó Entrar a l'OnClick assignar la funció Connectar del NetworkManager
###[[Fitxer:Unir.png|sense marc|471x471px]]
###[[Fitxer:Unir.png|sense marc|471x471px]]
## Crear el empty Crear amb els inputs i botons necesaris, en el botó Entrar al OnClick assignar la funció Crear del NetworkManager
## Crear l'empty Crear amb els inputs i botons necessaris, en el botó Entrar a l'OnClick assignar la funció Crear del NetworkManager
### [[Fitxer:Crear.png|sense marc|474x474px]]
###[[Fitxer:Crear.png|sense marc|474x474px]]
## Crear un Text per poder per retornar informació
## Crear un Text per poder per retornar informació
### [[Fitxer:CanvasError.png|sense marc|473x473px]]
### [[Fitxer:CanvasError.png|sense marc|473x473px]]


==Gestió de sales amb BBDD==
==Gestió de sales amb BBDD==
# Crear el script SalesManager i assigna-lo al NetworkManager
# Crear el script SalesManager i assignar-lo al NetworkManager
## [[Fitxer:SalesManager.png|sense marc|1061x1061px]]
##[[Fitxer:SalesManager.png|sense marc|1061x1061px]]
# En el servidor PHP crear el controlador amb les funcions necesaries
# En el servidor PHP crear el controlador amb les funcions necessàries
## [[Fitxer:ContoladorPHPSalesOculus.png|sense marc|667x667px]]
##[[Fitxer:ContoladorPHPSalesOculus.png|sense marc|667x667px]]
# En el servidor PHP crear el model amb les funcions necesaries
# En el servidor PHP crear el model amb les funcions necessàries
## [[Fitxer:ModelPHPSalesOculus.png|sense marc|814x814px]]
##[[Fitxer:ModelPHPSalesOculus.png|sense marc|814x814px]]
# Al NetworkManager en el script NetworkManager assignar el GameObject Sales i en el script SalesManager tots els camps (InfoSala el crearem més endavant)  
# Al NetworkManager en el script NetworkManager assignar el GameObject Sales i en el script SalesManager tots els camps (InfoSala el crearem més endavant)  
## [[Fitxer:NetworkManagerNewInspector.png|sense marc|635x635px]]
## [[Fitxer:NetworkManagerNewInspector.png|sense marc|635x635px]]


==Pasar info del Lobby al nivell==
==Pasar informació del Lobby al nivell==
# Crear un canvas i un text amb la configuració de l'imatge
# Crear un canvas i un text amb la configuració de la imatge
## [[Fitxer:InfoSala.png|sense marc|508x508px]]
##[[Fitxer:InfoSala.png|sense marc|508x508px]]
# Creem el script InfoSala i l'assigem al canvas anterior
# Creem el script InfoSala i l'assignem al canvas anterior
## [[Fitxer:InfoSalaScript.png|sense marc|447x447px]]
##[[Fitxer:InfoSalaScript.png|sense marc|447x447px]]

Revisió del 08:38, 21 març 2022

Un Jugador

Importar Paquets

  • Posar el Package Manager amb mode prova:
  • Package Manager -> Icona de configuració -> Advanced Project Settings -> enable Preview Packages
PackageManagerProva.png
  • Entrar a Package Manager, filtrar per Unity Registry:
  1. XR Interaction Toolit
  2. XR Plug-in Management
  3. Instal·lar SDK Oculus per Unity
  4. Prefab de les mans (entre altres)

Activar Suport de oculus

  1. Canviar la plataforma a Android
    1. SW Android.png
  2. Edit -> Project Settings -> XR Plug-in Management
    1. Habilitar Oculus a la pestanya de PC i Android
    2. ActivarSuportAndroid.png
  3. Edit -> Project Settings -> XR Plug-in Management -> Oculus
    1. Editar preferències segons necessitats.
    2. ActivarSuportAndroidOculus.png

Afegir l'esquelet (l'entorn VR)

  1. Eliminar la càmera per defecte de l'escena a la finestra Hierarchy
  2. A la finestra de Project, anar a:
    1. Assets -> Oculus -> VR -> Prefab -> OVRCameraRig
    2. Arrossegar OVRCameraRig a l'escena (Hierarchy).
  3. Al objecte OVRCameraRig -> Inspector -> OVR Manager (Script)
    1. Al paràmetre Quest Features el posem en mode General.
    2. L'opció Render Model Suport la canviem a Enabled.
      1. RenderModelAndroid.png
  4. Afegir el controlador de les mans:
    1. A Project anar a: Assets -> Oculus -> VR -> Prefabs -> OVRRuntimeControllerPrefab
    2. Arrossegar OVRRuntimeControllerPrefab a LeftControllerAnchor i a RightControllerAnchor
    3. Tant a LeftControllerAnchor com a RightControllerAnchor assignar a l'script (ja afegit), OVR Runtime Controller i posar el paràmetre Controller L Touch/ R Touch respectivament.
      1. ControladorMansOculus.png
    4. Afegir el prefab de les mans respectivament:
      1. En la finestra de project i anar a: Assets -> Prefabs
      2. Arrossegar Left Hand Presence a LeftControllerAnchor i el mateix amb Right Hand Presence però a RightControllerAnchor
      3. PrefabMansOculus.png

Crear Objectes interactius

  • Farem un entorn de prova, després cadascú pot utilitzar l'exemple com a base.
  1. Creem un terra, un quadrat que farà de taula i un altre quadrat que farà d'objecte interactiu:
    1. Creem una carpeta a Assets anomenada Materials on guardarem els materials
      1. Crearem els materials Vermell i Negre.
    2. A l'escena (Hierarchy) fem clic dret -> 3D Object -> Plane
      1. Li assignem el material negre.
    3. A l'escena (Hierarchy) fem clic dret -> 3D Object -> Cube i posicionar-lo al gust.
    4. A l'escena (Hierarchy) fem clic dret -> 3D Object -> Cube, el fem més petit i el posicionem sobre el cub creat anteriorment.
      1. Li afegim un Box Colider (si no el te ja), un Rigidbody, i l'script OVRGrabbable
    5. Assignem a les mans (LeftHandAnchor i RightHandAnchor) un Sphere Collider:
      1. Posar Radius a 0.05.
      2. Activar Trigger
    6. Assignem a les mans (LeftHandAnchor i RightHandAnchor) l'script OVRGrabber:
      1. Activar Parent Held Object
      2. Assignar RightControllerAnchor a Grip Transform i repetir el procés amb l'altra mà.
      3. Afegir el Sphere Collider del mateix objecte com a nou element de Grap Volumes.
      4. Seleccionar L Tocuh/R Touch respectivament (la ma dreta i l'esquerra) en el paràmetre Controller.
      5. ObjecteInteractuaOculus.png

Multi Jugador

Importar Paquets

Configurar Photon (WEB)

  • T'has de crear un compte a Photon
  • Crearem una nova app (Create a new app):
  1. Posem tipus PUN en la primera opció
  2. Posem un nom
  3. Li donem a CREATE
    1. CrearPun.png
  4. Anem al Dashboard i ens situem a les nostres app
  5. Copiem el APP id de l'app que acabem de crear
    1. APPidPun.png

Configurar Photon (UNITY)

  • Posarem l'id de l'APP a unity
  1. Window -> Photon Unity networking -> Highlight Server Settings
  2. Posar la id anteriorment copiada a App Id PUN
  3. APPidPunUnity.png

Configurar/Crear NetworkManager

  1. Creem un Empty a l'escena anomenat NetworkManager
  2. Creem i assignem a l'objecte anterior l'script NetworkManager
    1. ScriptNetworkManager.png
  3. Creem i assignem a l'objecte anterior l'script NetworkPlayerSpawner
    1. ScriptNetworkPlayerSpawner.png

Crear el Prefab del player dels clients de la xarxa

  1. Creem un Script anomenat NetworkPlayer:
    1. ScriptNetwoekPlayer.png
  2. Creem un Empty anomenat Network Player.
    1. Li assignem l'script Photon View i l'script creat anteriorment NetworkPlayer
    2. Posem a dins un Empty que es dirà Head i li assignem l'script Photon Transform View amb els paràmetres que es mostren a la captura:
      1. PhotonTransformView.png
    3. A dins el Head Posem una Sphere amb Scale x0.17 y0.17 z0.17 i Position tot a 0
    4. Dins el Network Player posem dos empty mes amb els noms LeftHand/RightHand
    5. A LeftHand/RightHand li assignem l'script Photon Transform View amb els paràmetres que es mostren a la captura anterior
    6. A la finestra Project anem a Assets -> Models -> prefabs i assignem "Custom Left Hand Model/Custom Right Hand Model" a "LeftHand/RightHand" respectivament
      1. NetworkPlayerPrefab.png
    7. Tan a Custom Left Hand Model com a Custom Right Hand Model li assignem l'script Photon Animator View amb les característiques que es mostren a la captura:
      1. PhotonAnimatorView.png
  3. Assignem els paràmetres de l'script Network Player de l'objecte Network Player d'aquesta manera:
    1. ParametresNetworkPlayerScript.png
  4. Creem una carpeta a Assets que es digui Resources (si no està ja creada).
    1. Arrossegue'm Network Player a la carpeta mencionada anteriorment creant així un prefab

Crear Objectes interactius en línia

  1. En el cub vermell creat anteriorment li afegim els components:
    1. Box Collider (si no el te ja)
    2. RigidBody (si no el te ja)
    3. Photon View
      1. Posar Ownership Transfer a Takeover
    4. Photon Rigidbody View
      1. Activar els tres checkbox i posar teleport if distance grater than a 3
    5. Crearem un script que es digui OVRGrabbableFFA i li assignarem també. (Important, estem creant un fill de OVRGrabbable, per tant, s'ha d'esborrar l'script de l'objecte)
      1. ScriptOVRGrabbableFFA.png
    6. En resum s'ha de veure axi:
      1. Cubinteratuable.png

Implementar Audio

Importar Paquets

Configurar Photon (WEB)

  • T'has de crear un compte a Photon
  • Crearem una nova app (Create a new app):
  1. Posem tipus Voice en la primera opció
  2. Posem un nom
  3. Li donem a CREATE
    1. CrearVoicePun.png
  4. Anem al Dashboard i ens situem a les nostres app
  5. Copiem el APP id de l'app que acabem de crear
    1. APPidVoice.png

Configurar Photon Voice (UNITY)

  • Posarem l'id de l'APP a unity
  1. Window -> Photon Unity networking -> Highlight Server Settings
  2. Posar la id anteriorment copiada a App Id Voice
    1. APPidVoiceUnity.png

Configurar/Crear NetworkVoice

  1. Creem un Empty a l'escena anomenat NetworkVoice
  2. Li assignem Photon Voice Network i Recorder a l'objecte anterior amb les configuracions de la imatge
    1. NetworkVoice.jpg

Configurar Audio Listener

  1. Afegim en el CenterEyeAnchor (on hi ha la càmera) l'AudioListener (Si no és que ja el té)
    1. AudioListener.jpg

Reconfigurar prefab NetworkPlayer

  1. Afegim en el prefab NetworkPlayer un Empty anomenat Speaker com a fill i li afegim la propietat Speaker
  2. Modifiquem les propietats d'AudioSource del objecte anterior com a la imatge
    1. NetworkPlayerSpeaker.jpg
  3. Afegim la propietat Photon Voice View i li assignem el Speaker que hem creat anteriorment
    1. NetworkPlayerVoice.jpg

Lobby i Sales (BBDD)

Interacció amb canvas

  1. Afegir el Prefab UIHelpers a l'escena
    1. UIHelpers.png
  2. A l'EventSystem assignem el RigthHandAnchor al RayTransform i el LaserPointer al Cursor
    1. EventSysitem.png

Creació del Lobby

  1. Crear un Canvas amb la configuració de la imatge i afegir el script OVR Raycaster
    1. CanvasLobby.png
  2. Crear un script objecte DefaultRoom
    1. DefaultRoom.png
  3. Modificar el script NetworkManager com la imatge
    1. NetworkManagerNew.png
  4. Crear un botó per connectar-se, assignar a l'OnClick la funció ConnectToServer del NetworkManager i el setActive false del mateix botó
    1. ButtonConnectarVr.png
  5. Crear un empty GameObject Sales
    1. Crear el botó Unir-se, assignar a l'OnClick el setActive false del mateix botó, el setActive false del botó crear (creat més endavant), el setActive true de l'empty unir (creat més endavant)
      1. ButtonUnir.png
    2. Crear el botó Crear, assignar a l'OnClick el setActive false del mateix botó, el setActive false del botó Unir-se, el setActive true de l'empty crear (creat més endavant)
      1. ButtonCrear.png
    3. Crear l'empty Unir amb els inputs i botons necessaris, en el botó Entrar a l'OnClick assignar la funció Connectar del NetworkManager
      1. Unir.png
    4. Crear l'empty Crear amb els inputs i botons necessaris, en el botó Entrar a l'OnClick assignar la funció Crear del NetworkManager
      1. Crear.png
    5. Crear un Text per poder per retornar informació
      1. CanvasError.png

Gestió de sales amb BBDD

  1. Crear el script SalesManager i assignar-lo al NetworkManager
    1. SalesManager.png
  2. En el servidor PHP crear el controlador amb les funcions necessàries
    1. ContoladorPHPSalesOculus.png
  3. En el servidor PHP crear el model amb les funcions necessàries
    1. ModelPHPSalesOculus.png
  4. Al NetworkManager en el script NetworkManager assignar el GameObject Sales i en el script SalesManager tots els camps (InfoSala el crearem més endavant)
    1. NetworkManagerNewInspector.png

Pasar informació del Lobby al nivell

  1. Crear un canvas i un text amb la configuració de la imatge
    1. InfoSala.png
  2. Creem el script InfoSala i l'assignem al canvas anterior
    1. InfoSalaScript.png