реализовать паузу и перезапустить анимацию для просмотра изображений в appcelerator titanium - PullRequest
Новая
       72

реализовать паузу и перезапустить анимацию для просмотра изображений в appcelerator titanium

0 голосов
/ 12 октября 2018

У меня есть изображение, которое продолжает анимироваться в направлении вверх-вниз.При нажатии на изображение изображение должно быть приостановлено, а при повторном нажатии должно возобновиться анимация.Я сейчас использую pause () просмотра изображений, но он ничего не делает.Упоминается, что «Этот метод работает, если указано несколько изображений», но как я могу использовать это для одного изображения.Пожалуйста, найдите код в ссылке ниже.Спасибо

index.xml: 

<Alloy>
  <Window id="winIos">
    <View id="vOne" class='viewSize'>
      <ImageView id="one" class='oval' ></ImageView>
      <ImageView id="a" image= "/images/img_1.png"></ImageView>
    </View>
  </Window>
</Alloy>

index.js 

var osname = Ti.Platform.osname;
if (osname == 'iphone') {

    var ANIMATION = require('/alloy/animation');
    var win = $.winIos;

    var randomArray=[];
    var n = 1;
    var rann;

    function showAnimations(){

        var imgName = "img_1.png";
        var ranImg = "/images" + "/" + imgName;

        win.getChildren()[0].id2 = imgName;
        win.getChildren()[0].touchEnabled = true;
        win.getChildren()[0].zIndex = 3;
        win.getChildren()[0].getChildren()[1].image = ranImg;

        animation = Ti.UI.createAnimation();    //animate image up
        animation.top = 20;
        animation.delay = 120;
        animation.duration = 1200;
        win.getChildren()[0].touchEnabled = true;
        win.getChildren()[0].getChildren()[1].animate(animation);

        animation.addEventListener('complete', function() {
            animation1 = Ti.UI.createAnimation();   //animate image down
            animation1.top = 159;
            animation1.delay = 900;
            animation1.duration = 1200;
            win.getChildren()[0].getChildren()[1].animate(animation1);

            animation1.addEventListener('complete', function() {
                win.getChildren()[0].touchEnabled = false;
            });
        });
    }

    setInterval(showAnimations, 4300);

    win.addEventListener('click', function(e) {
        console.log("imgSrc" + JSON.stringify(e.source.getChildren()[1]));

        if(e.source.getChildren()[1]){
            e.source.getChildren()[1].pause();
        }
    });

    win.addEventListener('close', function() {
        clearInterval(showAnimations);
    });

    win.open();
}

index.tss 

"#winIos":{
    orientationModes:[Ti.UI.LANDSCAPE_RIGHT],
    backgroundColor:'white',
    id2:""
}

".viewSize":{
    height:150,
    width:150,
}

".oval":{
    image:'/images/oval.png',
    height:"50", 
    width:"150",  
    left:"0", 
    bottom:"-2", 
    touchEnabled:"false"
}

"#a":{
    id2:'',
    height:100,
    width:70,
    top:149,
    touchEnabled:false,
}

"#vOne":{
    id2:'',
    left:"80", 
    touchEnabled:false,
    top:"10",
    zIndex:0
}

1 Ответ

0 голосов
/ 12 октября 2018

ImageView pause() работает только для нескольких изображений, как вы упомянули.Это слайд-шоу с изображением, оно не имеет ничего общего с Ti.UI.Animation.На самом деле вы не можете остановить анимацию на Android, но есть открытый PR (https://github.com/appcelerator/titanium_mobile/pull/10130) при реализации stop().

. В зависимости от вашей анимации вы можете попытаться создать анимацию Lottie и использоватьTi.Animation (https://github.com/m1ga/ti.animation), поскольку включает методы паузы и возобновления.

...