有没有办法在Xamarin.Forms中播放抽奖动画的一部分?

时间:2019-11-15 14:29:58

标签: xamarin.forms lottie lottie-xamarin

我有一个要根据百分比显示的“动态”抽奖动画。 在Xamarin中,有没有一种方法可以绑定表格的动画的开始和结束?

我发现了一个带有react的样品: https://codepen.io/airnan/pen/RawvLB

var count = 0;
var container = document.getElementById('container');
var animData = {
    container: container,
    renderer: 'svg',
    loop: true,
    prerender: false,
    autoplay: false,
    autoloadSegments: false,
    path: 'https://labs.nearpod.com/bodymovin/demo/pancakes/data.json'
};

var anim;
var isThrowing = false;


anim = bodymovin.loadAnimation(animData);
anim.addEventListener('DOMLoaded',startAnimation);
container.onclick = throwPancake;

function throwComplete(){
    isThrowing = false;
    anim.removeEventListener('loopComplete',throwComplete);
}

function throwPancake(){
    if(isThrowing){
        return;
    }
    isThrowing = true;
    anim.playSegments([[27,142],[14,26]],true);
    var baconRand = Math.random()*1420;
    var butterXpos;
  if(baconRand < 1420/2){
    butterXpos = 500 + 900 + Math.random()*900;
  } else {
    butterXpos = 500 + Math.random()*900;
  }
    var baconPos = [-100+baconRand,480+Math.random()*370,0];
    var butterPos = [butterXpos,470+Math.random()*430,0];
    anim.layers[0].ks.p.k[0].e = baconPos;
    anim.layers[2].ks.p.k[0].e = baconPos;
    anim.layers[1].ks.p.k[0].e = butterPos;
    anim.layers[3].ks.p.k[0].e = butterPos;
    anim.addEventListener('loopComplete',throwComplete);
}

function startAnimation(){
    anim.playSegments([[0,20],[14,26]],true);
}

但是在Xamarin.Forms中我找不到相应的 playSegments 属性。

0 个答案:

没有答案