[Unity] Crea tu propio programa AR interactivo de Android

1 Crea una escena AR

Siguiendo la creación de un programa Android de efectos especiales faciales AR en el artículo anterior , esta vez cree su propio programa AR interactivo. Utilice también el proyecto anterior, utilice Ctrl+N para crear una nueva escena (o Archivo→Nueva escena) en la carpeta Escena de Activos, seleccione la escena AR y haga clic en Crear para crear:

2 Configure la cámara AR como la cámara frontal

Como aquí también se reconoce el rostro, también es necesario utilizar la cámara frontal del dispositivo móvil

1. Busque el objeto AR Session Origin en la Jerarquía, expanda su objeto colapsado y busque el objeto AR Camera.
2. Busque el componente Administrador de cámara AR en el panel Inspector de la cámara AR y establezca la propiedad Dirección de orientación en Usuario:
   

3 Configurar la escena del embalaje

Seleccione Archivo → Configuración de compilación en la barra de menú, agregue la escena recién creada a la lista de empaquetado y oculte o elimine la escena anterior:

4 Descargue el recurso oficial InteractiveFaceFilterAssets

La ubicación de descarga zip está aquí , haga clic para descargar.
Después de descargar y descomprimir, puede importar InteractiveFaceFilter.unitypackage a la carpeta Activos del proyecto.

Método de importación:

En la carpeta donde se descomprime el archivo zip, busque el paquete de unity, arrástrelo a la carpeta Activos de Unity y luego aparecerá una ventana para importar recursos, haga clic en Importar en la esquina inferior derecha para importar.

Recursos importados:

• Mallas: Hay cinco modelos de gafas con diferentes estilos.
• Prefabricados: AR_Canvas prefabricados, que es la interfaz de usuario para la interacción.
• Recursos: contiene plantillas de interfaz de usuario en formato PSD para crear las nuestras.
• Sprites: contiene la interfaz de usuario para crear interfaces de usuario.

5 Configurar el Administrador de rostros AR

En este paso, usaremos AR Face Manager para decirle a AR Session Origin qué efectos especiales se mostrarán en la cara cuando se detecte.

1. Elimine el objeto Cubo en la Jerarquía, es solo para probar.

2. Seleccione el objeto AR Session Origin, busque y agregue el componente AR Face Manager en su ventana Inspector, que se utiliza para detectar rostros:
   

6 Crea las gafas prefabricadas

En este paso, cree un prefabricado para todas las gafas disponibles, denominado "GlassesGroup", para que el usuario seleccione las gafas.

1. Busque _InteractiveFaceFilter → Meshes en la carpeta Activos, arrastre los tres pares de anteojos que desea instalar en el dispositivo móvil a la ventana Jerarquía y establezca sus posiciones en (0,0,0) en el panel Inspector.
2. Con los tres pares de anteojos seleccionados, haga clic con el botón derecho en Crear principal vacío para crear un objeto principal vacío para los tres pares de anteojos y asigne al objeto vacío el nombre "GlassesGroup".
   

7 Configurar el seguimiento facial AR

Para que los anteojos aparezcan exactamente donde están los ojos, debemos convertir el Grupo de anteojos en un prefabricado AR Face.

1. Agregue el componente AR Face a GlassesGroup en el panel Inspector para que GlassesGroup rastree el movimiento de la cara:
   

2. Arrastre el Grupo de gafas en la Jerarquía a Activos → _InteractiveFaceFilter → Prefabricados para hacer un prefabricado:
   

3. Arrastre el prefabricado preparado al Face Prefab del componente AR Face Manager del objeto AR Session Origin:
   

8 Resultados de la prueba

8.1 Pruebas en Unity

Primero asegúrese de que la vista del Juego esté adaptada a la resolución 16:9 del teléfono móvil, luego regrese a la ventana de Escena, seleccione el objeto Grupo de Gafas en la ventana de Jerarquía y cambie su posición en el eje Z a 0.4 para que pueda se mostrarán en el centro de la ventana del Juego:

Del mismo modo, para que estas gafas aparezcan en el centro del campo de visión del dispositivo móvil, el eje PositionZ del prefabricado de GlassesGroup debe modificarse a 0,4:

8.2 Pruebas en un dispositivo Android

Si está probando en Unity, use el prefabricado de GlassesGroup en la Jerarquía; y si quiere probar en un dispositivo móvil Android, debe ocultar el prefabricado de GlassesGroup en la Jerarquía.

1. Oculte el prefabricado de GlassesGroup en la Jerarquía.
2. Consulte la Sección 3.2 de este artículo para la configuración del proyecto .
3. Ctrl+S para guardar la escena, barra de menú Archivo → Configuración de compilación, seleccione Construir para empaquetar apk, exportar a dispositivo Android para probar.
4. Después de que el programa se abre y detecta una cara, los tres anteojos se mostrarán en la cara.

9 Agregue sus propias ideas basadas en esta escena AR

9.1 Cambiar la talla del modelo de gafas

El tamaño del modelo de anteojos en el proyecto se basa en el rostro humano general. Podemos modificar la relación de tamaño de los anteojos o rotarlos para hacerlos más interesantes.

9.2 Importar un nuevo modelo de Internet

Hay muchos modelos de gafas en sitios web como Sketchfab , que se pueden descargar e importar al proyecto. En cuanto a la selección del modelo, hay tres consideraciones generales:

• formato modelo. Asegúrese de que el formato del modelo sea compatible con Unity, como el formato FBX.
• Complejidad del modelo: es mejor no encontrar un modelo que sea demasiado complejo y tenga demasiadas caras, que no sea amigable para la optimización móvil.
• Licencia del modelo: tenga en cuenta que el modelo tendrá una licencia CC, que especificará lo que el artista puede usar en él. Consulte aquí los detalles sobre la licencia CC .
  Utilice este recurso de gafas steampunk como en , de Kisielev Mikhail, con licencia Creative Commons Attribution .

9.3 Haz tu propio modelo

Aquí hay algunas cosas que debe considerar al hacer sus propios modelos de anteojos:

• Solo se incluye la parte frontal de las gafas : Siempre vemos todas las partes del modelo de gafas, por lo que cuando el usuario gira la cabeza, las patillas pueden superponerse a las orejas, rompiendo la inmersión. Podríamos modelar hasta donde las gafas pasarían alrededor de las orejas, pero si la cara del usuario fuera un poco más larga, es posible que el modelo no toque sus orejas.
• Mantenga el recuento de rostros del modelo en un rango bajo : dado que el proyecto final se utilizará en dispositivos móviles, el modelo debe estar lo más optimizado posible.
• Limite el modelo a un material : dado que implementaremos la capacidad de cambiar el color de las gafas más adelante, debemos limitarlas a un material.
• El origen y la dirección del modelo : el origen del modelo de anteojos que creamos debe estar en el origen del sistema, y ​​la orientación de los anteojos debe estar alineada con la cara AR. El modelo Face_Reference_Mesh se puede importar como referencia.

10 Configurar la interfaz de usuario

10.1 Agregar prefabricado AR_Canvas

El proyecto utiliza el sistema UGUI, es decir, todas las IU se administran mediante componentes de Canvas, que son todos subobjetos de Canvas.

1. Busque el prefabricado AR_Canvas en _InteractiveFaceFilter → Prefabs en Activos y arrástrelo a la ventana Jerarquía.
2. Puede ver el efecto de visualización de la interfaz de usuario en la ventana del juego:
   
   AR_Canvas se representa con el espacio de pantalla como superposición, lo que significa que siempre se representa sobre otros objetos y se puede mostrar con precisión en una posición fija en la ventana del juego.
3. AR_Canvas consta de 3 subobjetos: los botones de gafas y los botones de materiales se utilizan para controlar el cambio de gafas y materiales de gafas, respectivamente. El EventSystem se utiliza para detectar la entrada del usuario.
   

10.2 Botón de gafas personalizadas

Ahora los botones de cambio de anteojos se representan en forma de círculos. Para que los usuarios puedan distinguir de manera más intuitiva qué botón cambia a qué par de anteojos, el círculo debe reemplazarse con un ícono de anteojos específico.

Unity usa una hoja de sprites para almacenar un atlas, que se puede dividir para que las imágenes se puedan usar solo en Unity:

1. Busque el atlas UI_Icon_Glasses en _InteractiveFaceFilter → Sprites in Assets, haga clic en ">" junto a él para expandirlo y podrá observar los Sprites cortados.
   
2. Asigne el icono de las gafas al botón de las gafas. Use el sprite de arrastrar y soltar en la imagen de origen debajo del componente Imagen del botón para lograr:
   

10.3 Botones de materiales personalizados

Para hacer que las gafas sean más hermosas, es necesario definir aquí botones de diferentes materiales (colores):

1. Expanda los Botones de materiales en la ventana Jerarquía, busque los tres subobjetos debajo y modifique el Color debajo del componente Imagen respectivamente.
2. El efecto final es el siguiente:
   

10.4 Otros intentos

También podemos probar algunos de los siguientes:

• Mueva el botón a otras posiciones en la interfaz de usuario, como la parte superior: modifique el componente Rect Transform del componente de icono o use directamente la tecla de método abreviado W para moverse a una posición adecuada.
  

• Cree su propio ícono de anteojos: si está utilizando su propio modelo de anteojos, puede crear su propio ícono de anteojos modificando el archivo PSD UI_Icon_Glasses_Template

11 Interacción con secuencias de comandos visuales

11.1 Introducción a Visual Scripting

Podemos crear funciones lógicas para nuestros proyectos utilizando Visual Scripting, que es una forma de visualizar la lógica.

Los siguientes diagramas izquierdo y derecho son la misma expresión lógica:

Visual Scripting también brinda acceso a los no programadores a toda la interfaz de programación de aplicaciones (API) de Unity Scripting . Esta API contiene un conjunto completo de definiciones de clases, eventos, métodos (comportamientos) y propiedades (configuraciones) que se pueden manipular en los scripts de Unity.

11.2 Crear un gráfico

Los scripts visuales se almacenan en gráficos, que se pueden aplicar a cualquier GameObject en forma de componentes.
1. Cree un objeto vacío en Crear vacío en la jerarquía, asegúrese de que sus coordenadas estén en (0,0,0) y asígnele el nombre "Visual Scripts".
2. Agregue el componente "Máquina de secuencias de comandos" a la ventana de inspección de "Visual Scripts".

El componente "Máquina de scripts" es una herramienta para ejecutar scripts visuales.

3. Seleccione "Nuevo" para crear un nuevo gráfico, asígnele el nombre "MeshChanger" y guárdelo en la carpeta "Visual Scripts" recién creada.
4. Se puede observar que el gráfico "MeshChanger" recién creado aparece en el parámetro Graph del componente "Script Machine", y aparecen dos nuevos parámetros: Título y Resumen. Estos dos parámetros se pueden utilizar para distinguir diferentes "Máquinas de secuencias de comandos".
   
5. Modifique el Título y el Resumen de la siguiente manera para indicar el propósito del guión visual:
   

11.3 Editar secuencia de comandos de visualización

11.3.1 Haga clic en el botón Información de salida de la consola

1. Haga clic en Editar gráfico en el componente Máquina de secuencias de comandos para abrir el espacio de trabajo de secuencias de comandos visuales. Si es la primera vez que abre, aparecerá un cuadro de diálogo, simplemente seleccione Cambiar ahora.
   

   Y un nuevo GameObject llamado VisualScripting SceneVariables se generará automáticamente en la Jerarquía.

2. Los nodos son los componentes que se utilizan para construir la lógica en el gráfico y existen varios tipos diferentes de nodos. Cada vez que se crea un nuevo gráfico, cargará los nodos On Start y On Update.
   
   En el lado derecho de la ventana de Script Graph se encuentra el Editor de gráficos, donde se establece la lógica de los gráficos; en el lado izquierdo de la ventana se encuentra el Inspector de gráficos, que nos mostrará los detalles del objeto seleccionado; debajo de la ventana del Inspector de gráficos se encuentra la Pizarra, donde se crean las variables.

3. Operaciones en el editor de gráficos:

   • Mantenga presionado el botón central del mouse para arrastrar la vista para controlar el movimiento;
   • Mantenga presionada la tecla Ctrl y desplace la rueda del mouse para hacer zoom en la vista.
   • Haga clic derecho para crear un nuevo nodo.

4. Seleccione el nodo On Start y la ventana Inspector de la izquierda muestra que el nodo tiene una Salida llamada "Activador". Las entradas (y salidas) del flujo (Flow) determinan el flujo lógico del gráfico.
   

5. Las funciones que necesitamos implementar aquí no necesitan usar los nodos On Start y On Update. Por lo tanto, después de seleccionarlos, haga clic con el botón derecho y seleccione Eliminar para eliminar o presione directamente la tecla Eliminar para eliminar.

6. Haga clic con el botón derecho para crear un nodo On Button Click o haga clic en Eventos > GUI > On Button Click para crear:
   
   A diferencia de los nodos On Start y On Update, On Button Click tiene una sección Entradas.

   Hay dos tipos de entradas: entradas de control y entradas de datos.

   • La entrada de control controla el flujo lógico del gráfico.
   • Las entradas de datos reciben valores de un tipo específico de otros nodos que el nodo receptor necesita para realizar su tarea.
    

   El nodo On Button Click solo ejecuta el evento cuando se presiona el botón, por lo que necesita saber qué botón debe monitorear.

   En la ventana Graph Inspector, la entrada del nodo Al hacer clic en el botón busca un objetivo de GameObject, y este GameObject es el botón de entrada que el nodo Al hacer clic en el botón supervisará.

   De forma predeterminada, el nodo Al hacer clic en el botón tiene un parámetro denominado Esto, que es donde se conectará la entrada de destino. Cuando no hay ningún nodo de entrada conectado, el nodo tiene una protección: buscará la entrada de destino en el GameObject al que está asignado.

   En este caso, si el parámetro se deja en blanco, el nodo On Button Click buscará un componente Button en el Visual Scripts GameObject adjunto a la Script Machine que creamos. Esto está bien si la imagen del script está adjunta a un botón en AR_Canvas;

   Pero si el gráfico está en diferentes GameObjects, entonces necesita usar variables para controlarlo.

   Las variables son contenedores para diferentes tipos de datos. Estos datos pueden ser números, GameObjects, sonidos o cualquier otra cosa. Las variables se pueden generar en el propio gráfico o como referencias a otros objetos en la aplicación. En este ejemplo, crearemos una variable que hará referencia a un botón en la interfaz de usuario.

7. Crea una variable. Las variables se crean en Blackboard y hay algunas pestañas en la parte superior de Blackboard de la siguiente manera:
   

   • Grafico
   • Objeto
   • Escena
   • aplicación
   • Salvado
    

   Estas etiquetas son diferentes variables categóricas que podemos crear. Como necesitamos crear una variable que haga referencia al GameObject en la escena, crearemos una variable Object.

8. Primero, seleccione la etiqueta Objeto, ingrese "glass1Button" y haga clic en el signo "+" o presione "Enter" para agregar una variable; luego, establezca el tipo de variable (Tipo) en Button, y seleccione Glasses1Button en la Jerarquía para su Parámetro de valor; finalmente, configure Arrastre la variable "glasses1Button" creada en Blackboard al gráfico para convertirse en un nodo Obtener variable.
   
   
   El nodo Obtener variable de Glasses1Button también tiene un parámetro This, que, al igual que Al hacer clic en el botón, es una opción de respaldo cuando el valor de retorno de Obtener variable no está completo. Pero dado que este nodo se define como glasses1Button, no es necesario tener un valor de retorno.

9. Conecte el nodo Get Variable y el nodo On Button Click, para realizar la detección del evento de que se presiona el botón Glasses1Button.
   
   Observe que el valor Este en el nodo Al hacer clic en el botón desaparece porque ahora acepta la variable glasses1Button.
   Después de esta conexión, haga clic en Reproducir para ejecutar el proyecto y verá que cuando hace clic en el primer ícono de anteojos, el nodo Al hacer clic en el botón parpadea, lo que significa que ha recibido el clic en el botón.

10. Para generar un mensaje en la ventana Consola después de hacer clic en el botón, puede agregar un nodo Registro de depuración (Mensaje) y un nodo Literal de cadena en el Gráfico para generar un mensaje de texto.
    
    Entre ellos, la función del nodo Registro de depuración (Mensaje) es enviar un mensaje a la consola de Unity. Este nodo tiene una entrada de flujo y objeto, y el contenido de la entrada de objeto es una cadena u objeto convertido en una representación de cadena, que es conveniente para la visualización. Por lo tanto, debe crear un nodo String Literal (cadena).
    Conecte la salida de Flujo en el lado derecho del nodo On Button Click a la entrada de Flujo en el lado izquierdo del nodo Debug Log, luego conecte la salida del nodo String Literal que dice "¡Botón 1 presionado!" a la entrada de Mensaje en el lado izquierdo del nodo Registro de depuración.
    
    Después de ejecutar, puede encontrar que la consola muestra "¡Botón 1 presionado!" después de detectar que el botón está presionado

Además, puede intentar usar los nodos Get Name, String y Concat para obtener el nombre de GameObject y empalmar las cadenas para generar:

11.3.2 Haga clic en el botón para activar el evento del modelo de visualización

1. Para lograr el efecto del modelo de gafas que aparece cuando se hace clic en el botón, primero se debe desactivar el componente Mesh Renderer del modelo de gafas.Este componente se utiliza para gestionar la visibilidad de un GameObject.
   

2. En Unity, hay varias formas de ubicar rápidamente un GameObject específico en un script. Uno de los métodos es asignar una etiqueta única, la etiqueta, al GameObject. Aquí, se agrega una etiqueta única a cada uno de los tres vasos para identificarlos y distinguirlos mejor.
   

3. En la ventana Jerarquía, seleccione el objeto Grupo de gafas, seleccione el menú desplegable a la derecha de Anulaciones en su ventana Inspector y haga clic en Aplicar todo para guardar la configuración de la etiqueta en el prefabricado.
   

4. Actualice el gráfico de script, para identificar el objeto del juego a través de la etiqueta, debe usar el nodo Buscar con etiqueta.
   
   Puede ver que este nodo devuelve un GameObject activo en la escena. Dado que acabamos de deshabilitar los renderizadores de malla del modelo de gafas antes, todavía están en estado activo, por lo que se pueden encontrar usando Buscar con etiqueta. Este nodo requiere una entrada de datos (Flujo), que es el nombre de la etiqueta a buscar.

5. Conecte la salida de datos (flujo) del nodo On Button Click a la entrada de datos (flujo) del nodo Buscar con etiqueta.
   

6. Use el renderizador de malla: establecer el nodo habilitado para realizar la función del usuario al hacer clic en el botón para mostrar el modelo de anteojos.
   
   Los detalles de este nodo son los siguientes:
   

   Se puede observar que se requieren dos datos para usar este nodo:

   • Destino: el renderizador de malla específico que el nodo hará sonar
   • Valor: el renderizador de malla está habilitado o deshabilitado. Si el valor de Bool se establece en verdadero (habilitado), entonces el renderizador de malla especificado se habilitará. Si el valor de Bool se establece en falso (deshabilitado), entonces Mesh Renderer se deshabilitará.

7. Conecte la salida de datos (flujo) del nodo Find with Tag a la entrada del nodo Set Enabled, conecte la salida de resultados del nodo Find with Tag a la entrada del nodo Set Enabled y marque el valor Bool. Esto significa que cuando se hace clic en el botón, se mostrará el modelo de gafas para la etiqueta específica.
   
   Cuando haga clic en Reproducir prueba, encontrará que hace clic en el primer botón y las gafas que se muestran en el botón también aparecerán en la escena.

8. Copie dos gráficos de script preparados, agregue dos variables de objeto, arrastre los dos botones restantes a su valor y modifique el valor correspondiente en el nodo Obtener variable. Luego, modifique el valor Etiqueta del nodo Buscar con etiqueta a la etiqueta específica de anteojos establecida anteriormente.
   
   
   Al hacer clic en la prueba Reproducir, encontrará que las gafas aparecen en la escena una por una después de hacer clic en el botón, pero están superpuestas, porque aún no se ha agregado la función para ocultarlas.

Luego se puede empaquetar en apk y ejecutar la prueba en el dispositivo Android.Tenga en cuenta que el grupo de gafas en la jerarquía debe deshabilitarse.

11.3.3 Haga clic en el botón para activar el evento de cambio de modelo

Dado que el modelo de gafas aparecía superpuesto en la sección anterior, es necesario utilizar el nodo Mesh Renderer: Set Enabled para deshabilitar la visibilidad del modelo de gafas.

1. Copie el nodo Buscar con etiqueta y el nodo Establecer habilitado de los tres botones en el gráfico de script y desmarque el nodo Establecer habilitado.
   

2. Modifique el gráfico de script para que cuando el usuario haga clic en cualquier botón, no se muestren todos los modelos de anteojos. Dado que Visual Script se ejecuta muy rápido, las gafas ocultas que se ejecutan secuencialmente parecen estar ocultas al mismo tiempo.
   

3. A continuación, debe colocar los nodos conectados anteriores en el proceso indicado por la flecha en la figura a continuación, porque todos los modelos de anteojos deben ocultarse antes de que se muestren los modelos de anteojos correspondientes.
   
   Pero se puede ver que la secuencia en el cuadro rojo de arriba es relativamente larga, por lo que debe convertirse en un evento personalizado, de modo que podamos usarla como un solo nodo para llamar al evento.

4. Cree un nuevo nodo de evento personalizado, asígnele el nombre "DisableRenderers" y conecte su flujo de salida derecho al flujo de entrada izquierdo de la secuencia anterior.
   

   Se puede observar desde el panel Inspector gráfico que el flujo de entrada del nodo Evento personalizado puede ser GameObject o String.
   
   Aquí se usa una cadena "DisableRenderers" para nombrar el evento personalizado, que luego se usa para llamar al evento.

5. Utilice el nodo Trigger Custom Event para llamar al evento personalizado anterior. Cree un nuevo nodo Trigger Custom Event y duplique dos. Haga clic con el botón derecho en el flujo de salida o flujo de entrada del nodo para desconectar e insertar el nodo después del nodo OnButtonClick.
   
   Podemos pensar en el nodo Trigger Custom Event como un enlace (enlace), cuando se llama a este nodo, comenzará la secuencia de nodos en su evento personalizado asociado.
   

Haga clic en Reproducir para ejecutar la prueba en el editor, y puede encontrar que cuando hace clic en el botón correspondiente, aparecerá el modelo correspondiente y no aparecerá superpuesto.

Luego se puede empaquetar en apk y ejecutar la prueba en el dispositivo Android.Tenga en cuenta que el grupo de gafas en la jerarquía debe deshabilitarse.

11.3.4 Haga clic en el botón para activar el evento de cambio de color del modelo

Cuando se usa un gráfico de script para agregar funciones lógicas a GameObject, es mejor implementar una función con un gráfico, para que el gráfico no se desordene.

1. En el panel Jerarquía, seleccione el objeto Visual Scripts y haga clic en Agregar componente en su panel Inspector para agregarle un componente de "Máquina de scripts". Luego, haga clic en Nuevo, nombre el script visual "Cambiador de materiales", y complete "Cambiador de materiales" en su columna Título, y complete "Cambia el material asignado a todas las gafas cuando se seleccionan los botones de material". indica que el el script visual se utiliza para hacer clic en el botón para cambiar el material del modelo de gafas.
   

2. De manera similar, en esta función, no necesitamos usar el nodo On Start y el nodo On Update, así que selecciónelos y presione la tecla Supr para eliminarlos. En primer lugar, cree un nuevo nodo Al hacer clic en el botón y establezca una variable de objeto para él en la pizarra para obtener el botón de cambio de material.
   
   

3. Cree una nueva carpeta en la carpeta _InteractiveFaceFilter en Activos y asígnele el nombre "Materiales". Cree tres materiales de color correspondientes a los colores de los botones y asígneles el nombre "Material1", "Material2" y "Material3".
   

4. En pizarra, cree tres variables de tipo Objeto para hacer referencia a tres materiales, su tipo es Material, y asígneles el nombre "Material1", "Material2" y "Material3".
   

5. Para cambiar el color del modelo de gafas, debe obtener el modelo de gafas y luego modificar su material. Por lo tanto, debe utilizar el nodo Buscar con etiqueta para obtener el modelo de gafas correspondiente con una etiqueta específica.
   

6. Use el renderizador de malla: nodo Establecer material para cambiar el material del modelo de gafas.
   

El nodo Establecer material tiene dos entradas:

• Destino: una referencia al GameObject que está cambiando.
• Valor: El material a aplicar.
  

Entre ellos, Target utiliza el modelo de gafas obtenido del nodo Find With Tag, y Value utiliza las variables del material correspondiente:

7. Duplique dos nodos Buscar con etiqueta y Nodos Establecer material, y modifique las etiquetas en ellos a las etiquetas de los otros dos pares de anteojos. Conéctese como se muestra en la figura a continuación, de modo que el primer material se pueda aplicar a tres pares de anteojos al mismo tiempo:
   
   Haga clic en Reproducir para probar, y verá que el primer material se puede asignar a tres pares de anteojos:
   

De la misma manera, las otras dos funciones de asignación de materiales de color se pueden agregar al gráfico de script. Sin embargo, aquí se usa una secuencia de nodos repetida, por lo que la siguiente sección usa un evento personalizado con parámetros para agregar aún más las funciones de los otros dos materiales.

11.3.5 Crear un evento personalizado y llamarlo con parámetros

1. Primero, debe separar todos los nodos "Buscar con etiqueta" y los nodos "Establecer material" en eventos personalizados, de modo que puedan llamarse mediante eventos de llamada cuando se presiona cada botón de modificación de material.
   

2. Los argumentos se pueden pasar a eventos o funciones para cambiar el resultado del evento o la salida de la función. Dado que necesitamos aplicar tres materiales diferentes al modelo de anteojos, depende de qué botón se hizo clic. Agregue una salida de datos para el nodo Evento personalizado, llamado parámetro, para pasar datos diferentes a esos nodos Establecer material.
   

3. Llamar al evento ChangeMaterial definido requiere el uso del nodo Trigger Custom Event, que también requiere un parámetro.
   
   En este momento, haga clic en Reproducir para probar y también asigne el primer material a los tres pares de anteojos.

4. Duplique el nodo en el paso 3 dos veces y modifique los botones y materiales en los dos nodos Obtener variable a los otros dos botones y materiales respectivamente.
   

   Presione el botón Reproducir para probar en el editor, todos los botones funcionan.
   

Luego, puede deshabilitar el objeto GlassesGroup en la Jerarquía y empaquetarlo en un dispositivo Android para probarlo. Se puede observar que las gafas pueden seguir el movimiento de la cara y moverse.

11.3.6 Cargar la elección del usuario

En la prueba del apartado anterior se puede comprobar que una vez que la cabeza del usuario sale de la pantalla y luego vuelve a ver, las gafas anteriores no vuelven a aparecer en el rostro. Esto se debe a que no guardamos la elección del usuario. Después de que la cara del usuario abandone la pantalla, AR Face Manager eliminará el componente GlassesGroup; y cuando la cara del usuario vuelva a la pantalla, AR Face Manager volverá a crear una instancia prefabricada de GlassesGroup, que solo se configuran los ajustes predeterminados, y el material seleccionado por el usuario anterior no se aplica al modelo de gafas.

1. Primero, debe asegurarse de que el objeto GlassesGroup en la Jerarquía esté habilitado, luego edite el script de visualización de MeshChanger, cree una variable de tipo Cadena (Objeto) llamada "currentGlassesTag" en la pizarra para almacenar la etiqueta de gafas actualmente seleccionada por el usuario, y mostrarlo en el gráfico Encuentre el nodo Establecer variable para la variable "currentGlassesTag" buscando "Establecer currentGlassesTag".
   
   

2. Dado que el valor de currentGlassesTag debe cambiar según el botón seleccionado por el usuario, debemos crear un evento personalizado llamado "SaveTag" para que pueda ser llamado por los tres botones y tenga un parámetro para generar la etiqueta obtenida. Agregue otro nodo para obtener la etiqueta del objeto, que se utiliza para obtener la etiqueta del modelo actual.
   

3. Use el nodo Trigger Custom Even para llamar al evento SaveTag de la etiqueta, cambie el número de parámetros a 1 y realice la siguiente conexión:
   

4. En el paso anterior, obtuvimos una referencia a qué par de anteojos ha seleccionado el usuario actual. Por lo tanto, en este paso aplicaremos las gafas seleccionadas por el usuario a GroupGlasses cuando se cree una instancia del nuevo prefabricado de GroupGlasses.
   Aquí, cree otro gráfico llamado "FilterUpdater" en la máquina de secuencias de comandos, complete "Filter Updater" en su columna Título y complete "Recarga el último par de anteojos usados ​​y el material seleccionado después de que la cara de un usuario se pierda y sea redescubierta por AR Foundation", lo que significa que las gafas y los materiales seleccionados previamente se recargan después de que la cara del usuario se aleje de la cámara.
   

5. Primero elimine el nodo On Start y mantenga el nodo On Update, porque necesitamos detectar si la cara del usuario está dentro del rango de detección de la cámara en tiempo real. El nodo On Update se ejecutará continuamente mientras se ejecuta la aplicación. La función del gráfico FilterUpdater es obtener el modelo de gafas actualmente seleccionado por el usuario a través de la variable currentGlassesTag y habilitar su Mesh Renderer.
   

6. Puede probar la funcionalidad de la secuencia de comandos anterior en el editor de esta manera:

   • Haga clic en el botón Reproducir para ejecutar el programa y encontrará que el nodo Buscar con etiqueta en el gráfico de FilterUpdater se vuelve rojo porque la aplicación está buscando un objeto con una etiqueta específica en tiempo real, pero la etiqueta aún está vacía.
   • Por lo tanto, en la ventana del juego, seleccione un botón de gafas arbitrariamente, de modo que la variable currentGlassesTag tenga un valor.
   • A continuación, en la ventana Jerarquía, seleccione el grupo prefabricado de gafas y elimínelo.
   • Finalmente, en la ventana de Proyecto, vuelva a arrastrar el prefabricado de GlassesGroup a la ventana de Jerarquía en Activos → _InteractiveFaceFilter → Prefabs, y encontrará que el modelo de anteojos seleccionado previamente aparece nuevamente.

7. De la misma manera, elija editar el gráfico MaterialChanger, cree una variable de tipo de Material (Objeto) llamada "material actual" en la pizarra para almacenar el material de gafas actualmente seleccionado por el usuario, y busque "Material actual" buscando "Establecer material actual" en el nodo Establecer variable de la variable del gráfico.
   
   

8. Dado que el Evento personalizado de ChangeMaterial se usa para transferir el material seleccionado por el usuario, se puede obtener directamente usando el nodo Establecer variable:
   

9. Finalmente, volviendo al diagrama de FilterUpdater, use el nodo Mesh Renderer Set Material para actualizar en tiempo real para asignar el material seleccionado por el usuario al modelo de gafas:
   

10. Si hace clic en Reproducir para probar en este momento, encontrará que cuando se selecciona un par de anteojos, falta el material de los anteojos. Esto se debe a que el usuario no seleccionó el material de los anteojos al principio, lo que resultó en el el valor de la variable currentMaterial está vacío. Por lo tanto, se debe establecer un valor inicial para la variable currentMaterial.
    

11. Busque la variable de material actual en la pizarra y establezca su valor en Lambert1, que es el material gris predeterminado.
    

12. Después de hacer clic en Reproducir prueba nuevamente, encontrará que todo se muestra normalmente. A continuación, puede deshabilitar el prefabricado de GlassesGroup en la Jerarquía y empaquetarlo en un dispositivo Android para probarlo.