2016-02-13 134 views
0

我想動畫一個視圖。從屏幕底部查看幻燈片動畫到頂部

我希望視圖從屏幕的底部滑動到頂部。

我寫了這段代碼,但是這個視圖並沒有顯示出來。

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

參考是看這個document

回答

0

你應該叫動畫的方法傳遞您所創建動畫對象的引用。

myView.animate(expand); 
+0

謝謝@Mushood,但這是我的錯字。我寫了animate()而不是add()。問題可能在其他地方。 – whitebear

0

對於你的要求試試這個

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 
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); 

只是有一個嘗試,我希望這可以幫助你。如果你真的想改變視圖的高度來獲得效果,也許你可以定義一個方法來設置視圖高度和時間。祝你好運!