| xr | 您所在的位置：网站首页 › 微信80透明背景视频怎么设置 › xr |
xr
|
加粗 标红 插入代码 插入链接 插入图片 上传视频 请 登录 后发表内容 关闭新增或编辑超链接确认取消关闭插入视频确认取消发表一般透明视频存在多种实现的方案，比如抽离用于裁剪的视频，以及滤色视频等。 看你之前的提问，需要 style="mix-blend-mode: screen;" 来渲染黑色背景的视频，可以认为是实现 滤色 的效果。 如果需要实现完整的滤色，计算公式是 f(a,b)= 1 - (1-a)*(1-b)，目前需要等开放获取屏幕贴图，才比较好自定义实现。 如果仅仅需要将视频黑色的部分认为是透明， 可以参考官方案例 https://github.com/dtysky/xr-frame-demo 中的 xr-custom-logic 自定义一份材质。 ## 引用 import '../../xr-custom/assets/effect-screen';## 使用代码 ## 材质代码 （以下做法无法适配半透明情况，如锯齿次像素） import XrFrame from 'XrFrame'; const xrFrameSystem = wx.getXrFrameSystem(); xrFrameSystem.registerEffect('screen', scene => scene.createEffect({ name: "screen", images: [{ key: 'u_videoMap', default: 'white', macro: 'WX_USE_VIDEOMAP' }], defaultRenderQueue: 2000, passes: [{ "renderStates": { cullOn: false, blendOn: true, blendSrc: xrFrameSystem.EBlendFactor.SRC_ALPHA, blendDst: xrFrameSystem.EBlendFactor.ONE_MINUS_SRC_ALPHA, depthWrite: true, cullFace: xrFrameSystem.ECullMode.BACK, }, lightMode: "ForwardBase", useMaterialRenderStates: true, shaders: [0, 1] }], shaders: [ `#version 100 uniform highp mat4 u_view; uniform highp mat4 u_viewInverse; uniform highp mat4 u_vp; uniform highp mat4 u_projection; uniform highp mat4 u_world; attribute vec3 a_position; attribute highp vec2 a_texCoord; varying highp vec2 v_UV; void main() { v_UV = a_texCoord; vec4 worldPosition = u_world * vec4(a_position, 1.0); gl_Position = u_projection * u_view * worldPosition; }`, `#version 100 precision mediump float; precision highp int; varying highp vec2 v_UV; #ifdef WX_USE_VIDEOMAP uniform sampler2D u_videoMap; #endif void main() { vec4 baseColor = texture2D(u_videoMap, v_UV); float rgbSum = baseColor.r + baseColor.g + baseColor.b; // 设定阈值避免异常情况 if (rgbSum < 0.1) { gl_FragData[0] = vec4(1.0, 1.0, 1.0, 0.0); } else { gl_FragData[0] = vec4(pow(baseColor.rgb, vec3(2.2)), 1.0); } } `], }));你好，麻烦通过点击下方“反馈信息”按钮，提供出现问题的。 待楼主反馈2023-03-04有用 回复 1加粗 标红 插入代码 插入链接 插入图片 上传视频 请 登录 后发表内容 关闭新增或编辑超链接确认取消关闭插入视频确认取消发表问的是背景透明，不是视频透明。你好，麻烦通过点击下方“反馈信息”按钮，提供出现问题的。 待楼主反馈2023-03-05赞 回复关闭请选择投诉理由广告内容违法违规恶意灌水内容其他关闭请选择投诉理由广告内容违法违规恶意灌水内容其他 |
【本文地址】
公司简介
联系我们