canvas 处理视频 录制-新

已于 2022-05-16 15:04:30 修改
阅读量1k 收藏
点赞数
分类专栏： JavaScript 文章标签： 音视频 javascript 开发语言
于 2021-11-09 16:46:28 首次发布
原文链接：https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Manipulating_video_using_canvas
版权

参考:https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Manipulating_video_using_canvas

   var captureImage = function () {
                var canvas = document.createElement("canvas");
                canvas.width = video.videoWidth * scale;
                canvas.height = video.videoHeight * scale;
                canvas.getContext('2d')
                    .drawImage(video, 0, 0, canvas.width, canvas.height);
                var img = document.createElement("img");
                // img.src = canvas.toDataURL('image/png');  // base64
                canvas.toBlob(function (blob) {//blob将base64编码的src 以二进制的形式存进了 Blob对象
                    img.src = window.URL.createObjectURL(blob)
                    // $('img').attr('src',HTMLMediaElement.srcObject(blob))//这个方法是MDN说会替代上面的方法 但是我在浏览器中使用还不支持（什么鬼？？？）
                    // 图片ajax上传-》将blob二进制数据上传上去
                    console.log(blob)
                }, 'image/png');
                $output.prepend(img);
            };

index.js

var processor = {};

processor.doLoad = function doLoad() {
  this.video = document.getElementById("video");
  this.c1 = document.getElementById("c1");
  this.ctx1 = this.c1.getContext("2d");
  this.c2 = document.getElementById("c2");
  this.ctx2 = this.c2.getContext("2d");
  let self = this;
  this.video.addEventListener(
    "play",
    function () {
      self.width = self.video.videoWidth / 2;
      self.height = self.video.videoHeight / 2;
      self.timerCallback();
    },
    false
  );
};
processor.timerCallback = function timerCallback() {
  if (this.video.paused || this.video.ended) {
    return;
  }
  this.computeFrame();
  let self = this;
  setTimeout(function () {
    self.timerCallback();
  }, 0);
};

processor.computeFrame = function computeFrame() {
  this.ctx1.drawImage(this.video, 0, 0, this.width, this.height);
  let frame = this.ctx1.getImageData(0, 0, this.width, this.height);
  let l = frame.data.length / 4;

  for (let i = 0; i < l; i++) {
    let r = frame.data[i * 4 + 0];
    let g = frame.data[i * 4 + 1];
    let b = frame.data[i * 4 + 2];
    // rgba   255 255 0 黄色
    if (g > 100 && r > 100 && b < 43) {
      frame.data[i * 4 + 3] = 0;
    }
  }
  this.ctx2.putImageData(frame, 0, 0);
  return;
};


<!DOCTYPE html
    PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <style>
        body {
            background: black;
            color: #CCCCCC;
        }

        #c2,
        #c1 {
            background-image: url(foo.png);
            background-repeat: no-repeat;
        }

        div {
            float: left;
            border: 1px solid #444444;
            padding: 10px;
            margin: 10px;
            background: #3B3B3B;
        }
    </style>

</head>

<body><script id="__bs_script__">//<![CDATA[
    document.write("<script async src='/browser-sync/browser-sync-client.js?v=2.26.7'><\/script>".replace("HOST", location.hostname));
//]]></script>

    <div>
        <video id="video" src="video.ogv" controls="true" />
    </div>
    <div>
        <canvas id="c1" width="160" height="96"></canvas>
        <canvas id="c2" width="160" height="96"></canvas>
    </div>
    <script src="./index.js"></script>
    <script>
        processor.doLoad()
    </script>
</body>

</html>

视频素材下载 https://www.videvo.net/stock-video-footage/green-screen/
转载:https://blog.csdn.net/luofeng457/article/details/90186162

<!DOCTYPE html>
<html>
  <head>
    <style>
      body {
        background: black;
        color:#CCCCCC; 
      }
      #c2 {
        background-image: url(a.png);
        background-repeat: no-repeat;
      }
      div {
        float: left;
        border :1px solid #444444;
        padding:10px;
        margin: 10px;
        background:#3B3B3B;
      }
    </style>
  </head>

  <body>
    <div>
      <video id="video" src="chicken.mp4" controls="true"/>
    </div>
    <div>
      <canvas id="c1" width="480" height="270"></canvas>
      <canvas id="c2" width="480" height="270"></canvas>
    </div>
  <script type="text/javascript">
let processor = {
    timerCallback: function() {
      if (this.video.paused || this.video.ended) {
        return;
      }
      this.computeFrame();
      let self = this;
      setTimeout(function () {
          self.timerCallback();
        }, 0);
    },
  
    doLoad: function() {
      this.video = document.getElementById("video");
      this.c1 = document.getElementById("c1");
      this.ctx1 = this.c1.getContext("2d");
      this.c2 = document.getElementById("c2");
      this.ctx2 = this.c2.getContext("2d");
      let self = this;
      this.video.addEventListener("play", function() {
          self.width = self.video.videoWidth / 4;
          self.height = self.video.videoHeight / 4;
          self.timerCallback();
        }, false);
    },
  
    computeFrame: function() {
      this.ctx1.drawImage(this.video, 0, 0, this.width, this.height);
      let frame = this.ctx1.getImageData(0, 0, this.width, this.height);
          let l = frame.data.length / 4;
  
      for (let i = 0; i < l; i++) {
        let r = frame.data[i * 4 + 0];
        let g = frame.data[i * 4 + 1];
        let b = frame.data[i * 4 + 2];
        if (g > 100 && r < 50)
          frame.data[i * 4 + 3] = 0;
      }
      this.ctx2.putImageData(frame, 0, 0);
      return;
    }
  };

document.addEventListener("DOMContentLoaded", () => {
  processor.doLoad();
});

  </script>
  </body>
</html>

视频录制处理一


<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body><script id="__bs_script__">//<![CDATA[
    document.write("<script async src='/browser-sync/browser-sync-client.js?v=2.26.7'><\/script>".replace("HOST", location.hostname));
//]]></script>


    MediaRecorder.mimeType[只读]：返回实例化过程设置的媒体文件类型。笔者设备测试，如果未设置，默认返回：Chrome -> video/webm;codecs=vp8，Firefox -> video/webm；
    MediaRecorder.state[只读]：返回当前MediaRecorder实例的工作状态，可选值有：inactive、recording和paused；
    MediaRecorder.stream[只读]：返回当前媒体流，亦即实例化过程传入的媒体流对象
    MediaRecorder.ignoreMutedMedia：是否静音模式录制；
    MediaRecorder.start(timeslice)：开始录制。timeslice参数可选，表示以该持续时间切片媒体数据；
    MediaRecorder.pause()：暂停录制；
    MediaRecorder.resume()：继续录制；
    MediaRecorder.stop()：停止录制。
    <canvas width="600" height="600"></canvas>
    <canvas id="video" width="600" height="600"></canvas>
    <div id="videoContainer" style="display:none">
        <video controls="true" autoplay="true"></video>
    </div>


    <script>
        const canvas = document.querySelector('canvas');
        const ctx = canvas.getContext('2d');
        const { width, height } = canvas;

        ctx.fillStyle = 'red';

        function draw(rotation = 0) {
            ctx.clearRect(0, 0, 1000, 1000);
            ctx.save();
            ctx.translate(width / 2, height / 2);
            ctx.rotate(rotation);
            ctx.translate(-width / 2, -height / 2);
            ctx.beginPath();
            ctx.rect(200, 200, 200, 200);
            ctx.fill();
            ctx.restore();
            let videoCanvas = document.querySelector('#video')
            const content = videoCanvas.getContext('2d');
            content.clearRect(0, 0, videoCanvas.width, videoCanvas.height);

            // content.drawImage(canvas, 0, 0)  //整个画布


            let frame = ctx.getImageData(0, 0, canvas.width, canvas.height);
            const data = frame.data;
            for (var i = 0; i < data.length; i += 4) {
                data[i] = 255 - data[i];     // red
                data[i + 1] = 255 - data[i + 1]; // green
                data[i + 2] = 255 - data[i + 2]; // blue
            }

            content.putImageData(frame, 0, 0);


        }

        function update(t) {
            draw(t / 500);
            requestAnimationFrame(update);
        }

        const stream = canvas.captureStream();
        const recorder = new MediaRecorder(stream, { mimeType: 'video/webm' });

        const data = [];
        recorder.ondataavailable = function (event) {
            if (event.data && event.data.size) {
                data.push(event.data);
            }
        };
        recorder.onstop = () => {
            const url = URL.createObjectURL(new Blob(data, { type: 'video/webm' }));
            document.querySelector("#videoContainer").style.display = "block";
            document.querySelector("video").src = url;
        };

        recorder.start();
        update(0);

        setTimeout(() => {
            recorder.stop();
        }, 6000);


    </script>
</body>

</html>

视频录制处理二


<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        #c2,
        #c1 {
            background-image: url('./2.png');
            background-repeat: no-repeat;
            background-size: cover;
        }
    </style>
</head>

<body><script id="__bs_script__">//<![CDATA[
    document.write("<script async src='/browser-sync/browser-sync-client.js?v=2.26.7'><\/script>".replace("HOST", location.hostname));
//]]></script>


    MediaRecorder.mimeType[只读]：返回实例化过程设置的媒体文件类型。笔者设备测试，如果未设置，默认返回：Chrome -> video/webm;codecs=vp8，Firefox -> video/webm；
    MediaRecorder.state[只读]：返回当前MediaRecorder实例的工作状态，可选值有：inactive、recording和paused；
    MediaRecorder.stream[只读]：返回当前媒体流，亦即实例化过程传入的媒体流对象
    MediaRecorder.ignoreMutedMedia：是否静音模式录制；
    MediaRecorder.start(timeslice)：开始录制。timeslice参数可选，表示以该持续时间切片媒体数据；
    MediaRecorder.pause()：暂停录制；
    MediaRecorder.resume()：继续录制；
    MediaRecorder.stop()：停止录制。
    <canvas width="600" height="600"></canvas>
    <canvas id="" width="600" height="600"></canvas>

    <div id="videoContainer" style="display:none">
        <video id="video" controls="true" autoplay="true"></video>
    </div>
    <canvas id="c1" width="160" height="96"></canvas>
    <canvas id="c2" width="160" height="96"></canvas>
    <div style="height:100px "></div>
    <script>
        var processor = {};

        processor.doLoad = function doLoad() {
            this.video = document.getElementById("video");
            this.c1 = document.getElementById("c1");
            this.ctx1 = this.c1.getContext("2d");
            this.c2 = document.getElementById("c2");
            this.ctx2 = this.c2.getContext("2d");
            let self = this;
            this.video.addEventListener(
                "play",
                function () {
                    self.width = self.video.videoWidth / 4;
                    self.height = self.video.videoHeight / 4;
                    self.timerCallback();
                },
                false
            );
        };
        processor.timerCallback = function timerCallback() {
            if (this.video.paused || this.video.ended) {
                return;
            }
            this.computeFrame();
            let self = this;
            setTimeout(function () {
                self.timerCallback();
            }, 0);
        };

        processor.computeFrame = function computeFrame() {
            this.ctx1.drawImage(this.video, 0, 0, this.width, this.height);
            let frame = this.ctx1.getImageData(0, 0, this.width, this.height);
            // let l = frame.data.length / 4;
            // for (let i = 0; i < l; i++) {
            //     let r = frame.data[i * 4 + 0];
            //     let g = frame.data[i * 4 + 1];
            //     let b = frame.data[i * 4 + 2];
            //     // rgba   255 255 0 黄色
            //     if (g > 100 && r > 100 && b < 43) {
            //         frame.data[i * 4 + 3] = 0;
            //     }
            // }

            const data = frame.data;
            for (var i = 0; i < data.length; i += 4) {
                data[i] = 255 - data[i];     // red
                data[i + 1] = 255 - data[i + 1]; // green
                data[i + 2] = 255 - data[i + 2]; // blue
            }



            this.ctx2.putImageData(frame, 0, 0);
            return;
        };
    </script>

    <script>
        const canvas = document.querySelector('canvas');
        const ctx = canvas.getContext('2d');
        const { width, height } = canvas;

        ctx.fillStyle = 'red';

        function draw(rotation = 0) {
            ctx.clearRect(0, 0, 1000, 1000);
            ctx.save();
            ctx.translate(width / 2, height / 2);
            ctx.rotate(rotation);
            ctx.translate(-width / 2, -height / 2);
            ctx.beginPath();
            ctx.rect(200, 200, 200, 200);
            ctx.fill();
            ctx.restore();
        }

        function update(t) {
            draw(t / 500);
            requestAnimationFrame(update);
        }

        const stream = canvas.captureStream();
        const recorder = new MediaRecorder(stream, { mimeType: 'video/webm' });

        const data = [];
        recorder.ondataavailable = function (event) {
            if (event.data && event.data.size) {
                data.push(event.data);
            }
        };
        recorder.onstop = () => {
            const url = URL.createObjectURL(new Blob(data, { type: 'video/webm' }));
            document.querySelector("#videoContainer").style.display = "block";
            document.querySelector("video").src = url;

            processor.doLoad()



        };

        recorder.start();
        update(0);

        setTimeout(() => {
            recorder.stop();
        }, 6000);


    </script>
</body>

</html>
web修理工
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
canvas录制视频和播放
06-01
canvas录制视频和播放
canvas 录制视频和播放
03-09
插件描述：canvas 录制视频和播放。 参考实例：http://www.jq22.com/jquery-info6133
Canvas视频处理-22
编程是一门实践技术
03-29 340
在处理视频时，Canvas可以捕获视频的每一帧，并在其上应用各种图像处理技术，如颜色调整、滤镜效果、像素操作等。通过将视频帧绘制到Canvas上，开发者可以实时地对视频进行各种自定义处理，实现诸如视频特效、动态遮罩、绿幕替换等复杂功能。这种技术的优点在于其灵活性和可定制性。与传统的视频处理软件相比，Canvas视频处理不需要安装额外的软件，只需要编写相应的JavaScript代码即可实现各种视频处理效果。此外，Canvas API还支持跨浏览器和跨平台使用，使得开发者可以更加便捷地开发和部署视频处理应用。
canvas视频处理
Vivian_shuang的博客
08-09 2540
DOCTYPE html> html> head> meta charset="UTF-8"> title>title> head> body> video src="videoviewdemo.mp4" autoplay="" id="video" loop="">你的浏览器不支持视频video> canvas id="canvas" width=
canvas处理视频
包磊磊的博客
09-02 1140
var video = document.getElementById("video"); var myCanvas = document.getElementById("myCanvas"); var ctx = myCanvas.getContext('2d'); function animate(){ ctx.drawImage(video,0,0,200,300) var dat
【Canvas】使用画布绘制动画录制成MP4视频解决方案
TA远方
03-20 2736
电脑浏览器上是可以将Canvas绘制的动画录制成视频的，实现一键生成视频动画分享，让视频制作变得更容易更快捷，这里将实现过程讲一下。
CCapturejs可以对网页中Canvas的动画进行捕获录制成视频
08-11
CCapture.js 可以使用固定的帧率实现对网页中 Canvas 的动画进行捕获，录制成视频。CCapture.js 依赖于 Whammy.js 和 gif.js。
ccapture.js：以固定帧速率捕获基于画布的动画的库
02-04
CCapture.js-捕获基于画布的动画的库CCapture.js是一个库，可帮助捕获以固定帧速率使用HTML5 canvas创建的动画。... 没什么大不了的，您可以启动一个截屏软件，制作出一个视频文件并进行处理。 但是，如果您想创建动
Android应用开发揭秘pdf高清版
10-16
4.1.2 事件处理 4.2 常用控件应用 4.2.1 文本框(Textiew) 4.2.2 列表(ListView) 4.2.3 提示(T0ast) 4.2.4 编辑框(EditText) 4.2.5 单项选择(RadioGroup、RadioButton 4.2.6 多项选择(CheckBox) 4.2.7 下拉列表...
html2canvas 截屏功能 不太完善 求更加完善的 一块学习
chiyehuo9692的博客
02-20 406
html2canvas.min.js /* html2canvas 0.5.0-alpha2 <http://html2canvas.hertzen.com> Copyright (c) 2015 Niklas von Hertzen Released u...
html5canvas播放视频
05-16
html5 canvas 播放视频html5 canvas 播放视频
js实现屏幕截图视频录制 video_record.7z
02-24
通过video标签和canvas实现视频截图录制功能 只支持同域名资源录制，不支持录制来自其它网站的媒体源
09. 将canvas绘图动画录制为视频
qq_29517595的博客
03-15 706
不使用录屏软件，将canvas绘图的动画录制为视频：使用canvas对象所支持的captureStream方法。
前端JS将Canvas录制为视频文件
ezshine的博客
04-21 2899
2020年6月我做了一个给程序员专用的虚拟鼓励师插件叫“Rainbow Fart Waifu”，VSCode和HBuilderX的插件市场里都可以搜到。总之就是让没有妹子陪伴的程序员朋友们写代码时不孤单...这个插件获得了HBuilderX插件开发大赛的二等奖，据很多用户朋友们说，这是个值得特等奖的插件！上周对这个插件又进行了一个小更新，可以一键导出截图和导出一段五秒短视频。其中导出五秒短视频正是看了 @十年踪迹 大佬的这一篇 【前端冷知识】如何将Canvas绘制过程转为视频 后才加入的。这个API的使用非
视频录制，截图涂鸦功能
hkduan的博客
04-28 580
以前视频项目开发中，需要实现在video 视频上截图，录影后将文件上传到阿里云服务器上。截图功能相对来说比较容易实现，使用canvas 的 drawImage 方法将video 控件的区域绘制下来即可。录影相对来说比较麻烦，目前用webRTC 简单实现。 https://www.webrtc-experiment.com/RecordRTC/simple-demos/ 功能简单介绍：使用video...
原生Js Canvas去除视频绿幕背景
Raccon_的博客
09-07 1941
这里的去除视频背景并不是对视频文件进行操作去除背景如果需要对视频扣除背景并导出可以使用ffmpeg等库，这里仅作播放用所以采用这种方法由于uniapp中的canvas经过封装，且 uniapp 的drawImage无法绘制视频帧画面，因此uniapp中不适用实现过程是将视频使用canvas逐帧截下来对截取的图片进行处理，然后在canvas中显示处理好的图片最后通过定时器高速处理替换，形成视频播放的效果，效果如下图⬇边缘仍然会有些绿幕的像素，可以通过其他的处理进行优化。
h5进行手机录像传给后端base64格式
Hruibin的博客
05-16 858
通过input=file方式兼容比较好一些。 html部分代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>h5手机录像</title> </head> <bo
HTML5 vedio标签与canvas的结合实现视频同步模糊效果
Chatopera
11-25 5529
首先是的在线效果。 其次是对于canvas的基础知识。 FROM： http://zcblog.net/index.php/2011/343 你可能学过和这两个标签，那有没有想过这两个标签结合起来使用呢。其实，两个标签结合使用可以发生有趣的事情。下面来看一个简单的实例。 view plaincopy to clipboardprint
RTSPtoWebRTC、RTSPtoWeb ( 自HTML播放)：页面中预览摄像机视频，无插件的播放方式，适合局域网使用，无需流媒体服务器
最新发布
iOS逆向与安全
05-28 59
两套虽然都能转rtsp，通过js在html上进行播放，但是都是自己内部的一个tmpl模板，如果想将视频最终展现在自己系统中，还需要自己实现一个js用于自己的html上播放。RTSPtoWeb是RTSPtoWebRTC的升级版，提供了web端，以及hls，hlsll，mse，webrtc四种方法来播放，还提供了一系列的API doc，尤其是对webrtc接口信息的获取，使用js来获取该接口信息，完成视频流的播放的。RTSPtoWeb是go语言编写的一套将rtsp视频流在网页上用js直接播放的程序。
android视频录制动态添加时间水印
06-10
如果要在 Android 视频录制过程中动态添加时间水印，可以使用 Camera2 API 实现。Camera2 API 可以获取到每一帧视频的数据，因此可以在每一帧数据上添加时间水印，并将处理后的数据传递给 MediaRecorder 进行录制。 以下是添加动态时间水印的示例代码： ``` private CameraDevice mCameraDevice; private CaptureRequest.Builder mPreviewBuilder; private ImageReader mImageReader; private Surface mRecorderSurface; private void initCamera() { CameraManager manager = (CameraManager) getSystemService(Context.CAMERA_SERVICE); String cameraId = CameraCharacteristics.LENS_FACING_BACK + ""; try { manager.openCamera(cameraId, new CameraDevice.StateCallback() { @Override public void onOpened(@NonNull CameraDevice cameraDevice) { mCameraDevice = cameraDevice; startPreview(); } @Override public void onDisconnected(@NonNull CameraDevice cameraDevice) { mCameraDevice.close(); mCameraDevice = null; } @Override public void onError(@NonNull CameraDevice cameraDevice, int i) { mCameraDevice.close(); mCameraDevice = null; } }, null); } catch (Exception e) { e.printStackTrace(); } } private void startPreview() { try { SurfaceTexture surfaceTexture = new SurfaceTexture(0); surfaceTexture.setDefaultBufferSize(640, 480); Surface previewSurface = new Surface(surfaceTexture); mImageReader = ImageReader.newInstance(640, 480, ImageFormat.YUV_420_888, 2); mImageReader.setOnImageAvailableListener(new ImageReader.OnImageAvailableListener() { @Override public void onImageAvailable(ImageReader reader) { Image image = reader.acquireLatestImage(); ByteBuffer buffer = image.getPlanes()[0].getBuffer(); byte[] data = new byte[buffer.remaining()]; buffer.get(data); addTimeWatermark(data, image.getWidth(), image.getHeight()); image.close(); } }, null); mRecorderSurface = mMediaRecorder.getSurface(); mPreviewBuilder = mCameraDevice.createCaptureRequest(CameraDevice.TEMPLATE_PREVIEW); mPreviewBuilder.addTarget(previewSurface); mPreviewBuilder.addTarget(mImageReader.getSurface()); mCameraDevice.createCaptureSession(Arrays.asList(previewSurface, mImageReader.getSurface(), mRecorderSurface), new CameraCaptureSession.StateCallback() { @Override public void onConfigured(@NonNull CameraCaptureSession cameraCaptureSession) { try { cameraCaptureSession.setRepeatingRequest(mPreviewBuilder.build(), null, null); } catch (Exception e) { e.printStackTrace(); } } @Override public void onConfigureFailed(@NonNull CameraCaptureSession cameraCaptureSession) { } }, null); } catch (Exception e) { e.printStackTrace(); } } private void addTimeWatermark(byte[] data, int width, int height) { YuvImage yuvImage = new YuvImage(data, ImageFormat.NV21, width, height, null); ByteArrayOutputStream out = new ByteArrayOutputStream(); yuvImage.compressToJpeg(new Rect(0, 0, width, height), 100, out); byte[] jpegData = out.toByteArray(); Bitmap bitmap = BitmapFactory.decodeByteArray(jpegData, 0, jpegData.length); Canvas canvas = new Canvas(bitmap); canvas.drawText(getCurrentTime(), 10, 10, new Paint()); canvas.save(); ByteArrayOutputStream outputStream = new ByteArrayOutputStream(); bitmap.compress(Bitmap.CompressFormat.JPEG, 100, outputStream); byte[] outputData = outputStream.toByteArray(); try { mRecorderSurface.lockCanvas(null).drawBitmap(bitmap, 0, 0, null); mMediaRecorder.writeSampleData(mRecorderSurface, ByteBuffer.wrap(outputData), new MediaCodec.BufferInfo()); } catch (Exception e) { e.printStackTrace(); } finally { mRecorderSurface.unlockCanvasAndPost(canvas); } } ``` 需要注意的是，在添加时间水印时，要将视频帧转换为 Bitmap 对象，并在 Bitmap 上绘制时间水印。然后，将处理后的数据传递给 MediaRecorder 进行录制。同时，要在 CameraDevice.close() 方法被调用时，释放资源。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值