Androide: Administrar los controles del jugador

En este tema, aprenderá a trabajar con los controles de Brightcove Player al utilizar Brightcove Player SDK para Android.

Resumen

Native Player SDK proporciona controles de reproductor similares a Brightcove Web Player para brindar una experiencia de usuario consistente en todas las plataformas. Puede utilizar los controles del reproductor de Brightcove listos para usar o personalizarlos con sus propios colores, estilos y botones.

Controles de reproductor predeterminados

Cuando crea una aplicación con Brightcove Player SDK para Android, debe comenzar con el BrightcovePlayer o el BrightcovePlayerFragment clase.

Amplíe BrightcovePlayer

En el código de su aplicación, extienda el MainActivity clase de una de las clases anteriores. Por ejemplo:

public class MainActivity extends BrightcovePlayer {
}

Ahora, está listo para crear una instancia de la vista de video en su código.

Crear una instancia de BrightcoveVideoView

En el MainActivity.java archivo, y en el onCreate() método, agregue el siguiente código:

@Override
protected void onCreate(Bundle savedInstanceState) {
    setContentView(R.layout.activity_main);
    brightcoveVideoView = (BrightcoveExoPlayerVideoView) findViewById(R.id.brightcove_video_view);
    super.onCreate(savedInstanceState);
}

Los controles de tu reproductor deberían verse así:

Controles básicos del reproductor
Controles básicos del reproductor

Personaliza los controles del reproductor

Los controles del reproductor de Brightcove brindan soporte para subtítulos, rebobinado de video y modo de pantalla completa. También puede seleccionar el estilo de animación para mostrar y ocultar los controles.

Cambiar colores de control

Fácilmente personalizable, puede cambiar los colores de control del reproductor de Brightcove para que coincidan con el material de marca de su empresa.

  1. Utilice el mismo código en su MainActivity.java archivo como arriba.
  2. En tus src / main / res / values / colors.xml o res / valores / strings.xml archivo, incluya el siguiente código:
    <?xml version="1.0" encoding="utf-8"?>
    <resources>
    
        <!-- Define the new colors. -->
        <color name="bc_orange">#F3951D</color>
        <color name="magenta_semi_trans">#4DFF00FF</color>
    
        <!-- Change the progress colors to magenta/black/orange, all transparent. -->
        <color name="bmc_seekbar_played">@color/magenta_semi_trans</color>
        <color name="bmc_seekbar_buffered">@color/black_semi_trans</color>
        <color name="bmc_seekbar_track">@color/bc_orange</color>
    
    </resources>

    Los controles de tu reproductor deberían verse así:

    Cambiar colores de control
    Cambiar colores de control

Cambiar iconos y botones en los controles del reproductor

Para personalizar aún más los controles del reproductor de Brightcove, puede intercambiar iconos y agregar sus propios botones para que coincidan con los estilos de su empresa.

  1. Utilice el mismo código en su MainActivity.java archivo como arriba.
  2. En tus src / main / res / values / strings.xml archivo, incluya el siguiente código:
    <?xml version="1.0" encoding="utf-8"?>
    <resources>
        <!-- Use the Font Awesome fa-stepbackward icon for the rewind
             button face. -->
        <string name="brightcove_controls_rewind">&#xf048;</string>
    </resources>

    Los controles de tu reproductor deberían verse así:

    Agregar botón de retroceso
    Agregar botón de retroceso

Para obtener ejemplos de código completos, consulte el Controles del reproductor Brightcove para ejemplos de Android.

Mostrar / ocultar controles del reproductor

Hay tres formas de mostrar y ocultar los controles del reproductor durante la reproducción de video:

  1. El usuario puede tocar la pantalla del dispositivo para alternar los controles del reproductor entre mostrar y ocultar los controles.

  2. Puedes usar el BrightcoveMediaController clase. A continuación, se muestra un ejemplo de cómo mostrar los controles del reproductor para un rango de posición definido del cabezal de reproducción.

    brightcoveVideoView.getEventEmitter().on(EventType.PROGRESS, new EventListener() {
        @Override
        public void processEvent(Event event) {
            int playheadPosition = brightcoveVideoView.getCurrentPosition();
            if(playheadPosition > 24000 && playheadPosition < 29000) {
                BrightcoveMediaController controller = brightcoveVideoView.getBrightcoveMediaController();
                controller.show();
            }
        }
    });

  3. Puede utilizar eventos de la siguiente manera:

    import static com.brightcove.player.mediacontroller.ShowHideController.SHOW_MEDIA_CONTROLS;
    import static com.brightcove.player.mediacontroller.ShowHideController.HIDE_MEDIA_CONTROLS;
    ...
    eventEmitter.emit(HIDE_MEDIA_CONTROLS);
    eventEmitter.emit(SHOW_MEDIA_CONTROLS);

Deshabilitar los controles del reproductor

Mientras diseña el diseño y la funcionalidad de su aplicación, es posible que deba desactivar los controles del reproductor. Esto se puede hacer configurando el MediaController anular de la siguiente manera:

@
Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
   View rootView = inflater.inflate(R.layout.fragment_player, container, false);
   brightcoveVideoView = (BrightcoveExoPlayerVideoView) rootView.findViewById(R.id.brightcove_video_view);
   super.onCreateView(inflater, container, savedInstanceState); // Need to be called after brightcoveVideoView is set.
   brightcoveVideoView.setMediaController((MediaController) null); // Need to be called after onCreateView.
   return rootView;
}

Este ejemplo usa el BrightcovePlayerFragment.

Controlar manualmente el modo de pantalla completa

Por lo general, los usuarios controlarán la visualización en pantalla completa tocando el botón de pantalla completa en la barra de control. Puede haber ocasiones en las que desee controlar esta funcionalidad manualmente, en código.

Para configurar el modo de pantalla completa, use el siguiente código:

brightcoveVideoView.getEventEmitter().emit(EventType.ENTER_FULL_SCREEN);

Para salir del modo de pantalla completa, use el siguiente código:

brightcoveVideoView.getEventEmitter().emit(EventType.EXIT_FULL_SCREEN);

Para obtener una lista completa de los tipos de eventos, consulte la Player SDK para referencia de Android y navega hasta el Tipo de evento documento de clase.

Alternativamente, puede utilizar el fullScreen() y normalScreen() métodos. Puede encontrar estos métodos en el Player SDK para referencia de Android y navegando al BrightcovePlayer documento de clase.

Examinar los valores de propiedad del SDK

Para obtener una lista completa de valores, incluidas matrices, colores, dimensiones, identificadores, números enteros, cadenas y estilos, haga lo siguiente:

  1. Localizar el Android-jugador-nativo-público-xxxzip archivo y descomprímalo.
  2. En el sdk carpeta, abra la android-sdk-xxxaar expediente.

  3. Abre el res / valores / valores.xml expediente. Aquí encontrará una lista de valores a los que puede hacer referencia en sus aplicaciones.