Rendu vidéo personnalisé (Android)

Vue d'ensemble

Ce tutoriel vous guide à travers les étapes nécessaires pour apporter des modifications mineures au moteur de rendu vidéo utilisé par un Subscriber objet. Vous pouvez également utiliser ces mêmes techniques pour modifier le moteur de rendu vidéo utilisé par un Publisher (bien que cet exemple n'illustre qu'un moteur de rendu personnalisé pour un abonné).

Configuration de votre projet

Le code de cette section est disponible dans le projet Basic-Video-Renderer-Java du projet opentok-android-sdk-samples repo. Si vous ne l'avez pas encore fait, vous devrez cloner le repo dans un répertoire local. Sur la ligne de commande, exécutez :

git clone git@github.com:opentok/opentok-android-sdk-samples.git

Ouvrir le Basic-Video-Renderer-Java dans Android Studio.

Découverte du code

Dans cet exemple, l'application utilise un moteur de rendu vidéo personnalisé pour afficher une version en couleurs inversées de la vidéo.

InvertedColorsVideoRenderer est une classe personnalisée qui étend la classe BaseVideoRenderer classe (définie dans le SDK Android d'OpenTok). La BaseVideoRenderer La classe vous permet de définir un moteur de rendu vidéo personnalisé destiné à être utilisé par un éditeur ou un abonné OpenTok :

subscriber = new Subscriber.Builder(this, stream)
    .renderer(new InvertedColorsVideoRenderer(this))
    .build();

publisher = new Publisher.Builder(MainActivity.this)
    .renderer(new InvertedColorsVideoRenderer(MainActivity.this))
    .build();

Les InvertedColorsVideoRenderer() définit un renderer à une propriété GLSurfaceView objet. L'application utilise cet objet pour afficher la vidéo à l'aide d'OpenGL ES 2.0. Le moteur de rendu de cet objet GLSurfaceView est défini comme étant un MyRenderer objet. MyRenderer est une classe personnalisée qui étend GLSurfaceView.Rendereret il est utilisé pour rendre la vidéo à l'écran. GLSurfaceView objet :

public InvertedColorsVideoRenderer(Context context) {
    view = new GLSurfaceView(context);
    view.setEGLContextClientVersion(2);

    renderer = new MyRenderer();
    view.setRenderer(renderer);

    view.setRenderMode(GLSurfaceView.RENDERMODE_WHEN_DIRTY);
}

Les onFrame() du moteur de rendu vidéo est héritée de la méthode BaseVideoRenderer classe. Les BaseVideoRenderer.onFrame() est appelée lorsque l'éditeur (ou l'abonné) rend une image vidéo au moteur de rendu vidéo. La méthode InvertedColorsVideoRenderer de cette méthode, elle prend le tampon d'image de la trame (YUV de la représentation du cadre), la transmet à la fonction displayFrame de la méthode MyRenderer et appelle l'objet requestRender() de la méthode GLSurfaceView objet :

@Override
public void onFrame(Frame frame) {
    renderer.displayFrame(frame);
    view.requestRender();
}

Pour effectuer le rendu des images vidéo, la classe de rendu utilise des shaders OpenGL. Dans cet exemple, le shader produit l'effet de couleur inversée, plus précisément par cette ligne qui se trouve à l'intérieur de la section fragmentShaderCode chaîne de caractères :

"y=1.0-1.1643*(y-0.0625);\n"

Félicitations ! Vous venez de terminer le tutoriel sur le rendu vidéo personnalisé pour Android.
Vous pouvez continuer à tester et à modifier le code que vous avez développé ici, ou consulter le Prochaines étapes ci-dessous.

Prochaines étapes

Une fois que vous aurez terminé cette étape, poursuivez le développement et l'amélioration de votre application OpenTok à l'aide des ressources utiles suivantes :