Pinchable

所谓可捏放图层,就是你可以用两指缩放旋转的图层。当开启可捏放后,这两个属性默认都是开启的。你可以通过最大值最小值自定义缩放的范围。在 Framer Studio 中你可以按住 Alt 键同时使用鼠标拖动来模拟双指捏放。

Pinchable layers can be scaled and rotated with two fingers. By default, both of these properties are enabled. You can also define custom scale ranges, by defining minimum and maximum values. To pinch layers within Framer Studio, hold the alt key while moving your cursor.

layer.pinchable.enabled <boolean>

开启图层的可捏放属性。

Enable pinching for the layer.

  1. layerA = new Layer
  2. layerA.pinchable.enabled = true

layer.pinchable.threshold <number>

这是一个临界值,当量之间的距离大于这个值时才会被识别为捏放事件,默认是 0 。

The minimal distance between two pointers before the gesture is recognized. Set to 0 by default.

  1. layerA = new Layer
  2. layerA.pinchable.enabled = true
  3. # Set the minimal distance to 10
  4. layerA.pinchable.threshold = 10

layer.pinchable.centerOrigin <boolean>

是否设置双指捏放时图层的变换中心处于你双指正中间的位置,默认为 true

Sets the transform origin of your pinchable layer to the center point between your fingers. Set to true by default.

  1. layerA = new Layer
  2. layerA.pinchable.enabled = true
  3. # Always scale from the center of the layer
  4. layerA.pinchable.centerOrigin = false

layer.pinchable.scale <boolean>

是否开启双指捏放时图层跟着缩放,默认打开。

Enable or disable scaling on pinch. Set to true by default.

  1. layerA = new Layer
  2. layerA.pinchable.enabled = true
  3. # Disable scale on pinch
  4. layerA.pinchable.scale = false

layer.pinchable.scaleIncrements <number>

增量式地缩放,也就是缩放时图层的尺寸增长速度越来越大。

Scale the pinchable layer incrementally.

  1. layerA = new Layer
  2. layerA.pinchable.enabled = true
  3. # Scale in increments of 0.5 (0.5, 1, 1.5, 2)
  4. layerA.pinchable.scaleIncrements = 0.5

layer.pinchable.minScale <number>

设置图层缩小时的最小 scale 值。

Set the minimal scale value of the pinchable layer.

  1. layerA = new Layer
  2. layerA.pinchable.enabled = true
  3. # Set the minimal scale to 0.5
  4. layerA.pinchable.minScale = 0.5

layer.pinchable.maxScale <number>

设置图层放大时的最大 scale 值。

Set the maximal scale value of the pinchable layer.

  1. layerA = new Layer
  2. layerA.pinchable.enabled = true
  3. # Set the maximal scale to 2
  4. layerA.pinchable.maxScale = 2

layer.pinchable.scaleFactor <number>

设定缩放倍数,默认为 1 ,即和手指移动距离同步。

Set the scaling factor of the pinchable layer. Set to 1 by default.

  1. layerA = new Layer
  2. layerA.pinchable.enabled = true
  3. # Increase scaling speed by 2
  4. layerA.pinchable.scaleFactor = 2

layer.pinchable.rotate <boolean>

是否开启双指旋转,默认开启。

Enable or disable rotation on pinch. Set to true by default.

  1. layerA = new Layer
  2. layerA.pinchable.enabled = true
  3. # Disable scale on pinch
  4. layerA.pinchable.rotate = false

layer.pinchable.rotateIncrements <number>

增量式地旋转,也就是旋转时图层的旋转角度增长速度越来越大。

Rotate the pinchable layer incrementally.

  1. layerA = new Layer
  2. layerA.pinchable.enabled = true
  3. # Scale in increments of 15 degrees
  4. layerA.pinchable.rotateIncrements = 15

layer.pinchable.rotateFactor <number>

设定旋转倍数,默认为 1 ,即和手指扭动角度同步。

Set the rotation factor of the pinchable layer. Set to 1 by default.

  1. layerA = new Layer
  2. layerA.pinchable.enabled = true
  3. # Increase the rotation speed by 2
  4. layerA.pinchable.rotateFactor = 2