Integración de Cámara y Botones en Aplicación de Selfies

Clase 21 de 31Curso de Desarrollo de Aplicaciones con Huawei

Contenido del curso

Introducción a HMS Core

Construyendo nuestra cámara de selfies con HMS ML Kit

Resumen

Construir una aplicación de selfies funcional requiere conectar múltiples piezas: desde los drawables del diseño hasta el motor de lente que activa la cámara frontal. Aquí se integran todos los objetos creados previamente para lograr la previsualización de la cámara dentro de la app, configurando el análisis facial y preparando el terreno para detectar emociones y posiciones del rostro.

¿Cómo se configuran los botones y el diseño del layout?

El primer paso consiste en agregar recursos gráficos (drawables) al proyecto y utilizarlos como fondo de los botones. Se crean dos botones principales dentro del layout XML:

  • Facing switch: controla si la cámara apunta hacia adelante o hacia atrás. Se le asigna un background con el drawable from_back_switch, se centra horizontalmente y se ancla al fondo del layout con un margen inferior de treinta DP [01:00].
  • Restart: se encarga de retomar la foto. Tiene un tamaño de treinta y cinco DP por treinta y cinco DP, se alinea a la derecha y al fondo del parent, con un margen derecho de veinte DP y visibilidad configurada como visible [01:35].

Ambos botones quedan alojados correctamente en el RelativeLayout, listos para interactuar con la lógica de la actividad.

¿Qué variables se necesitan en la actividad para el motor de lente?

Dentro de la actividad LiveFaceCamera, se declaran varias variables fundamentales que orquestan el funcionamiento de la cámara y el análisis facial:

  • Analyzer: se inicializa en nulo y más adelante se utilizará para analizar rostros [02:20].
  • Lens Engine: el motor principal de tipo LensEngine, también inicializado en nulo [02:30].
  • Preview: variable de tipo LensEnginePreview que representa la previsualización de la cámara [02:40].
  • Overlay: la capa gráfica (face overlay) donde se dibujarán los resultados del análisis [02:50].
  • Lens type: define el tipo de lente inicial, configurado como cámara frontal por defecto [03:00].
  • Restart button: referencia al botón de reinicio del layout [03:10].

También se gestiona el estado de la actividad para que funcione tanto en portrait como en landscape. Si el estado guardado no es nulo, se recupera el valor de lens_type mediante una key almacenada como entero [03:20].

¿Cómo funciona la creación del motor de lente con FaceAnalyzerSetting?

La función createLensEngine es el corazón de la configuración. Utiliza el objeto FaceAnalyzerSetting, una herramienta de machine learning que define qué características faciales va a detectar la cámara [04:00].

Las configuraciones clave son:

  • Feature type: indica qué tipo de características se analizarán, como puntos clave del rostro (key points) [04:10].
  • Set main face proportion: recibe un valor float (en este caso 0.1F) que establece la proporción mínima del rostro frente a la cámara. Si el usuario está demasiado cerca o demasiado lejos, el lente evalúa si puede realizar el análisis correctamente [05:10].
  • Set tracing allowed: al configurarse en true, permite que el lente siga el movimiento del rostro sin perder el análisis, incluso cuando la persona se desplaza frente a la cámara [05:35].

Una vez definidos los settings, se crea el analyzer con FaceAnalyzerFactory y se obtiene la instancia pasándole la configuración. Después, se construye el LensEngine con el contexto de la aplicación, el analyzer y el tipo de lente frontal. Se aplica una resolución de 640x480, una tasa de 25 frames por segundo y se activa el enfoque automático (automatic focus) [04:50].

¿Cómo se conecta la actividad de cámara con el flujo principal?

En el AndroidManifest, se registra la actividad LiveFaceCamera. Luego, en el MainActivity, se configura un click listener en el botón correspondiente que crea un intent para abrir la actividad de cámara [06:10].

Al ejecutar la aplicación, el layout se muestra correctamente con ambos botones visibles. El siguiente paso pendiente es inicializar el lente para que la previsualización del rostro aparezca en pantalla [06:50].

Si ya lograste ver los botones en tu dispositivo, comparte cómo fue tu experiencia configurando el LensEngine y qué ajustes de proporción te funcionaron mejor.