国产一级a片免费看高清,亚洲熟女中文字幕在线视频,黄三级高清在线播放,免费黄色视频在线看

打開APP
userphoto
未登錄

開通VIP,暢享免費(fèi)電子書等14項(xiàng)超值服

開通VIP
騰訊云剪 微剪開發(fā)文檔

插件聲明

在小程序的app.json中聲明需要使用的插件,示例如下:

復(fù)制
復(fù)制成功
"plugins": {    "myPlugin": {      "provider": "wx76f1d77827f78beb",      "version": "0.0.1"    }  },
  • myPlugin:您自己定義的插件名稱,可以改為其他名稱。
  • provider:使用的插件方,其值為微剪插件的 appid,即wx76f1d77827f78beb。
  • version:微剪插件的版本號,一般選擇最新版本。

插件使用

拍攝組件

在需要展示視頻編輯能力的頁面 JSON 內(nèi)引入插件,名稱可自定,如下方暫定為 my-clip:

復(fù)制
復(fù)制成功
{  "usingComponents": {    "my-clip": "plugin://myPlugin/clip"  }}

在頁面的 wxml 內(nèi)寫入插件標(biāo)簽:

復(fù)制
復(fù)制成功
<view>    <my-clip    ></my-clip></view>

js 里獲取插件實(shí)例:

復(fù)制
復(fù)制成功
const plugin = requirePlugin("myPlugin")console.log(plugin)

clip 為插件的入口,因此插件內(nèi)部除導(dǎo)出功能外所用到的參數(shù)均從 clip 傳入。

導(dǎo)出組件

export 是一個(gè)集成了視頻導(dǎo)出功能的可定義外觀組件。

組件引入

復(fù)制
復(fù)制成功
{    "usingComponents": {      "export": "plugin://myPlugin/export"    }, }

編寫 wxml:

復(fù)制
復(fù)制成功
<export //內(nèi)部元素的tap事件觸發(fā)導(dǎo)出操作  watermark="https://cdn.cdn-go.cn/mp-video-edit-static/latest/images/watermark.png" //水印地址  bindexportsuccess="handleExportSuccess" //返回導(dǎo)出的文件臨時(shí)路徑,供調(diào)用者使用  >    <button class="customContent">導(dǎo)出</button> // 自定義UI,由slot實(shí)現(xiàn)</export>

導(dǎo)出需要 tap 事件觸發(fā),內(nèi)部需要包含可點(diǎn)擊的組件,并且不能 catch 事件。

處理返回的數(shù)據(jù):

復(fù)制
復(fù)制成功
handleExportSuccess(e) {  console.log(e.detail)}

e.detail包含導(dǎo)出視頻的信息:

復(fù)制
復(fù)制成功
{    code: 0 // 成功    tempFilePath: 'wxfile://xxx.mp4',    width: 544, // 視頻分辨率    height: 960}

插件支持傳入的參數(shù)

參數(shù)名稱類型是否必填說明
appidstring請到騰訊云賬號信息中查看
settingsobject用于自定義配置,包括 UI 樣式
bindInitedEventfunction插件初始化事件回調(diào)

settings 參數(shù)說明

settings 參數(shù)用來修改插件內(nèi)置的一些基本參數(shù),通過修改 settings 可以達(dá)到定制部分編輯能力或定制 UI 界面的功能 下面是關(guān)于 settings 的具體說明:

  • settings 整體為一個(gè) Object,如果不設(shè)置改屬性則取插件內(nèi)置默認(rèn)值。
  • settings 對象主要有兩部分的配置:common 和頁面配置。
  • 插件包含若干個(gè)組件,會暴露組件的樣式配置項(xiàng)。每個(gè)組件包含了自己的 state,默認(rèn) state 為 default,部分組件包含特殊 state,例如 camera 有recording這個(gè)狀態(tài)。
  • 頁面配置分為camera/previewer/editor等幾個(gè)主界面,分別代表拍攝頁,預(yù)覽頁,編輯主頁面,不填寫則默認(rèn)取 common 中的配置。
  • 每個(gè)組件暴露的最內(nèi)層屬性 value 為可修改部分,例如設(shè)置settings.previewer.nextButton.default.fontColor = '#fff'表示把該按鈕字體設(shè)置為白色。

settings 參數(shù)使用

在初始化的時(shí)候,傳入 settings 參數(shù):

復(fù)制
復(fù)制成功
<view><my-clipsettings="{{myCustomSettings}}"></my-clip></view>

settings 對象默認(rèn)值示例如下:

復(fù)制
復(fù)制成功
export default {  // 通用配置  common: {    videoMaxDuration: 30, // 小程序限制最多拍攝30秒    chooseMaxDuration: 1000, // 選擇視頻的默認(rèn)時(shí)長限制    clipMaxDuration: 60, // 裁切時(shí)長的默認(rèn)限制    exportPagePath: "/pages/main/export/index", // 默認(rèn)跳進(jìn)插件自己提供的頁面    style: {      // 主題色      primaryColor: "#ff584c",      // 文字色      textColor: "#fff",      // 禁用色      disableColor: "#ddd",      // 整體背景色      backgroundColor: "#000",      // 通用按鈕配置      button: {        state: {          default: {            backgroundColor: "#ff584c",            fontColor: "#fff"          },          disable: {            backgroundColor: "#ddd",            fontColor: "#fff"          }        }      },      // 通用二級按鈕配置      secondaryButton: {        state: {          default: {            backgroundColor: "#ffffff",            fontColor: "#ff584c"          },          disable: {            backgroundColor: "#ddd",            fontColor: "#fff"          }        }      }    }  },    // 以下配置均可選,單獨(dú)配置覆蓋上面的通用色配置  // 拍攝界面  camera: {    // 錄制按鈕    recordButton: {      state: {        default: {          backgroundColor: "#ff584c",          borderColor: "rgba(255,88,76,0.5)"        },        recording: {          backgroundColor: "#fff"        }      }    },    // 下一步按鈕    nextButton: {        state: {        default: {          backgroundColor: "#ff584c",          borderColor: "rgba(255,88,76,0.5)"        },        recording: {          backgroundColor: "#fff"        }      }    },    // 重新選擇按鈕    rechooseButton: {      // 同上    }  },  previewer: {    //下一步按鈕,可以不配,配了覆蓋style.style.button    nextButton: {      state: {        default: {          backgroundColor: "#ff584c",          fontColor: "#fff"        }      }    },    // 覆蓋common.style.primaryColor    clipper: {      borderColor: "#ff584c"    }  },  // 編輯頁面  editor: {    //下一步按鈕    nextButton: {      state: {        default: {          backgroundColor: "#ff584c",          fontColor: "#fff"        }      }    },    //操作面板    operatePanel: {      // 面板背景色,覆蓋common.style.backgroundColor      backgroundColor: "rgba(0,0,0,0.8)",      // 特效面板      effect: {        // 自定義icon,不傳使用默認(rèn)icon        icon: "https://xx.xx.xx",        // 游標(biāo)顏色,此處的movableColor和下面的highlightColor不填則取common.style.primaryColor        movableColor: "#ff584c"      },      // 濾鏡面板      filter: {        icon: "https://xx.xx.xx",        highlightColor: "#ff584c"      },      // 音樂面板      music: {        icon: "https://xx.xx.xx",        highlightColor: "#ff584c"      },      // 文字面板      text: {        icon: "https://xx.xx.xx",      }    }  }};
本站僅提供存儲服務(wù),所有內(nèi)容均由用戶發(fā)布,如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請點(diǎn)擊舉報(bào)
打開APP,閱讀全文并永久保存 查看更多類似文章
猜你喜歡
類似文章
S7-1200 1500 指令說明示例GEN_DIAG:生成診斷信息
jquery之css()改變字體大小,顏色,背景色
配置TOMCAT ECLIPSE MYSQL的JSP環(huán)境_美麗新世界
?OpenHarmony像素單位入門
Vue組件通信的六種方式,你會幾個(gè)?
(十)插槽 solt 具名插槽 作用域插槽
更多類似文章 >>
生活服務(wù)
分享 收藏 導(dǎo)長圖 關(guān)注 下載文章
綁定賬號成功
后續(xù)可登錄賬號暢享VIP特權(quán)!
如果VIP功能使用有故障,
可點(diǎn)擊這里聯(lián)系客服!

聯(lián)系客服