水印相机实现有两种方式,在小程序端可以用<camera>来实现,但在安卓端不支持camera,使用uniapp的<live-pusher/>来实现相机。 live-pusher推荐使用nvue来做,好处是 nvue也可一套代码编译多端。 nvue的cover-view比vue的cover-view更强大,在视频上绘制元素更容易。如果只考虑App端的话,不用cover-view,任意组件都可以...
| live-player | 直播播放 | | live-pusher | 实时音视频录制,也称直播推流 | | map | 地图 | | canvas | 画布 | | web-view | web浏览器组件 | | ad | 广告组件 | 注释:嵌入到文章列表中的广告位 | ad-draw | 沉浸视频流广告组件 | | custom-tab-bar | 底部tabbar自定义组件 | 注释:h5页面...
不管是camera组件还是live-pusher组件。他们都是原生组件,所以必须使用cover-image、cover-view来制作覆盖层。 2个功能。1.实现相机+取景框的拍照组合。2.裁剪取景框内的元素。 拍照:1.APP端使用直播流 模拟相机窗口。需要在manifest.json -> APP权限模块里勾选 LivePusher直播流 2.小程序端只用组件模拟相机窗口。
cover-view解决方案算是一种对各端平台都比较兼容的方案,但实际效果对live-pusher组件的支持并不理想,并没有很好做到把内容层级放在摄像画面层级之上(可能是我技术没到家),但毕竟我不是去做小程序,只是开发app端,所以又找了另一种解决方案! cover-view解决方案 拉到cover-view解决方案文档下面,官方做出了相关提示,...
live-pusher 是原生组件,在小程序端层级高于前端组件,需使用cover-view覆盖。在低版本微信中,live-pusher无法内嵌于 scroll-view、swiper、picker-view、movable-view 中。在App端的nvue文件中,live-pusher没有这类限制。 App平台:使用<live-pusher/>组件,打包 App 时必须勾选 manifest.json->App 模块权限配置->...
不管是camera组件还是live-pusher组件。他们都是原生组件,所以必须使用cover-image、cover-view来制作覆盖层。 2个功能。1.实现相机+取景框的拍照组合。2.裁剪取景框内的元素。 拍照:1.APP端使用 直播流 模拟相机窗口。需要在manifest.json -> APP权限模块里勾选 LivePusher直播流 ...
由于相机组件app不支持,所以插件使用live-pusher 直播推流组件实现的自定义相机功能。 拍照页面使用nvue,可以实现应用内拍照以及拍照画面自定义元素等功能。 水印相机页watermarkCamera.nvue <template> <view class="live-camera" :style="{ width: windowWidth, height: windowHeight }"> ...
live-pusher(仅微信小程序、百度小程序、app-nvue支持,app-vue使用plus.video.LivePusher可实现推流) cover-view cover-image 混合渲染模式下原生组件的使用限制 由于原生组件脱离在 WebView 渲染流程外,因此在使用时有以下限制: 原生组件的层级是最高的,所以页面中的其他组件无论设置 z-index 为多少,都无法盖在原...
当你使用map、video、live-pusher等原生组件时,会发现前端写的view等组件无法覆盖原生组件,层级问题处理...
视图容器:view、scroll-view、swiper、match-media、cover-image 等。 基础内容:icon、text、rich-text、progress。 表单组件:button、checkbox、editor、from、input、picker、switch、textarea、label、radio等。 页面路由跳转:navigator。 媒体组件:audio、camera、image、video、live-player、live-pusher。