基本動畫鈦

Question

我需要爲我的項目在視圖之間進行交叉淡化動畫。製作動畫和創建視圖/窗口的最佳方式是哪一種最好。建議我爲這項工作提供解決方案？我在測試環境中使用了Titanium 3.1.2.GA，Alloys和Android Emulator。任何示例可能會被appriciated？我thread在Appcelerator的論壇

INDEX.XML

<Alloy> 
    <Window id="fblogin" class="container"> 
     <Require src="loginsuccess" id="loginsuccess"></Require> 
     <Require src="loginFailure" id="loginFailure"></Require> 
     <Require src="loginPage" id="loginPage"></Require> 
    </Window> 
</Alloy> 

loginPage.xml

<Alloy> 
    <View class="container"> 
     <LoginButton ns="Alloy.Globals.Facebook"/> 
     <Button title="Google"></Button> 
    </View> 
</Alloy> 

loginFailure.xml

<Alloy> 
    <View class="container"> 
     <Label>Login Failed. Please try again later.</Label> 
    </View>> 
</Alloy> 

個

loginsuccess.xml

<Alloy> 
    <View class="container"> 
     <Label>Login Successful</Label>  
    </View> 
</Alloy> 

index.js

var animation = require('alloy/animation'); 
var loginPage = $.loginPage; 
var loginsuccess = $.loginsuccess; 
var loginFailure = $.loginFailure; 
function loginFails(){ 
    animation.crossFade(loginPage, loginFailure, 500, function(){}); 
} 
function loginSuccess(){ 
    animation.crossFade(loginPage, loginsuccess, 500, function(){}); 
} 
$.fblogin.open(); 

Answer 1

參照從你的鏈接問題描述：

現在如果我叫loginFails（）或loginSuccess （），那麼它的顯示錯誤是因爲它在控制器索引中，而不是在其他視圖控制器中。如何解決這個問題？

爲了引用內部元件所需視圖，你必須使用getView（「elementId」）。

INDEX.XML

<Alloy> 
    <Window id="fblogin" class="container"> 
     <Require src="loginsuccess" id="loginsuccess"></Require> 
     <Require src="loginFailure" id="loginFailure"></Require> 
     <Require src="loginPage" id="loginPage"></Require> 
    </Window> 
</Alloy> 

loginsuccess.xml

<Alloy> 
    <View class="container" id="successContainer" visible="false"> 
     <Label>Login Successful</Label>  
    </View> 
</Alloy> 

index.js

var successView = $.loginsuccess.getView('successContainer'); 

現在，您可以perfor m你在successView上的交叉淡入淡出。

編輯：
新增可見= 「假」 到容器視圖