import{_ as n,o as l,c as p,S as s,k as a}from"./chunks/framework.532b6b18.js";const h=JSON.parse('{"title":"控制器皮肤","description":"","frontmatter":{},"headers":[],"relativePath":"plugin/control-ui.md","filePath":"plugin/control-ui.md","lastUpdated":1673441101000}'),e={name:"plugin/control-ui.md"},o=s('

控制器皮肤 ​

演示 ​

👉 查看完整演示

安装 ​

bash
npm install artplayer-plugin-control
bash
yarn add artplayer-plugin-control
bash
pnpm add artplayer-plugin-control
html
<script src="path/to/artplayer-plugin-control.js"></script>

CDN ​

bash
https://cdn.jsdelivr.net/npm/artplayer-plugin-control/dist/artplayer-plugin-control.js
bash
https://unpkg.com/artplayer-plugin-control/dist/artplayer-plugin-control.js

使用 ​

',8),r=a("div",{className:"run-code","data-libs":"./uncompiled/artplayer-plugin-control/index.js"}," ▶ Run Code ",-1),t=s(`
js
var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
    fullscreen: true,
    fullscreenWeb: true,
    plugins: [
        artplayerPluginControl(),
    ],
});

enable ​

是否启用新的控制器皮肤

`,4),c=a("div",{className:"run-code","data-libs":"./uncompiled/artplayer-plugin-control/index.js"}," ▶ Run Code ",-1),i=s(`
js
var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
    fullscreen: true,
    fullscreenWeb: true,
    controls: [
        {
            position: 'right',
            html: '<button type="button">Switch UI</button>',
            click: function () {
                const { enable } = art.plugins.artplayerPluginControl;
                art.plugins.artplayerPluginControl.enable = !enable;
            },
        },
    ],
    plugins: [
        artplayerPluginControl(),
    ],
});
`,1),y=[o,r,t,c,i];function D(F,C,d,b,u,A){return l(),p("div",null,y)}const g=n(e,[["render",D]]);export{h as __pageData,g as default};