以位图作为叠加流视频

时间:2018-07-05 09:14:49

标签: android ios wowza

我是wowza的新手,正在从事一个项目,以实时流式传输从Android设备捕获的视频。我需要将一幅图像(动态图像)附加到视频流,以便观看该流的用户可以观看它。我尝试过的代码如下(如来自wowza的示例源代码):

        // Read in a PNG file from the app resources as a bitmap
        Bitmap overlayBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.overlay_logo);

        // Initialize a bitmap renderer with the bitmap
        mWZBitmap = new WZBitmap(overlayBitmap);

        // Place the bitmap at top left of the display
        mWZBitmap.setPosition(WZBitmap.LEFT, WZBitmap.TOP);

        // Scale the bitmap initially to 75% of the display surface width
        mWZBitmap.setScale(0.75f, WZBitmap.SURFACE_WIDTH);

        // Register the bitmap renderer with the GoCoder camera preview view as a frame listener
        mWZCameraView.registerFrameRenderer(mWZBitmap);

这很好,但是我不想在广播端显示图像,该图像应该仅在接收端可见。反正有做得到吗?

1 个答案:

答案 0 :(得分:1)

通过注册FrameRenderer并在onWZVideoFrameRendererDraw中设置位图,我设法做到了。

代码段如下(科特琳)所示:

private fun attachImageToBroadcast(scoreValue: ScoreUpdate) {
    bitmap = getBitMap(scoreValue)
    // Initialize a bitmap renderer with the bitmap
    mWZBitmap = WZBitmap(bitmap)
    // Position the bitmap in the display
    mWZBitmap!!.setPosition(WZBitmap.LEFT, WZBitmap.TOP)
    // Scale the bitmap initially
    mWZBitmap!!.setScale(0.37f, WZBitmap.FRAME_WIDTH)
    mWZBitmap!!.isVisible = false // as i dont want to show it initially
    mWZCameraView!!.registerFrameRenderer(mWZBitmap)
    mWZCameraView!!.registerFrameRenderer(VideoFrameRenderer())
}

private inner class VideoFrameRenderer : WZRenderAPI.VideoFrameRenderer {
    override fun onWZVideoFrameRendererRelease(p0: WZGLES.EglEnv?) {
    }

    override fun onWZVideoFrameRendererDraw(p0: WZGLES.EglEnv?, framSize: WZSize?, p2: Int) {
            mWZBitmap!!.setBitmap(bitmap) // note that the bitmap value gets changed once I get the new values
                                          //I have implemented some flags and conditions to check whether a new value has been obtained and only if these values are satisfied, the setBitmap is called. Otherwise, as it is called continuously, flickering can occur in the screen
            }


    override fun isWZVideoFrameRendererActive(): Boolean {
        return true
    }

    override fun onWZVideoFrameRendererInit(p0: WZGLES.EglEnv?) {
    }

}

在iOS中,我们可以实现WZVideoSink协议来实现此目的。 首先,我们需要用最新的分数更新scoreView,然后将视图转换为图像。 然后,我们可以使用WZVideoSink协议方法将此图像嵌入到捕获的帧中。 下面提供了示例代码。

 // MARK: - WZVideoSink Protocol
func videoFrameWasCaptured(_ imageBuffer: CVImageBuffer, framePresentationTime: CMTime, frameDuration: CMTime) {

        if self.goCoder != nil && self.goCoder!.isStreaming {
           let frameImage = CIImage(cvImageBuffer: imageBuffer)
            var addCIImage: CIImage = CIImage()

            if let scoreImage = self.getViewAsImage() {
 // scoreImage is the image you want to embed.
                addCIImage = CIImage(cgImage: scoreImage.cgImage!)
            }

            let filter = CIFilter(name: "CISourceOverCompositing")
            filter?.setDefaults()
            filter?.setValue(addCIImage, forKey: kCIInputImageKey)
            filter?.setValue(frameImage, forKey: kCIInputBackgroundImageKey)

            if let outputImage: CIImage = filter?.value(forKey: kCIOutputImageKey) as? CIImage {
                let context = CIContext(options: nil)
                context.render(outputImage, to: imageBuffer)
            } else {
                let context = CIContext(options: nil)
                context.render(frameImage, to: imageBuffer)
            }
        }
}

func getViewAsImage() -> UIImage {
// convert scoreView to image
    UIGraphicsBeginImageContextWithOptions(self.scoreView.bounds.size, false, 0.0)
    self.scoreView.layer.render(in: UIGraphicsGetCurrentContext()!)

    let scoreImage: UIImage = UIGraphicsGetImageFromCurrentImageContext()!
    UIGraphicsEndImageContext()
    return scoreImage
}