Swift

カスタムレンダービューの作成

という名前の新しいSwiftファイルを作成する。 CustomRenderView.swift:

import UIKit
import OpenTok

class CustomRenderView: UIView {
    private var renderQueue = DispatchQueue.global(qos: .userInitiated)
    private var image: CGImage? = nil
    
    func renderVideoFrame(_ frame: OTVideoFrame) {
        let frameToRender = frame
        
        renderQueue.sync {
            // Release previous image if any exists
            if image != nil {
                image = nil
            }
            guard let format = frame.format else { return }
            let width = Int(format.imageWidth)
            let height = Int(format.imageHeight)
            let bufferSize = width * height * 3
            
            guard let rawYPlane = frameToRender.planes?.pointer(at: 0) else { return }
            let yplane = rawYPlane.bindMemory(to: UInt8.self, capacity: width * height)
            let buffer = UnsafeMutablePointer<UInt8>.allocate(capacity: bufferSize)
            
            // Process frame data to create grayscale image
            for i in 0..<height {
                for j in 0..<width {
                    let pixelIndex = (i * width * 3) + (j * 3)
                    let yValue = yplane[(i * width) + j]
                    buffer[pixelIndex] = yValue
                    buffer[pixelIndex + 1] = yValue
                    buffer[pixelIndex + 2] = yValue
                }
            }
            
            // Release buffer when CGDataProvider is done
            let releaseCallback: CGDataProviderReleaseDataCallback = { _, data, _ in
                data.deallocate()
            }
            
            guard let provider = CGDataProvider(dataInfo: nil, data: buffer, size: bufferSize, releaseData: releaseCallback) else {
                buffer.deallocate()
                return
            }
            
            // Create CGImage
            image = CGImage(
                width: width,
                height: height,
                bitsPerComponent: 8,
                bitsPerPixel: 24,
                bytesPerRow: 3 * width,
                space: CGColorSpaceCreateDeviceRGB(),
                bitmapInfo: CGBitmapInfo(rawValue: CGImageAlphaInfo.none.rawValue),
                provider: provider,
                decode: nil,
                shouldInterpolate: false,
                intent: .defaultIntent
            )
            
            DispatchQueue.main.async { [weak self] in
                self?.setNeedsDisplay()
            }
        }
    }
        
    // MARK: - Drawing
    override func draw(_ rect: CGRect) {
        guard let context = UIGraphicsGetCurrentContext() else { return }
        var imgCopy: CGImage?
        
        renderQueue.sync {
            if let currentImage = image {
                imgCopy = currentImage.copy()
            }
        }
        
        if let img = imgCopy {
            context.draw(img, in: self.bounds)
        }
    }
}

重要なポイント

  • バックグラウンド・キュー (renderQueue) をフレーム処理に使用し、メインスレッドのブロックを回避する。
  • 各ビデオフレームを処理してグレースケール画像を作成する。
  • を作成する。 CGImage 処理されたフレームから、メインスレッドでの再描画をトリガーする。

基本的なビデオレンダリング

Vonage Video iOS SDK を使用してビデオストリームの白黒バージョンを表示するために Swift でカスタムビデオレンダラを使用する方法を学びます。

以下の言語で利用可能:
Kotlin Swift
手順
1
はじめに
2
はじめに
3
新規プロジェクトの作成
4
Vonage Video SDKの追加
5
認証の設定
6
アーキテクチャーを理解する
7
カスタムレンダービューの作成
8
カスタムビデオ・レンダラの作成
9
Vonage Video Managerとの統合
10
SwiftUIラッパーへのUIViewの作成
11
SwiftUIでの表示
12
仕組み
13
結論