Famo.us 在动画期间更改对象的位置

如果我有一个变换-平移，它在5秒内垂直地在0->1000之间设置动画，如果我有单击事件来更改水平位置而不中断垂直动画，有没有办法

p.setTransform(Transform.translate(20,1000,0),
{
   duration: 5000,
   curve: 'linear'         
});

然后，在一些随机点击，我想开始改变x位置超过100毫秒左右，它可能有多个在5000的持续时间已经完成

我可以玩的起源和动画，独立，但我真的需要像素控制。那么有没有一种方法可以只制作x的动画呢

---

如果我添加一个setTransform，它将在第一个之后链接，而不是同时进行。

是的，您肯定可以实现这一点。您将需要使用ModifierCain。ModifierCain允许将修改器链接在一起，并独立控制变换。看看这个例子

希望这有帮助

var Engine            = require('famous/core/Engine');
var Surface           = require('famous/core/Surface');
var StateModifier     = require('famous/modifiers/StateModifier');
var Transform         = require('famous/core/Transform');
var ModifierChain     = require('famous/modifiers/ModifierChain');
var Easing            = require('famous/transitions/Easing');

var context = Engine.createContext();

var surface = new Surface({
  size:[200,200],
  properties: { backgroundColor:'green' }
});

surface.yState = new StateModifier();

surface.xState = new StateModifier();

var x = 0;
var y = context.getSize()[1] - 200;

surface.on('click',function(){
  x += 100;
  surface.xState.halt();
  surface.xState.setTransform(Transform.translate(x,0,0),{duration:200});
});

surface.chain = new ModifierChain();

surface.chain.addModifier(surface.yState);

surface.chain.addModifier(surface.xState);

context.add(surface.chain).add(surface);

surface.yState.setTransform(Transform.translate(0,y,0), {duration:5000});

---

美好的我想你不知道为什么有时（使用ImageSurface）图像在制作动画时会“撕裂”，有时会非常平滑？@KeithNicholas-hmm。。我没有确切的答案。您可以尝试在普通曲面的内容中放置一个img标记，看看问题是否仍然存在。@KeithNicholas可以随意提交一个github问题，更好地解释您遇到的问题以及如何重现它。