Question

为什么LayerA和LayerB在Framerjs中结束拖动时不会制作动画，代码为：

我创建layerA，layerB和layerC，然后拖动LayerC。

在Event DragMove中，我使用LayerA的偏移更改了LayerB和LayerC的道具，我总是想制作一个动画当它EndDrag时，但它不起作用。

有人知道为什么吗？

# Create layer
layerA = new Layer
    x: 50
    y: 200
    scale: 0.8
    width: 550
    height: 600
    opacity: 0.6
    borderRadius: 8
    backgroundColor: "#ffffff"

layerB = new Layer
    x: 50
    y: 250
    scale: 0.9
    opacity: 0.8
    width: 550
    height: 600
    borderRadius: 8
    backgroundColor: "#ffffff"

layerC = new Layer
    x: 50
    y: 300
    scale: 1
    width: 550
    height: 600
    borderRadius: 8
    backgroundColor: "#ffffff"

layerC.draggable.enabled = true
layerC.draggable.horizontal = false
layerC.draggable.constraints =
    x: 50
    y: 300
    width: 550
    height: 600
layerC.on Events.DragMove, ->
    print layerC.draggable.constraintsOffset
    layerA.opacity = 0.6 + 0.2 * layerC.draggable.constraintsOffset.y / 360
    layerA.scale = 0.8 + 0.1 * layerC.draggable.constraintsOffset.y / 360
    layerA.y = 200 + 50 * layerC.draggable.constraintsOffset.y / 360
    layerB.opacity = 0.8 + 0.2 * layerC.draggable.constraintsOffset.y / 360
    layerB.scale = 0.9 + 0.1 * layerC.draggable.constraintsOffset.y / 360
    layerB.y = 250 + 50 * layerC.draggable.constraintsOffset.y / 360

layerC.on Events.DragEnd, ->
    print layerC.draggable.constraintsOffset
    if layerC.draggable.constraintsOffset.y < 360
        layerC.animate
            properties: 
                opacity: 1
                scale: 1
                y: 300
            curve: "ease"
            time: 0.4
        layerA.animate 
        properties:
            opacity: 0.6
            scale: 0.8
            y: 200
        curve: "ease"
        time: 0.4
        layerB.animate 
        properties:
            opacity: 0.8
            scale: 0.9
            y: 250
        curve: "ease"
        time: 0.4

我是framer的新手请帮忙

Answer 1

你能举一个更好的例子来说明你想要达到的目标吗？你的代码（在修改格式之后）它起作用了 - 好吧，它会正确触发DragEnd事件，并在偏移量小于360时调用动画。

如果您告诉我们您正在尝试实现的目标，并分享该框架项目，我们可以更快，更准确地帮助您。

*对于信息请求感到抱歉，我暂时无法发表评论。

Answer 2

你的错误在你的想法中没有任何意义，你只是忘了正确地为layerA's和layerB's动画打算使用CoffeScript代码。这是我认为的工作示例：

http://share.framerjs.com/2mp2alhvueq4/

来自德国，丹尼斯

PS：根据FramerJS / Framer Studio提问的最佳方式是我们的专属Facebook-Group。

为什么LayerA和LayerB在Framerjs中结束拖动时不会制作动画

2 个答案: