Question

如何在A帧中为纹理偏移设置动画？

我尝试过

- (void) receiveTestNotification:(NSNotification *) notification
{
    NSDictionary* data = notification.object;
    if (data == nil)
    {
        data = [NSDictionary dictionary];
    }

    if ([[notification name] isEqualToString:@"playingProgress"] && [TRIM(self.dicData[@"id"]) isEqualToString:TRIM(data[@"id"])])
    {
        [self setCurrentDuration:[(NSNumber*)TRIM(data[@"currentDuration"]) doubleValue]];
    }
    else
    {
        [self setCurrentDuration:0];
    }
}

还尝试了属性“ components.material.material.map.offset ”和“ components.material.material.map.offset.x ”。最后两个导致错误

<a-entity 
   animation="property: components.material.material.offset; from: 0 0; to: 1 1; dur: 5000;loop: true;" 
   geometry="primitive: cylinder; height: 200; radius: 20; openEnded: true;" 
   material="src: tex.jpg;side: double;shader:flat;"></a-entity>

我的目标是对重复的纹理进行动画处理，并以循环的方式进行对象化。

Answer 1

动画组件可在另一个组件或其属性之一上工作。 https://aframe.io/docs/0.9.0/components/animation.html#api 来自文档：

Property to animate. Can be a component name, a dot-delimited property of a component (e.g., material.color), or a plain attribute.

因此，这应该起作用： animation="property: material.offset; to: 0.2 0.5"

但是它失败，并引发错误。我怀疑它失败的原因是由于Aframe访问材料组件属性的方式。颜色有效，这是与偏移量（Vector2）不同的数据类型。我已经直接问过框架的人。

这是我制作的一个小故障，显示了如何使用偏移量转换纹理。

material=" offset: 0.5 0.25"

https://glitch.com/~texture-offset

如果将第20行中的动画组件更改为 animation="property: material.offset; to: 0 0"

失败（提供空白）。

但是您可以创建一个自定义组件，该组件使用tick事件在material.offset上调用setAttribute并以这种方式对纹理转换进行动画处理。

另一种方法（如果要对纹理转换的所有方面进行更多控制）将直接与THREEjs对象一起使用。下面是一个小故障，显示了如何执行此操作 https://glitch.com/~tex-animwave

动画组件基于anime.js构建，因此您可以导入该库并使其直接驱动THREEjs参数。 https://animejs.com/

A帧动画纹理偏移

1 个答案: