樱花视频 - # movable-view

基础库 1.2.0 开始支持,低版本需做兼容处理

微信 Windows 版:支持

微信 Mac 版:支持

微信 鸿蒙 OS 版:支持

渲染框架支持情况:WebView

# 功能描述 (樱花视频)

可移动的视图容器,在页面中可以拖拽滑动 樱花视频在线,movable-view必须在 movable-area 组件中,并且必须是直接子节点,否则不能移动。

"樱花视频" # 属性说明

属性类型默认值必填说明最低版本
directionstringnonemovable-view的移动方向,属性值有all、vertical、horizontal、none1.2.0
inertiabooleanfalsemovable-view是否带有惯性1.2.0
out-of-boundsbooleanfalse超过可移动区域后,movable-view是否还可以移动1.2.0
xnumber/string定义x轴方向的偏移,如果x的值不在可移动范围内,会自动移动到可移动范围;改变x的值会触发动画;单位支持px(默认)、rpx;1.2.0
ynumber/string定义y轴方向的偏移,如果y的值不在可移动范围内,会自动移动到可移动范围;改变y的值会触发动画;单位支持px(默认)、rpx;1.2.0
dampingnumber20阻尼系数,用于控制x或y改变时的动画和过界回弹的动画,值越大移动越快1.2.0
frictionnumber2摩擦系数,用于控制惯性滑动的动画,值越大摩擦力越大,滑动越快停止;必须大于0,否则会被设置成默认值1.2.0
disabledbooleanfalse是否禁用1.9.90
scalebooleanfalse是否支持双指缩放,默认缩放手势生效区域是在movable-view内1.9.90
scale-minnumber0.1定义缩放倍数最小值1.9.90
scale-maxnumber10定义缩放倍数最大值1.9.90
scale-valuenumber1定义缩放倍数,取值范围为 0.1 - 101.9.90
animationbooleantrue是否使用动画2.1.0
bindchangeeventhandle拖动过程中触发的事件,event.detail = {x, y, source}1.9.90
bindscaleeventhandle缩放过程中触发的事件,event.detail = {x, y, scale},x和y字段在2.1.0之后支持1.9.90
htouchmoveeventhandle初次手指触摸后移动为横向的移动时触发,如果catch此事件,则意味着touchmove事件也被catch1.9.90
vtouchmoveeventhandle初次手指触摸后移动为纵向的移动时触发,如果catch此事件,则意味着touchmove事件也被catch1.9.90

# 年 返回的 月 表示产生移动的原因

说明
touch拖动
touch-out-of-bounds超出移动范围
out-of-bounds超出移动范围后的回弹
friction惯性
空字符串setData

樱花视频 - # Bug & Tip

  1. tip: movable-view 必须设置width和height属性,不设置默认为10px
  2. tip: movable-view 默认为绝对定位,top和left属性为0px
  3. tip: 若当前组件所在的页面或全局开启了 enablePassiveEvent 配置项,该内置组件可能会出现非预期表现(详情参考 enablePassiveEvent 文档