Question

我想为视图制作动画。

我希望视图从屏幕的底部滑动到顶部。

我编写了这段代码，但视图没有显示出来。

myWin.add(myView);
myView.height = '0%';
var expand= Ti.UI.createAnimation({
    height: '100%',
    duration: 300
});
myView.animate(expandView);

参考是document

Answer 1

@whitebear。在你的问题中，你想让视图从底部滑到顶部，但你采取了错误的方式。您采用的方式是形状更改动画，它想要更改视图的高度来制作它。但是，它永远不会得到你想要的滑动动作，如果你的代码有效，你会看到的是视图会变得越来越大，直到填满窗口，而不是滑动操作。

您想要的是视图的位置更改动画。只需更改视图的顶部值即可。例如：

var view = Ti.UI.createView({
    top: '-100%',             //the view can't be see at the bottom
    width: '100%',
    height: '100%',
    backgroundColor: 'red'
});

var ani = Ti.UI.createAnimation({
    top: 0,                   //show the view from the bottom to top
    duration: 3000
});

view.animate(ani);

试一试，希望这可以帮到你。如果您确实想要更改视图的高度以获得效果，可能您可以定义一个方法来设置视图高度和时间。祝你好运！

Answer 2

您应该调用animate视图方法，为其创建动画对象的引用。

myView.animate(expand);

Answer 3

根据您的要求试试这个

var win = Ti.UI.createWindow({ backgroundColor : '#fff'});
var myView = Ti.UI.createView({backgroundColor : 'red'});
win.add(myView);
myView.height = '0%';
myView.bottom = '0'; // basically the view has been added at bottom of window

var expand= Ti.UI.createAnimation({
    height: '100%',
    duration: 1300
});
myView.animate(expand);// and you are only increasing the view's height in animate

从屏幕底部查看幻灯片动画到顶部

3 个答案: