Skip to content

画布设置

本节介绍 HFLVEditor3 编辑器的画布区域设置,通过点击功能区画布设置按钮,修改相关配置。

基本配置

  • 画布尺寸: 调整画布的尺寸,通过下拉框选择,也可直接手动输入
  • 背景颜色: 设置画布背景色
  • 透明度: 设置画布透明度
  • 背景图片: 背景图片的相关设置

高级设置

  • 适配方式: 有多种适配方式,默认不适配,选择其他适配方式时,加载器会根据实际渲染的尺寸对设计画布内的组件进行相应的缩放适配
  • 传递画布: 默认不勾选,勾选后容器渲染页面时判断是否沿用画布的背景色等信息
  • 自定义样式: 通过设置json格式的样式配置,达到更加丰富的画布效果

TIP

自定义尺寸 当预制的尺寸不能满足快捷选择的需求时,支持通过编辑的Store注册自定义的尺寸

vue
<script>
  import {useVEStore} from "hflveditor3";
  const veStore = useVEStore();
  // label为空时显示width*height 
  veStore.registerCustomCanvasSize([{width:1900,height:680,label:''},{width:1800,height:830,label:''}])
</script>

自定义尺寸示意图

基于 VitePress 构建