Cómo definir diseños con un VideoCompositorSettings personalizado

Es posible que los usuarios quieran editar varios recursos multimedia juntos de modo que aparezca más de un elemento multimedia al mismo tiempo en el video final. Esto incluye organizar elementos en diseños como imagen en imagen, uno al lado del otro o una cuadrícula. Estos son algunos ejemplos de este tipo de proyectos:

Puedes explorar una implementación de estos diseños en la app de demostración de Composition.

Implementa un VideoCompositorSettings

La interfaz VideoCompositorSettings contiene 2 métodos:

• getOutputSize(List<Size> inputSizes), que puedes usar para especificar el tamaño de cada entrada EditedMediaItemSequence
• getOverlaySettings(int inputId, long presentationTimeUs), donde puedes especificar cómo debe aparecer cada secuencia en el fotograma

Configura la presentación de una secuencia con un OverlaySettings

Tu implementación de getOverlaySettings() debería mostrar una instancia de la OverlaySettings interfaz para cada secuencia de tu proyecto. El parámetro inputId identifica a qué secuencia se aplicarán los parámetros de configuración. Para compilar una instancia, puedes usar la StaticOverlaySettings clase incluida en Media3. Consulta la página de referencia de StaticOverlaySettings.Builder para obtener una lista completa de las opciones de configuración, que incluye modificaciones visuales como la transparencia alfa y la luminancia HDR, modificaciones posicionales como el punto de anclaje y la ubicación dentro del fotograma, y transformaciones como la rotación y la escala.

override fun getOverlaySettings(inputId: Int, presentationTimeUs: Long): OverlaySettings {
  return when (inputId) {
    // Position the first sequence in the top-left
    0 -> {
      StaticOverlaySettings.Builder()
        // Scale the video down to 1/4th the size of the frame
        .setScale(0.5f, 0.5f)
        // Anchor the sequence in the middle of frame
        .setOverlayFrameAnchor(0f, 0f)
        // Position the video in the top-left section of the frame
        .setBackgroundFrameAnchor(-0.5f, 0.5f)
        .build()
    }
    // Add more cases for remaining input sequences
    else -> StaticOverlaySettings.Builder().build()
  }
}
VideoCompositorSettings.kt

Con el parámetro presentationTimeUs del método getOverlaySettings(), puedes modificar estos parámetros de configuración según la posición del video, como se muestra en el ejemplo de imagen en imagen en movimiento que se mostró anteriormente en esta página.

override fun getOverlaySettings(inputId: Int, presentationTimeUs: Long): OverlaySettings {
  return if (inputId == 0) {
    // Use the first sequence as the overlay
    val cycleRadians = 2 * PI * (presentationTimeUs.toDouble() / cycleTimeUs)
    StaticOverlaySettings.Builder()
      // Scale the overlay down
      .setScale(0.35f, 0.35f)
      // Anchor the overlay in the top-middle of the frame
      .setOverlayFrameAnchor(0f, 1f)
      // Move the overlay over time
      .setBackgroundFrameAnchor(sin(cycleRadians).toFloat() * 0.5f, -0.2f)
      // Rotate the overlay over time
      .setRotationDegrees(cos(cycleRadians).toFloat() * -10f)
      .build()
  } else {
    // Present the second sequence in the background as normal
    StaticOverlaySettings.Builder().build()
  }
}
VideoCompositorSettings.kt

Comentarios

Si tienes comentarios o solicitudes de funciones para casos de uso de composición de video, informa un problema en el repositorio de GitHub de Media3.