Question

如果我们只需要在状态修饰符中设置变换和转换，为什么我们需要在famo.us中使用transitionableTransform类：

var mainContext = Engine.createContext();

var surface = new Surface({
    size:[100,100],
    content: 'Click Me'
});

var modifier = new StateModifier({
    align: [.5, .5],
    origin: [.5, .5],
    transform: Transform.translate(0,-240,0)
});

surface.on("click", function(){
    modifier.setTransform(Transform.translate(0,0,0), {curve: 'easeIn', duration: 700});
});

mainContext.add(modifier).add(surface);

同样的问题是关于可转换的状态维护者。何时以及为什么我应该使用它代替直接设置转换和状态修饰符的转换，如代码所示？

Answer 1

根据Famo.us文档，modifier.setTransform（在talves示例中使用）是已弃用。

来自https://famo.us/docs/api/latest/core/Modifier “不推荐使用：首选使用静态变换transformFrom，或使用TransitionableTransform。”

-

然而，使用TransitionableTransform的推荐方法与您拥有的不同。您应该在Modifier的实例化中存储对transitionableTransform实例的引用。

您获得的一个优点是，在处理变换时，您不必引用修改器。您只需直接在变换上调用方法。

请参阅此处的示例：https://gist.github.com/LearnFamous/ae8d1c8f7af7a702d544

Answer 2

将其作为选项传递只是初始化修改器的转换状态的一种方法。正如Antonio setTransform所指出的，现在已弃用。

以下内容与您的代码相同： Here is the example using TansitionableTransform

  var mainContext = Engine.createContext();

  var surface = new Surface({
    size:[100,100],
    content: 'Click Me',
    properties: {
      backgroundColor: 'lightgrey'
    }
  });

  var transTransform = new TransitionableTransform();
  transTransform.set(Transform.translate(0,-240,0));

  var modifier = new Modifier({
    align: [0.5, 0.5],
    origin: [0.5, 0.5],
    transform: transTransform
  });

  surface.on("click", function(){
    transTransform.setTranslate(Transform.translate(0,0,0), {curve: 'easeIn', duration: 700});
  });

  mainContext.add(modifier).add(surface);

为什么我们需要famo.us中的transitionableTransform类？

2 个答案: