0

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

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

4

1 回答 1

0

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

所以要让它工作，你需要做几件事：

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

这是一个示例：

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)"

甚至更短，并使用更新的动画语法：

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)
于 2017-02-20T08:14:50.273 回答