Back to Taro

taro-movable-view-core

packages/taro-components/src/components/movable-area/readme.md

4.2.04.1 KB
Original Source

taro-movable-view-core

<!-- Auto Generated Below -->

Properties

PropertyAttributeDescriptionTypeDefault
animationanimation是否使用动画booleantrue
dampingdamping阻尼系数,用于控制x或y改变时的动画和过界回弹的动画,值越大移动越快number20
directiondirection移动方向,属性值有all、vertical、horizontal、none"all" | "horizontal" | "none" | "vertical""none"
disableddisabled是否禁用booleanfalse
frictionfriction摩擦系数,用于控制惯性滑动的动画,值越大摩擦力越大,滑动越快停止;必须大于0,否则会被设置成默认值number2
inertiainertia是否带有惯性booleanfalse
outOfBoundsout-of-bounds超过可移动区域后,是否还可以移动booleanfalse
scalescale是否支持双指缩放,默认缩放手势生效区域是在movable-view内booleanfalse
scaleMaxscale-max定义缩放倍数最大值number10
scaleMinscale-min定义缩放倍数最小值number.5
scaleValuescale-value定义缩放倍数,取值范围为 0.5 - 10number1
xx定义x轴方向的偏移,如果x的值不在可移动范围内,会自动移动到可移动范围;改变x的值会触发动画;单位支持px;number | string0
yy定义y轴方向的偏移,如果y的值不在可移动范围内,会自动移动到可移动范围;改变y的值会触发动画;单位支持px;number | string0

Events

EventDescriptionType
change拖动过程中触发的事件,event.detail = {x, y, source}CustomEvent<any>
htouchmove初次手指触摸后移动为横向的移动时触发,如果catch此事件,则意味着touchmove事件也被catchCustomEvent<any>
scale缩放过程中触发的事件,event.detail = {x, y, scale},x和y字段在2.1.0之后支持CustomEvent<any>
vtouchmove初次手指触摸后移动为纵向的移动时触发,如果catch此事件,则意味着touchmove事件也被catchCustomEvent<any>

Methods

endScale() => Promise<void>

结束缩放

Returns

Type: Promise<void>

setParent({ element, area }: { element: HTMLElement; area: { width: number; height: number; }; }) => Promise<void>

设置父节点

Returns

Type: Promise<void>

setScale(scale: number) => Promise<void>

更新缩放

Returns

Type: Promise<void>


Built with StencilJS