Tutorial sobre cómo compartir pantalla (iOS)

Visión general

En este tutorial se explica cómo utilizar el SDK de OpenTok para iOS para publicar un vídeo de pantalla compartida, utilizando la pantalla del dispositivo como fuente del vídeo de la transmisión.

Configuración de tu proyecto

El código de esta sección se encuentra en el Compartir pantalla carpeta de la opentok-ios-sdk-samples proyecto en GitHub. Si aún no lo has hecho, tendrás que clonar el repositorio en un directorio local; esto se puede hacer mediante la línea de comandos:

git clone https://github.com/opentok/opentok-ios-sdk-samples.git

La aplicación «Screen-Sharing» te muestra cómo capturar la pantalla (una UIView) utilizando un capturador de vídeo personalizado. Abre el proyecto en XCode para seguir los pasos.

Explorar el código

El capturador de vídeo personalizado, TBScreenCapture, se inicializa primero con un objeto de enlace de pantalla. Este objeto llama a la función captureView método a 30 fotogramas por segundo.

. En createPixelBuffer y createCGContextFromPixelBuffer Los métodos auxiliares preparan el terreno para almacenar la instantánea de la pantalla principal. A continuación, este búfer se envía al videoCaptureConsumer en el captureView método.


- (instancetype)initWithView:(UIView *)view
{
    self = [super init];
    if (self) {
        _view = view;
        _queue = dispatch_queue_create("SCREEN_CAPTURE", NULL);
        _screenScale = [[UIScreen mainScreen] scale];
        _displayLink = [CADisplayLink displayLinkWithTarget:self selector:@selector(captureView)];
        _displayLink.preferredFramesPerSecond = 30.0;
        _capturingSemaphore = dispatch_semaphore_create(1);
        [self createPixelBuffer];
        [self createCGContextFromPixelBuffer];
    }
    return self;
}


-(void)captureView
{
    if (!(_capturing && self.videoCaptureConsumer)) {
        return;
    }

    // Wait until consumeImageBuffer is done.
    if (dispatch_semaphore_wait(_capturingSemaphore, DISPATCH_TIME_NOW) != 0) {
            return;
    }
    
    dispatch_async(dispatch_get_main_queue(), ^{
        [self.view.layer renderInContext:self->_bitmapContext]; 
        // Don't block the UI thread
        dispatch_async(self->_queue, ^{
            CMTime time = [self getTimeStamp];
            [self.videoCaptureConsumer consumeImageBuffer:self->_pixelBuffer
                orientation:OTVideoOrientationUp
                timestamp:time
                metadata:nil];
            // Signal for more frames
            dispatch_semaphore_signal(self->_capturingSemaphore);
        });
    });
}

La captura de pantalla se realiza mediante [self.view.layer renderInContext:self->_bitmapContext].

La aplicación de ejemplo utiliza los métodos de protocolo de OTVideoCapture para gestionar el objeto de enlace de visualización junto con un _capturing bandera. La captureSettings El método establece el «videoFormat» en OTPixelFormatARGB.

- (int32_t)captureSettings:(OTVideoFormat*)videoFormat
    {
        videoFormat.pixelFormat = OTPixelFormatARGB;
        return 0;
    }

La clase ViewController crea una sesión, instancia los suscriptores y configura el editor.

El «publisher» es el principal motor de la aplicación, y sus propiedades y métodos — videoType, audioFallbackEnabled, videoContentHinty setVideoCapture — están ambientadas en el doPublish método:

- (void)doPublish
{
    ...

    [_publisher setVideoType:OTPublisherKitVideoTypeScreen];
    
    // This disables the audio fallback feature when using routed sessions.
    _publisher.audioFallbackEnabled = NO;

    // Finally, wire up the video source.
    TBScreenCapture* videoCapture =
    [[TBScreenCapture alloc] initWithView:self.view];
    [_publisher setVideoCapture:videoCapture];

    _publisher.videoCapture.videoContentHint = OTVideoContentHintText;

    ...
}

Por último, la aplicación muestra un texto con un cronómetro en marcha. La aplicación captura esta imagen y la comparte con los suscriptores:


dispatch_source_set_event_handler(_timer, ^{
    double timestamp = [[NSDate date] timeIntervalSince1970];
    int64_t timeInMilisInt64 = (int64_t)(timestamp*1000);
    
    NSString *mills = [NSString stringWithFormat:@"%lld", timeInMilisInt64];
    
    dispatch_sync(dispatch_get_main_queue(), ^{
        [self.timeDisplay setText:mills];
    });
});

¡Enhorabuena! Has completado el tutorial sobre cómo compartir pantalla en iOS.
Puedes seguir probando y modificando el código que has creado aquí, o echar un vistazo a la Próximos pasos a continuación. Para obtener más información sobre cómo compartir pantalla con OpenTok, consulta el Guía para desarrolladores de OpenTok sobre el uso compartido de pantalla en iOS.

Próximos pasos

Cuando hayas terminado aquí, sigue desarrollando y mejorando tu aplicación de OpenTok con estos útiles recursos: