在钛javascript中移动屏幕图像

时间:2016-11-17 15:49:54

标签: javascript android ios titanium appcelerator-titanium

我需要在这个名称中创建这样的效果:

Link from the example site

//I need this in javascript

问题是创建的效果是包含所有设计的图像。如何在整个图像中移动并在javascript中仅显示部分图像用于android和IOS? Image of all situations of the name

2 个答案:

答案 0 :(得分:3)

我用

实现了它

<强> INDEX.XML

<Alloy>
<Window class="container">
    <Label id="label" top="80" onClick="doClick">Play Sign</Label>
    <View height="84">
        <ImageView width="255" height="7224" id="sigimage" top="0" image="/testImages/0D8Zt.png"></ImageView>
    </View>
</Window>
</Alloy>

<强> index.tss

".container": {
    backgroundColor:"white"
}
"Label": {
    width: Ti.UI.SIZE,
    height: Ti.UI.SIZE,
    color: "#000"
}

"#label": {
    font: {
        fontSize: 18
    }
}

<强> index.js

var interval = null;
var i=0;

function doClick(e) {
    clearInterval(interval);
    i = 0;
    replay();
}
replay();
function replay(){
    interval = setInterval(function(){
        if(i<86){
            $.sigimage.top = -i*84;
            i++;
            Ti.API.info('i = '+i);
        }else{
            clearInterval(interval);
        }
    },10);
}

$.index.open();
一个小技巧,希望这会对你有所帮助。 :)

enter image description here

答案 1 :(得分:0)

由于您已有图像列表,因此非常简单。首先,在Alloy中创建一个imageView

<ImageView id="signature" />

接下来添加tss中的所有图像并以ms为单位设置单个图像的速度

"#signature": {
    images: ['image1.png','image2.png','image3.png',....],
    duration: 50,
    repeatCount: 1
}

在我的例子中,我将它设置为50ms。这意味着你每秒有20张图像。我还将repeatCount设置为1,因此不会重复(0是默认和无限的)

然后,只要您希望签名在start()控制器文件中“开始”调用js

$.signature.start();

阅读有关它的docs