famo.us中Modifier和StateModifier有什么区别?

时间:2014-04-16 08:59:36

标签: famo.us

我看到famo.us examples主要是指Modifier类,但famo.us大学教程主要引用StateModifier类。

这两者有何不同,哪种方法最合适?

4 个答案:

答案 0 :(得分:3)

目前,这些没有区别。

如果您需要setTransformsetSizesetOriginsetOpacity,请使用 StateModifier 。 目前修饰符仍支持这些方法,但它们已弃用

StateModifier 使用 Transitionable ,可用于在值之间平滑过渡。只需在使用这些方法时提供转换:

stateModifier.setTransform(Transform.rotateZ(Math.random()*Math.PI/2), { curve: 'easeOut', duration: 5000 });

修饰符更受限制,使用transformFromsizeFromoriginFromopacityFrom。这些方法可以接受值,getter函数或具有get函数的对象。

答案 1 :(得分:3)

根据着名大学的说法,这些是不同的:
Statemodifiers为每个实例创建一个新的Transitionable,这意味着您不能重用给定的可转换实例。 使用修饰符,您可以:
- 跨组件共享状态/从彼此导出状态

http://famo.us/university/famous-102/transitionables/6/

答案 2 :(得分:2)

他们的构造者的选择有一个重要的区别。 StateModifier仅接受常量值作为初始值。修饰符接受具有适当返回值的常量值和函数。该功能将以60fps的速度进行测量。

1)StateModifier

var stateModifier = new StateModifier({
    size: [200, 200],
    opacity: 1,
    transform: [1, 0.5, 0, 0, -0.5, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1],
    //transform: Transform.translate(20, 20, 0),  // --> this is still constant
});

2)修饰符

var transitionable = new Transitionable(0);
transitionable.set(2*3.14, {duration: 2000});

var modifier = new Modifier({
    origin: [0.5, 0.5],
    transform: function(){
        var state = transitionable.get();
        transition = Transform.rotateZ(state);
        return transition;  // --> this will cause rotating 
    },
    opacity: function(){
        return Math.random();  // --> this will cause blinking (60fps)  
    },
});

答案 3 :(得分:2)

您可以选择性能和设计注意事项

当对象具有静态定位时,您使用修改器,或者不经常更改其转换细节。例如,如果你有一组相对于父对象坐着的对象,你只需要设置一次它们的位置。你使用一个修饰符,因为一旦你将它们放在那里,就不必担心触摸它们所关注的渲染树。

当您需要更频繁地控制对象的变换时,可以使用 StateModifier 。这是您希望每帧或每当事件发生时动画或控制其变换的时候。

StateModifier使用 pull 推送方法。这为您提供了两种更改/动画对象变换的方法。 表示您正在提供一个函数并使用某个对象来确定对象的值(例如Transitionable或您自己的对象{{1} } 方法)。如果您有一个始终跟踪其他内容的游戏对象,那么这可能很有用,您可以使用每个帧都要求对象转换值的函数。 推送 表示您决定何时更改内容,并使用.get()的{​​{1}}或.setOpacity方法。这将更适合在某些事件触发之前保持静止的UI对象。您可以在调用这些方法时使用不同的缓动曲线,或者只是立即进行更改。

性能和设计考虑因素来自于您应该总是尝试编写一个不需要做的事情而不必要的应用程序。如果您的所有对象都使用带有 * pull 模型的.setTransform(使用每个帧调用的函数),您可以想象这会比您只需要更多的CPU功耗偶尔更改对象并使用 push 方法在需要时更改对象状态 。对于小型UI而言,这可能不是问题,但如果您将应用程序扩展为控制数百甚至数千个对象,则可以看到开始耗费更多CPU能力的位置。

总而言之, Modifer 非常适合将内容放在某处并忘记它,因为 StateModifier 更适合移动内容,但您必须选择不断被问及它在做什么()或在你做好准备时告诉它(推送)。