1

来自这个问题Tweening Colors on Spark AR via Script我现在尝试使开始和结束颜色动态有界。我可能还没有完全理解反应式编程的整个概念,但我试图创建一个工厂,所以值是一个函数……但它不起作用,或者只有初始值。使用设置功能并重新启动动画不会改变任何事情。我错过了什么?感谢你并致以真诚的问候!

const pink = [.99, .682, .721, 1];
const blue = [.0094, .0092, .501, 1];
const yellow = [0.9372, .7725, 0, 1];

function ColorFactory() {
    this.sourceCol = pink;
    this.targetCol = blue;

    this.set = function (_col1, _col2) {
        this.sourceCol = _col1;
        this.targetCol = _col2;
    }

    this.get = function (id) {
        switch (id) {
            case 'source': return this.sourceCol;
            default: return this.targetCol;
        }
    }
}


var colfac = new ColorFactory();

const timeDriver = Animation.timeDriver(timeDriverParameters);
const rotSampler = Animation.samplers.easeInQuad(0, 35);
const alphaSampler = Animation.samplers.linear(1, 0);
const colSampler = Animation.samplers.linear(colfac.get('source'), colfac.get('target'));
const colorAnimation = Animation.animate(timeDriver, colSampler);

timedriver.start();

//doesnt make change anything, same colors as before:
colfac.set(blue, yellow);
timedriver.reset();
timedriver.start();

那么我怎样才能使一组颜色动态呢?任何人?

4

1 回答 1

1

您唯一的“好”选择是执行以下操作:

const colors = [];
const driver = A.timeDriver({ durationMilliseconds : 1000 });

// On NativeUI monitor selected index event 
ui.selectedIndex.monitor.subscribe(
(val) => {
   const sampler = A.samplers.linear(colors[val.oldValue, colors[val.newValue]);
   const colorAnimation = A.animate(driver, sampler);

   // bind here to shader

})

于 2020-01-12T12:04:11.253 回答