即使在向其分配内容后，创建的图层仍为空

Question

我只是想按照本教程做一个快速原型：

https://www.youtube.com/watch?v=3zaxrXK7Nac

这是我自己设计的，问题如下：

当我创建一个新层 time 8:13 of the posted video 并尝试使用属性 image 将我导入的层之一设置为这个新层的内容时，我没有得到结果。

如果我将这个新层带到屏幕上，我只能看到透明的黑色背景，根据教程，它应该有我通过图像分配给它的层属性。

这是我的代码示例：

sketch = Framer.Importer.load("imported/Untitled@2x")

explore_layer = new Layer
    width: 750
    height: 1334
    image: sketch.explore.explore_group
    x: screen.width


sketch.Tab_3.on Events.Click, ->
    explore_layer.animate
        properties:
            x: 0
            y: 0
        curve: "spring(400, 35, 0)"

这也是我图层的截图

https://gyazo.com/f3fccf7f38813744ea17d259463fabdc

Answer 1

Framer总是会导入Sketch选中页面中的组，该页面上的所有组都会转化为直接在sketch对象上可用的图层。另外：您现在将图层的图像设置为图层对象本身，而不是草图图层的图像。

因此，要使其正常工作，您需要做几件事：

将您要使用的所有元素放在 Sketch 的同一页面上
导入后，直接从草图对象访问这些元素（因此 sketch.explore_group 而不是 sketch.explore.explore_group）
使用草图层的图像，或在原型中使用草图层本身。

这是一个示例：

sketch = Framer.Importer.load("imported/Untitled@2x")

explore_layer = new Layer
    width: 750
    height: 1334
    image: sketch.explore_group.image
    x: screen.width


sketch.Tab_3.on Events.Click, ->
    explore_layer.animate
        properties:
            x: 0
            y: 0
        curve: "spring(400, 35, 0)"

或更短，并且 updated animation syntax:

sketch = Framer.Importer.load("imported/Untitled@2x")

sketch.explore_group.x = screen.width

sketch.Tab_3.on Events.Click, ->
    sketch.explore_group.animate
        x: 0
        y: 0
        options:
            curve: Spring(tension:400, friction:35)

即使在向其分配内容后，创建的图层仍为空

Layer created is empty even after assigning content to it

prototype

coffeescript

framerjs